annotate sat_templates/templates/bulma/static/styles.css @ 230:0e69b5843c2f

theme: bulma theme first draft: This theme uses the Bulma CSS framework, Brython to handle the menu on touch devices, and Sass to customize Bulma. CSS default fallbacks are disabled as Bulma uses its own naming conventions, and default fallbacks would lead to hard to debug conflicts. `common.js` has been slightly improved to handle custom classed in `tab_select` The theme is not complete yet, but it is functional.
author Goffi <goffi@goffi.org>
date Tue, 19 May 2020 00:02:34 +0200
parents
children f5f428a50c10
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
1 :root {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
2 --photo-height: 280px;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
3 --photo-height--poster: 500px;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
4 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
5
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
6 .has-whitespace-pre {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
7 white-space: pre;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
8 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
9
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
10 .is-avatar {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
11 height: 64px;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
12 width: 64px;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
13 border-radius: 50%;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
14 border: 1px solid #bbb;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
15 background-color: #eee;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
16 overflow: hidden;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
17 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
18
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
19 .is-photo-thumbnail {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
20 max-height: var(--photo-height);
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
21 max-width: 100%;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
22 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
23
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
24 .is-photo-thumbnail-container {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
25 height: var(--photo-height);
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
26 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
27
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
28 .has-items-centered {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
29 align-items: center;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
30 justify-content: center;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
31 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
32
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
33 .is-poster {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
34 height: var(--photo-height--poster) !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
35 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
36
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
37 .is-poster>.is-photo-thumbnail {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
38 max-height: var(--photo-height--poster) !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
39 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
40
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
41 .has-items-vcentered {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
42 align-items: center;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
43 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
44
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
45
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
46 .x-is-hoverable:hover {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
47 background-color: #eee !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
48 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
49
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
50 .is-chat-message {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
51 margin: 0.5rem 0 0 !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
52 padding: 0 !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
53 border: 0 !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
54 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
55
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
56 a.is-wrapping {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
57 line-height: 0;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
58 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
59
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
60 .has-margin-top-1 {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
61 margin-top: 1rem;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
62 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
63
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
64 .has-vmargin-1 {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
65 margin: 0.5rem 0;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
66 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
67
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
68 .has-padding-1 {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
69 padding: 0.25rem;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
70 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
71
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
72 .has-vpadding-1 {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
73 padding: 0 0.25rem;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
74 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
75
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
76 .has-vpadding-6 {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
77 padding: 0 1.5rem;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
78 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
79
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
80 .has-no-background {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
81 box-shadow: none !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
82 background-color: initial !important;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
83 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
84
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
85 .pagination-disabled {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
86 background-color: white;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
87 border-color: #dbdbdb;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
88 color: #b5b5b5;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
89 cursor: auto;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
90 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
91
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
92 .pagination-disabled:hover {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
93 background-color: white;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
94 border-color: #dbdbdb;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
95 color: #b5b5b5;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
96 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
97
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
98 .has-text-shortenable {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
99 overflow: hidden;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
100 text-overflow: ellipsis;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
101 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
102
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
103
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
104 .panel-drawer {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
105 /* A panel which is hidden by default but can be
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
106 opened when it's clicked */
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
107 max-height: 0;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
108 opacity: 0;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
109 overflow: hidden;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
110 transition: max-height 0.5s, opacity 0.5s;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
111 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
112
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
113 .panel-drawer.state_clicked {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
114 opacity: 1;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
115 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
116
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
117 /********
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
118 * code *
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
119 ********/
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
120
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
121 .highlight {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
122 overflow: auto;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
123 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
124
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
125 /**********
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
126 * blocks *
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
127 **********/
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
128
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
129 .block_separator {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
130 font-size: 1.4em;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
131 display: flex;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
132 margin: 1rem 0;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
133 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
134
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
135 .block_separator__label {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
136 display: inline-block;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
137 margin: 0 0.2em;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
138 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
139
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
140 .block_separator__line {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
141 height: 1px;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
142 background: #ccc;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
143 flex: 1;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
144 margin-top: 0.7em;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
145 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
146
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
147 /********
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
148 * tabs *
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
149 *******/
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
150
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
151 #tab_guests {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
152 overflow: auto;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
153 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
154
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
155 .tab__page {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
156 display: None;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
157 }
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
158
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
159 .tab__page.state_clicked {
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
160 display: block;
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
161 }