X-Git-Url: https://git.pterodactylus.net/?a=blobdiff_plain;f=src%2Fmain%2Fresources%2Fstatic%2Fcss%2Fsone.css;h=49f2cbaaa9486e933bc10d8320688cbd874a5778;hb=a404c9c2b1908f4b9181d8e60f11b846812757fb;hp=775452869e969432448f0ccd15bbf315d05e9274;hpb=14dd8f2dcddb3ebfa0618677f10fe11b8f86ecdd;p=Sone.git diff --git a/src/main/resources/static/css/sone.css b/src/main/resources/static/css/sone.css index 7754528..49f2cba 100644 --- a/src/main/resources/static/css/sone.css +++ b/src/main/resources/static/css/sone.css @@ -353,6 +353,54 @@ textarea { cursor: pointer; } +#sone .linked-album { + display: table; + margin-top: 1ex; + border-collapse: collapse; +} + +#sone .linked-album .album-header { + display: table-caption; + margin-bottom: 1ex; +} + +#sone .linked-album .album-header .album-title { + font-size: 150%; + font-weight: bold; +} + +#sone .linked-image { + display: table-row; +} + +#sone .linked-image .image-left { + display: table-cell; + padding-bottom: 1ex; +} + +#sone .linked-image .image { + width: 160px; + height: 90px; + overflow: hidden; + border: solid 1px black; + display: inline-block; + padding: 0px; +} + +#sone .linked-image .about-image { + display: table-cell; + padding-left: 1ex; +} + +#sone .linked-image .about-image .title { + font-size: 110%; + font-weight: bold; +} + +#sone .linked-image .about-image .description { + margin-top: 0.5ex; +} + #sone .post .status-line { margin-top: 0.5ex; font-size: 85%; @@ -678,39 +726,74 @@ textarea { display: inline; } -#sone .album { +#sone .image .edit-image input, #sone .album .edit-album input { + width: 95%; } -#sone .image-row, #sone .album-row { +#sone .image .edit-image textarea, #sone .album .edit-album textarea { + width: 95%; +} + +#sone .images { + display: table; + width: 100%; +} + +#sone .album-row, #sone .image-row { display: table-row; + border-collapse: separate; } -#sone .image-container, #sone .album-container { - width: 250px; - height: 250px; +#sone .album-row .album, #sone .image-row .image-in-album { + display: table-cell; + width: 50%; +} + +#sone .image-with-information { + position: relative; + margin-top: 1ex; + margin-bottom: 1ex; + height: 122px; overflow: hidden; - padding: -1px; +} + +#sone .image { + position: absolute; border: solid 1px #000; + width: 160px; + height: 120px; + overflow: hidden; } -#sone .image, #sone .album { - display: table-cell; - vertical-align: top; - text-align: center; - padding: 0.5ex; +#sone .image img { + position: absolute; } -#sone .single-image img { - border: solid 1px #000; - background-color: #fff; +#sone .information { + margin-left: 160px; + padding-left: 1ex; } -#sone .image .edit-image input, #sone .album .edit-album input { - width: 95%; +#sone .image-with-information .information .link { + display: inline; + font-size: 80%; } -#sone .image .edit-image textarea, #sone .album .edit-album textarea { - width: 95%; +#sone .image-with-information .information .link a { + text-decoration: none; +} + +#sone .image-with-information .information .title { + display: inline; + font-weight: bold; +} + +#sone .image-with-information .information .author { + display: block; +} + +#sone .image-with-information .information .description { + margin-top: 1ex; } #sone .image .album-sone { @@ -800,6 +883,10 @@ textarea { float: right; } +#sone .clear { + clear: both; +} + #sone h1 { font-family: inherit; font-size: 200%;