Mercurial > libervia-templates

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

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
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
comparison
equal deleted inserted replaced
229:739c3e6999fa 230:0e69b5843c2f
1 :root {
2 --photo-height: 280px;
3 --photo-height--poster: 500px;
4 }
5
6 .has-whitespace-pre {
7 white-space: pre;
8 }
9
10 .is-avatar {
11 height: 64px;
12 width: 64px;
13 border-radius: 50%;
14 border: 1px solid #bbb;
15 background-color: #eee;
16 overflow: hidden;
17 }
18
19 .is-photo-thumbnail {
20 max-height: var(--photo-height);
21 max-width: 100%;
22 }
23
24 .is-photo-thumbnail-container {
25 height: var(--photo-height);
26 }
27
28 .has-items-centered {
29 align-items: center;
30 justify-content: center;
31 }
32
33 .is-poster {
34 height: var(--photo-height--poster) !important;
35 }
36
37 .is-poster>.is-photo-thumbnail {
38 max-height: var(--photo-height--poster) !important;
39 }
40
41 .has-items-vcentered {
42 align-items: center;
43 }
44
45
46 .x-is-hoverable:hover {
47 background-color: #eee !important;
48 }
49
50 .is-chat-message {
51 margin: 0.5rem 0 0 !important;
52 padding: 0 !important;
53 border: 0 !important;
54 }
55
56 a.is-wrapping {
57 line-height: 0;
58 }
59
60 .has-margin-top-1 {
61 margin-top: 1rem;
62 }
63
64 .has-vmargin-1 {
65 margin: 0.5rem 0;
66 }
67
68 .has-padding-1 {
69 padding: 0.25rem;
70 }
71
72 .has-vpadding-1 {
73 padding: 0 0.25rem;
74 }
75
76 .has-vpadding-6 {
77 padding: 0 1.5rem;
78 }
79
80 .has-no-background {
81 box-shadow: none !important;
82 background-color: initial !important;
83 }
84
85 .pagination-disabled {
86 background-color: white;
87 border-color: #dbdbdb;
88 color: #b5b5b5;
89 cursor: auto;
90 }
91
92 .pagination-disabled:hover {
93 background-color: white;
94 border-color: #dbdbdb;
95 color: #b5b5b5;
96 }
97
98 .has-text-shortenable {
99 overflow: hidden;
100 text-overflow: ellipsis;
101 }
102
103
104 .panel-drawer {
105 /* A panel which is hidden by default but can be
106 opened when it's clicked */
107 max-height: 0;
108 opacity: 0;
109 overflow: hidden;
110 transition: max-height 0.5s, opacity 0.5s;
111 }
112
113 .panel-drawer.state_clicked {
114 opacity: 1;
115 }
116
117 /********
118 * code *
119 ********/
120
121 .highlight {
122 overflow: auto;
123 }
124
125 /**********
126 * blocks *
127 **********/
128
129 .block_separator {
130 font-size: 1.4em;
131 display: flex;
132 margin: 1rem 0;
133 }
134
135 .block_separator__label {
136 display: inline-block;
137 margin: 0 0.2em;
138 }
139
140 .block_separator__line {
141 height: 1px;
142 background: #ccc;
143 flex: 1;
144 margin-top: 0.7em;
145 }
146
147 /********
148 * tabs *
149 *******/
150
151 #tab_guests {
152 overflow: auto;
153 }
154
155 .tab__page {
156 display: None;
157 }
158
159 .tab__page.state_clicked {
160 display: block;
161 }