Mercurial > libervia-templates
comparison sat_templates/templates/bulma/static/styles.css @ 413:0190a0d32909 default tip
Forum: Major redesign of forums:
Forums have been redesigned. They follow the new general design with 2 or 3 panels,
allowing to have directly a forum if one is found/set up, and a panel on the left to
search/discover other ones.
Categories have been rewritten to be usable with pubsub relationships, a XEP-0277 type
node is used for topics, and each item has a comments node for the threads.
The thread view is set in `forum/show_messages.html` template. It has a header with a
search box and a button to (un)subscribe.
Items are displayed with the same macros as for the blog items.
Below a room is set for editor, tags and attachments.
rel 463
| author | Goffi <goffi@goffi.org> |
|---|---|
| date | Fri, 05 Sep 2025 21:54:09 +0200 |
| parents | a5588ea3bcd6 |
| children |
comparison
equal
deleted
inserted
replaced
| 412:c1d33d7e4b96 | 413:0190a0d32909 |
|---|---|
| 62 | 62 |
| 63 .menu-item { | 63 .menu-item { |
| 64 padding-top: 0.225em; | 64 padding-top: 0.225em; |
| 65 } | 65 } |
| 66 | 66 |
| 67 | |
| 68 .is-text-content { | |
| 69 white-space: break-spaces; | |
| 70 } | |
| 71 | |
| 72 | |
| 67 .avatar { | 73 .avatar { |
| 68 width: 40px; | 74 width: 40px; |
| 69 height: 40px; | 75 height: 40px; |
| 70 border-radius: 50%; | 76 border-radius: 50%; |
| 71 background-color: #3273dc; | 77 background-color: #3273dc; |
| 82 } | 88 } |
| 83 | 89 |
| 84 div.search-item.is-selected { | 90 div.search-item.is-selected { |
| 85 background-color: var(--selected-item-bg); | 91 background-color: var(--selected-item-bg); |
| 86 } | 92 } |
| 87 | |
| 88 | 93 |
| 89 .collapsible-content { | 94 .collapsible-content { |
| 90 overflow: hidden; | 95 overflow: hidden; |
| 91 max-height: 0; | 96 max-height: 0; |
| 92 opacity: 1; | 97 opacity: 1; |
| 313 | 318 |
| 314 .modal-panel.closing .modal-panel-container.is-bottom { | 319 .modal-panel.closing .modal-panel-container.is-bottom { |
| 315 transform: translateY(100%) !important; | 320 transform: translateY(100%) !important; |
| 316 } | 321 } |
| 317 | 322 |
| 323 .thumbnail-image { | |
| 324 max-height: 100%; | |
| 325 } | |
| 326 | |
| 327 /* Tags */ | |
| 328 | |
| 329 .tag_input { | |
| 330 display: inline-block; | |
| 331 width: 6rem; | |
| 332 } | |
| 333 | |
| 334 /* Attachments */ | |
| 335 | |
| 336 .attachments { | |
| 337 opacity: 1; | |
| 338 max-height: 1000px; | |
| 339 transition: opacity 0.5s ease-in-out, max-height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out; | |
| 340 overflow-x: auto; | |
| 341 overflow-y: hidden; | |
| 342 padding: 1.25rem 0; | |
| 343 margin: 0; | |
| 344 white-space: nowrap; | |
| 345 } | |
| 346 | |
| 347 .attachments.is-contracted { | |
| 348 opacity: 0; | |
| 349 max-height: 0; | |
| 350 padding: 0; | |
| 351 } | |
| 352 | |
| 353 .attachment-preview { | |
| 354 position: relative; | |
| 355 border: 1px solid #dbdbdb; | |
| 356 padding: 0.3rem 0.5rem; | |
| 357 border-radius: 4px; | |
| 358 background-color: #f5f5f5; | |
| 359 margin: 0 1rem 0 0 !important; | |
| 360 width: 9rem; | |
| 361 } | |
| 362 | |
| 363 .progress_finished progress { | |
| 364 opacity: 0; | |
| 365 } | |
| 318 | 366 |
| 319 /* Responsive */ | 367 /* Responsive */ |
| 320 | 368 |
| 321 | 369 |
| 322 @media screen and (max-width: 768px) { | 370 @media screen and (max-width: 768px) { |