Mercurial > libervia-templates
annotate sat_templates/templates/bulma/static/styles.css @ 240:cb08d92f181f
bulma (invitation/welcome): design for the welcome page
| author | Goffi <goffi@goffi.org> |
|---|---|
| date | Fri, 19 Jun 2020 17:57:13 +0200 |
| parents | f5f428a50c10 |
| children | bb5193cef770 |
| rev | line source |
|---|---|
| 230 | 1 :root { |
| 2 --photo-height: 280px; | |
| 3 --photo-height--poster: 500px; | |
| 4 } | |
| 5 | |
|
235
f5f428a50c10
chat, ticket: use `pre-wrap` instead of `pre` for whitespaces
Goffi <goffi@goffi.org>
parents:
230
diff
changeset
|
6 .has-whitespace-pre-wrap { |
|
f5f428a50c10
chat, ticket: use `pre-wrap` instead of `pre` for whitespaces
Goffi <goffi@goffi.org>
parents:
230
diff
changeset
|
7 white-space: pre-wrap; |
| 230 | 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 } |