Mercurial > libervia-templates
annotate default/static/blog.css @ 23:2de729fac73b
babel settings + fr and sk translations, first drafts
author | Goffi <goffi@goffi.org> |
---|---|
date | Sun, 21 May 2017 16:14:11 +0200 |
parents | 8cdcbe0d7dee |
children | 69a2e3bf5e17 |
rev | line source |
---|---|
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
1 /**** articles ****/ |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
2 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
3 article.box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
4 position: relative; |
0 | 5 margin: 2% auto; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
6 border-style: solid None None; |
0 | 7 border-width: 1px; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
8 padding: 2%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
9 max-height: 7em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
10 overflow: hidden; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
11 transition: max-height 2s; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
12 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
13 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
14 .main_article article.box:not(.clicked) { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
15 border-bottom-right-radius: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
16 border-bottom-left-radius: 0; |
0 | 17 } |
18 | |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
19 /* header */ |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
20 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
21 header .metadata { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
22 text-align: right; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
23 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
24 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
25 article .author { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
26 font-weight: bold; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
27 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
28 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
29 article .author::after { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
30 content: ", "; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
31 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
32 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
33 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
34 /* content */ |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
35 |
0 | 36 article div.content { |
37 text-align: justify; | |
38 font-size: 0.9em; | |
39 } | |
40 | |
41 article img { | |
42 max-width: 100%; | |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
43 margin: 0; |
0 | 44 } |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
45 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
46 .expand_box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
47 display: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
48 position: absolute; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
49 bottom: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
50 left: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
51 width: 100%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
52 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
53 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
54 .expand_box::before { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
55 background-image: linear-gradient(to bottom,rgba(0,0,0,0),#ffffff); |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
56 display: block; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
57 content: ""; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
58 width: 100%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
59 height: 4em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
60 border: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
61 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
62 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
63 .expand_box p { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
64 background-color: white; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
65 margin: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
66 text-align: center; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
67 font-weight: bold; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
68 font-size: 0.8em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
69 border-style: solid none dotted none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
70 border-width: 1px 0 1px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
71 border-bottom-color: gray; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
72 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
73 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
74 .main_article .expand_box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
75 display: initial; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
76 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
77 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
78 /**** comments ****/ |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
79 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
80 button.comments_btn { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
81 border: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
82 font-weight: bold; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
83 display: block; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
84 margin: 0 10% 0 auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
85 border-radius: 1em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
86 background: #b8bcc4; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
87 color: #4d4d4d; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
88 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
89 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
90 button.comments_btn:active { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
91 background: #4d4d4d; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
92 color: #b8bcc4; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
93 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
94 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
95 .comments_panel { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
96 max-height: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
97 opacity: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
98 transition: max-height 2s, opacity 4s; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
99 overflow: hidden; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
100 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
101 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
102 .comments_panel.show { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
103 max-height: 10000px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
104 overflow: auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
105 opacity: 1; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
106 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
107 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
108 .comments article { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
109 background-color: #9ca0a8; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
110 border: None; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
111 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
112 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
113 .comment_post { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
114 text-align: center; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
115 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
116 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
117 .comment_post input { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
118 display: block; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
119 margin: 0 auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
120 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
121 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
122 .comment_post textarea { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
123 border-style: solid; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
124 border-width: 1px 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
125 border-color: black; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
126 max-width: 100%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
127 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
128 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
129 /**** media queries ****/ |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
130 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
131 @media (min-width: 500px) { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
132 article.box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
133 width: 80%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
134 border-style: solid solid none solid; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
135 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
136 .comments article.box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
137 width: 30rem; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
138 margin: 2% auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
139 border: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
140 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
141 .comment_post textarea { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
142 border-width: 1px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
143 border-radius: 1em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
144 border: solid 1px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
145 padding: 0.5em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
146 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
147 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
148 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
149 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
150 /**** clicked ****/ |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
151 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
152 .main_article article.clicked { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
153 max-height: 10000px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
154 border-bottom-style: solid; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
155 overflow: auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
156 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
157 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
158 .clicked .expand_box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
159 display: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
160 } |