Mercurial > libervia-templates

annotate default/static/blog.css @ 85:05b500bd6235

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
chat: chat implementation, first draft: this chat use the new dynamic pages feature. Updates are pushed directly by server. Identities are used to retrieve avatar, and first letter of nickname is used to generate an avatar is none is found (temporary, a more elaborate avatar generation should follow in the future). Scroll is done automatically when new messages arrive, except if scroll is not at the end, as it probably means that user is checking history. User can resize text area and use [shift] + [enter] to enter multi-line messages. History will then scroll to bottom after message has been sent.
author Goffi <goffi@goffi.org>
date Wed, 03 Jan 2018 01:12:16 +0100
parents 580670430fa2
children 650f3456f80d
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
1 /*** articles ***/
16
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
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
5 margin: 2% auto;
33
be1aebaccac0 static/blog.css: removed max-height for comments
Goffi <goffi@goffi.org>
parents: 30
diff changeset
6 border-style: solid none none;
0
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
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;
42
0c6aa1c81252 blog/item: transition fix
Goffi <goffi@goffi.org>
parents: 35
diff changeset
11 transition: max-height 0.5s;
16
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
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
17 }
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
18
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
19 /** header **/
16
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
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
34 /** content **/
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
35
0
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
36 article div.content {
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
37 text-align: justify;
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
38 font-size: 0.9em;
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
39 }
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
40
35
581e2cd4bcc2 static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents: 33
diff changeset
41 article div.content.text {
581e2cd4bcc2 static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents: 33
diff changeset
42 white-space: pre-wrap;
581e2cd4bcc2 static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents: 33
diff changeset
43 }
581e2cd4bcc2 static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents: 33
diff changeset
44
581e2cd4bcc2 static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents: 33
diff changeset
45
0
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
46 article img {
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
47 max-width: 100%;
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
48 margin: 0;
0
9a31d2c02f47 SàT templates, initial commit
Goffi <goffi@goffi.org>
parents:
diff changeset
49 }
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
50
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
51 /** reduce/expand buttons **/
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
52
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
53 .expand_box {
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
54 cursor: pointer;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
55 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
56
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
57 .box_top {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
58 position: absolute;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
59 top: 0;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
60 left: 0;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
61 width: 100%;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
62 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
63
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
64 .box_bottom {
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
65 position: absolute;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
66 bottom: 0;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
67 left: 0;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
68 width: 100%;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
69 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
70
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
71 .expand_box.box_bottom::before {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
72 /* we do a gradient to show that text can be expanded */
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
73 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
74 display: block;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
75 content: "";
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
76 width: 100%;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
77 height: 4em;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
78 border: none;
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
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
81 .expand_box p {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
82 background-color: white;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
83 margin: 0;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
84 text-align: center;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
85 font-weight: bold;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
86 font-size: 0.8em;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
87 border-style: solid none dotted none;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
88 border-width: 1px 0 1px;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
89 border-bottom-color: gray;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
90 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
91
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
92 article .expand_box .hide {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
93 /* when not clicked, we only display .show */
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
94 display: none;
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
95 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
96
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
97 article .expand_box.box_top {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
98 /* top expand box only show a reduce button
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
99 * so it should be displayed only when article is .clicked */
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
100 display: none;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
101 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
102
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
103 /** other language **/
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
104
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
105 /* we hide everything just to display a message informing that
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
106 * the item is in an other language, and asking to click
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
107 * to display it */
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
108
30
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
109 article.other_lang>div.info {
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
110 display: none;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
111 }
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
112
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
113 article.other_lang.init>* {
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
114 display: none;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
115 }
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
116
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
117 article.other_lang.init>div.info {
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
118 display: initial;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
119 }
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
120
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
121 article.other_lang.init>div.expand_box.box_top {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
122 /* as we need to have the message clickable, we cheat and use
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
123 * expand box on the whole surface but fully transparent */
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
124 display: initial;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
125 height: 100%;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
126 opacity: 0;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
127 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
128
30
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
129 article.other_lang.init>div.info>p {
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
130 margin: 0;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
131 padding: 0.2em;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
132 text-align: center;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
133 font-style: italic;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
134 }
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
135
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
136 article.other_lang.init {
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
137 border: none;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
138 border-radius: 0;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
139 padding: 0;
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
140 }
69a2e3bf5e17 blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents: 16
diff changeset
141
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
142 /*** comments ***/
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
143
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
144 button.comments_btn {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
145 border: none;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
146 font-weight: bold;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
147 display: block;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
148 margin: 0 10% 0 auto;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
149 border-radius: 1em;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
150 background: #b8bcc4;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
151 color: #4d4d4d;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
152 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
153
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
154 button.comments_btn:active {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
155 background: #4d4d4d;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
156 color: #b8bcc4;
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
43
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
159 button.comments_btn.clicked span.show {
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
160 display: none;
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
161 }
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
162
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
163 button.comments_btn:not(.clicked) span.hide {
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
164 display: none;
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
165 }
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
166
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
167 .comments_panel {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
168 max-height: 0;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
169 opacity: 0;
43
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
170 transition: max-height 1s, opacity 2s;
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
171 overflow: hidden;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
172 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
173
43
f8798d691acf blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents: 42
diff changeset
174 .comments_panel.clicked {
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
175 opacity: 1;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
176 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
177
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
178 .comments article {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
179 background-color: #9ca0a8;
33
be1aebaccac0 static/blog.css: removed max-height for comments
Goffi <goffi@goffi.org>
parents: 30
diff changeset
180 border: none;
be1aebaccac0 static/blog.css: removed max-height for comments
Goffi <goffi@goffi.org>
parents: 30
diff changeset
181 max-height: none;
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
182 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
183
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
184 .comment_post {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
185 text-align: center;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
186 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
187
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
188 .comment_post input {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
189 display: block;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
190 margin: 0 auto;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
191 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
192
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
193 .comment_post textarea {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
194 border-style: solid;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
195 border-width: 1px 0;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
196 border-color: black;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
197 max-width: 100%;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
198 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
199
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
200 .comments_panel article .expand_box {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
201 /* no expand box in comments */
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
202 display: none;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
203 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
204
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
205 /*** media queries ***/
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
206
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
207 @media (min-width: 500px) {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
208 article.box {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
209 width: 80%;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
210 border-style: solid solid none solid;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
211 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
212 .comments article.box {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
213 width: 30rem;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
214 margin: 2% auto;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
215 border: none;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
216 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
217 .comment_post textarea {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
218 border-width: 1px;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
219 border-radius: 1em;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
220 border: solid 1px;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
221 padding: 0.5em;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
222 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
223
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
224 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
225
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
226 /*** clicked ***/
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
227
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
228 .main_article article.clicked {
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
229 border-bottom-style: solid;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
230 }
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
231
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
232 .main_article article.clicked .expand_box.box_top {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
233 display: initial;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
234 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
235
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
236 .main_article article.clicked .expand_box {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
237 opacity: 0;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
238 transition: opacity 0.5s;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
239 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
240
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
241 .main_article article.clicked .expand_box p {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
242 background-color: transparent;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
243 border: none;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
244 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
245
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
246 .main_article article.clicked .expand_box:hover {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
247 opacity: 1;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
248 color: grey;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
249 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
250
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
251 .main_article article.clicked .expand_box::before {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
252 background-image: none;
16
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
253 display: none;
8cdcbe0d7dee blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents: 1
diff changeset
254 }
44
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
255
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
256 .main_article article.clicked .expand_box .hide {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
257 display: inline;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
258 }
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
259
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
260 .main_article article.clicked .expand_box .show {
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
261 display: none;
580670430fa2 blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents: 43
diff changeset
262 }