aboutsummaryrefslogtreecommitdiff
path: root/juick-www/src/main
diff options
context:
space:
mode:
Diffstat (limited to 'juick-www/src/main')
-rw-r--r--juick-www/src/main/static/style.css223
1 files changed, 129 insertions, 94 deletions
diff --git a/juick-www/src/main/static/style.css b/juick-www/src/main/static/style.css
index 0958f5e5..672db5c6 100644
--- a/juick-www/src/main/static/style.css
+++ b/juick-www/src/main/static/style.css
@@ -1,8 +1,21 @@
-html,body,div,h1,h2,ul,li,p,form,input,textarea,pre {
+html,
+body,
+div,
+h1,
+h2,
+ul,
+li,
+p,
+form,
+input,
+textarea,
+pre {
margin: 0;
padding: 0;
}
-html,input,textarea {
+html,
+input,
+textarea {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-size: 12pt;
-webkit-font-smoothing: subpixel-antialiased;
@@ -15,7 +28,8 @@ body {
margin: 0 auto;
width: 1000px;
}
-h1,h2 {
+h1,
+h2 {
font-weight: normal;
}
ul {
@@ -25,7 +39,8 @@ a {
color: #069;
text-decoration: none;
}
-img,hr {
+img,
+hr {
border: none;
}
hr {
@@ -60,10 +75,10 @@ pre::-moz-selection {
clear: both;
position: relative;
}
-body>header {
+body > header {
width: 1000px;
}
-body>header a {
+body > header a {
border-bottom: 1px dotted #666;
color: #222;
font-size: 13pt;
@@ -84,10 +99,10 @@ body>header a {
white-space: nowrap;
width: 110px;
}
-@media screen and (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
+@media screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
#logo a {
- background: url("logo@2x.png") no-repeat;
- background-size: cover;
+ background: url("logo@2x.png") no-repeat;
+ background-size: cover;
}
}
#global {
@@ -124,22 +139,24 @@ body>header a {
right: 8px;
top: 0;
}
-body>header nav li:after {
+body > header nav li:after {
color: #AAA;
content: "/";
display: inline-block;
margin-left: 12px;
}
-body>header nav li:last-child:after {
+body > header nav li:last-child:after {
display: none;
}
-body>header p {
+body > header p {
color: #222;
font-size: 13pt;
margin: 12px 0;
text-align: center;
}
-#content>p, #content>h1, #content>h2 {
+#content > p,
+#content > h1,
+#content > h2 {
margin: 1em 0;
}
#newmessage {
@@ -161,7 +178,7 @@ body>header p {
margin: 5px 0;
padding: 2px 4px;
}
-#newmessage>div {
+#newmessage > div {
display: none;
}
#newmessage .img {
@@ -213,21 +230,21 @@ article .ir a {
article .ir img {
max-width: 100%;
}
-article>nav.l {
+article > nav.l {
display: inline-block;
font-size: 10pt;
}
-article>nav.l a {
+article > nav.l a {
border-bottom: 1px dotted #AAA;
color: #888;
margin-right: 15px;
}
-article>nav.s {
+article > nav.s {
display: block;
float: right;
text-align: right;
}
-article>nav.s a {
+article > nav.s a {
color: #222;
font-weight: bold;
vertical-align: middle;
@@ -264,7 +281,8 @@ article .tags {
.msg-tags {
margin-top: 5px;
}
-article .tags>a, .msg-tags>a {
+article .tags > a,
+.msg-tags > a {
border: 1px dotted #ccc;
color: #888;
display: inline-block;
@@ -312,24 +330,26 @@ article .tags>a, .msg-tags>a {
margin-top: 2.4px;
width: 16px;
}
-.msg-menu>a {
+.msg-menu > a {
background: url("menu.png") no-repeat;
display: block;
height: 16px;
width: 16px;
}
-.msg-ts, article .t {
+.msg-ts,
+article .t {
float: right;
font-size: small;
vertical-align: top;
}
-.msg-ts, .msg-ts>a {
+.msg-ts,
+.msg-ts > a {
color: #999;
}
.msg-place {
font-size: small;
}
-.msg-place>a {
+.msg-place > a {
color: #999;
}
.msg-txt {
@@ -407,7 +427,8 @@ article .tags>a, .msg-tags>a {
.reply-new .msg-cont {
border-right: 5px solid #0C0;
}
-q:before, q:after {
+q:before,
+q:after {
content: "";
}
q {
@@ -422,7 +443,8 @@ q {
border-top: 1px solid #CCC;
width: 680px;
}
-.toolbar ul, .toolbar a {
+.toolbar ul,
+.toolbar a {
padding: 5px;
}
.toolbar li {
@@ -436,7 +458,8 @@ q {
vertical-align: middle;
width: 16px;
}
-#replies .msg-txt, #private-messages .msg-txt {
+#replies .msg-txt,
+#private-messages .msg-txt {
margin: 0;
}
.msg-comment {
@@ -483,7 +506,7 @@ q {
padding: 5px;
text-align: center;
}
-.signup-h1>img {
+.signup-h1 > img {
margin-right: 10px;
vertical-align: middle;
}
@@ -515,7 +538,9 @@ q {
padding-top: 10px;
width: 240px;
}
-#column ul, #column p, #column hr {
+#column ul,
+#column p,
+#column hr {
margin: 10px 0;
}
#column li {
@@ -609,7 +634,8 @@ q {
padding: 25px;
width: 300px;
}
-#signfb,#signvk {
+#signfb,
+#signvk {
display: block;
height: 32px;
line-height: 32px;
@@ -631,7 +657,8 @@ q {
.dialoglogin form {
margin-top: 7px;
}
-.signinput,.signsubmit {
+.signinput,
+.signsubmit {
border: 1px solid #CCC;
margin: 3px 0;
padding: 3px;
@@ -774,11 +801,11 @@ fieldset {
width: 100%;
}
.embedContainer iframe {
- overflow:hidden;
+ overflow: hidden;
resize: vertical;
display: block;
}
-/* end of embeds*/
+/* end of embeds */
/* nsfw */
article.nsfw .embedContainer img,
article.nsfw .embedContainer iframe,
@@ -789,126 +816,134 @@ article.nsfw .ir img {
article.nsfw .embedContainer img:hover,
article.nsfw .embedContainer iframe:hover,
article.nsfw .ir img:hover {
- opacity: 1.0;
+ opacity: 1;
}
/* end of nsfw */
@media screen and (max-width: 850px) {
body {
- -moz-text-size-adjust: 100%;
- -webkit-text-size-adjust: 100%;
- -ms-text-size-adjust: 100%;
- }
- body,body>header,#topwrapper,#content,#footer,.toolbar {
- float: none;
- margin: 0 auto;
- min-width: 310px;
- width: auto;
- }
- body>header {
- margin-bottom: 15px;
- }
- body>header a {
- font-size: 12pt;
+ -moz-text-size-adjust: 100%;
+ -webkit-text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+ }
+ body,
+ body > header,
+ #topwrapper,
+ #content,
+ #footer,
+ .toolbar {
+ float: none;
+ margin: 0 auto;
+ min-width: 310px;
+ width: auto;
+ }
+ body > header {
+ margin-bottom: 15px;
+ }
+ body > header a {
+ font-size: 12pt;
}
#logo {
- display: none;
+ display: none;
}
#global {
- margin-left: 10px;
+ margin-left: 10px;
}
#global li {
- margin-right: 10px;
+ margin-right: 10px;
}
#search {
- display: inline-block;
- float: none;
- margin: 10px 10px;
+ display: inline-block;
+ float: none;
+ margin: 10px 10px;
}
#headdiv {
- padding: 0 10px;
+ padding: 0 10px;
}
#headdiv li {
- margin-right: 10px;
+ margin-right: 10px;
}
#actions {
- position: relative;
- right: auto;
+ position: relative;
+ right: auto;
}
- #newmessage .img, #newmessage .tags {
- width: 100%;
+ #newmessage .img,
+ #newmessage .tags {
+ width: 100%;
}
#column {
- float: none;
- margin: 0 10px;
- padding-top: 0;
- width: auto;
+ float: none;
+ margin: 0 10px;
+ padding-top: 0;
+ width: auto;
}
article {
- margin: 8px;
- overflow: auto;
+ margin: 8px;
+ overflow: auto;
}
article p {
- margin: 10px 0 8px 0;
+ margin: 10px 0 8px 0;
}
- article>nav.l {
- display: block;
- float: left;
- line-height: 15pt;
- width: 80%;
+ article > nav.l {
+ display: block;
+ float: left;
+ line-height: 15pt;
+ width: 80%;
}
- article>nav.s {
- display: block;
+ article > nav.s {
+ display: block;
}
article textarea {
- width: 205px;
+ width: 205px;
}
article footer {
- float: left;
+ float: left;
}
#content textarea {
- width: 100%;
+ width: 100%;
}
- .msg,.msg-cont {
- min-width: 280px;
- width: auto;
+ .msg,
+ .msg-cont {
+ min-width: 280px;
+ width: auto;
}
- .msg-cont,.ads {
- margin: 8px;
+ .msg-cont,
+ .ads {
+ margin: 8px;
}
.msg-comment textarea {
- width: 100%;
+ width: 100%;
}
.msg-media {
- overflow: auto;
+ overflow: auto;
}
.title2 h2 {
- font-size: large;
+ font-size: large;
}
#footer {
- margin: 0 10px;
+ margin: 0 10px;
}
#footer div {
- float: none;
- margin: 10px 0;
+ float: none;
+ margin: 10px 0;
}
}
@media screen and (max-width: 480px) {
.msg-ts {
- float: none;
+ float: none;
}
.msg-tags {
- margin-top: 10px;
+ margin-top: 10px;
}
.msg-txt {
- padding-top: 5px;
+ padding-top: 5px;
}
.title2 {
- font-size: 11pt;
+ font-size: 11pt;
}
#content .title2 h2 {
- font-size: 11pt;
+ font-size: 11pt;
}
.title2-right {
- line-height: initial;
+ line-height: initial;
}
}