.room-details-group overlay { margin-bottom: 6px; } .room-details-group avatar * { /* Undo non-sensitive style. */ filter: none; } .room-details-group entry:disabled { border-color: transparent; /* Undo non-sensitive style. */ color: @theme_text_color; background: none; } .room-details-group entry textview { /* Undo non-sensitive style. */ color: @theme_text_color; background: none; } .room-details-group entry text { /* Undo non-sensitive style. */ color: @theme_text_color; background: none; } .room-details-name { font-size: 2em; margin-bottom: 6px; } .room-details-topic { margin-bottom: 6px; } .badge { color: white; background-color: lightgrey; border-radius: 0.4em; padding: 0.1em 0.5em; font-size: 0.8em; margin-left: 0.5em; } .admin { color: white; background: #cc5959; } .mod { color: black; background-color: #cea63a; } .title-header { font-size: 36px; font-weight: bold; } .pill-button { border-radius: 9999px; padding: 12px 40px; } .inline-pill { border-radius: 9999px; background-color: alpha(@theme_text_color, 0.1); padding-right: 6px; } .app-notification .inline-pill { background-color: alpha(@theme_bg_color, 0.2); } .selected-avatar avatar { border: 2px solid @accent_bg_color; } .blue-checkmark { color: white; border-radius: 9999px; border: solid @accent_bg_color 2px; background-color: @accent_bg_color; } /* Login */ .login { min-width: 250px; } .session-verification .text-button { min-width: 200px; } #devnotice { background-color: lighter(alpha(@warning_color, 0.3)); color: shade(@warning_color, 0.5); padding: 12px 24px; border-radius: 9px; } /* Session */ .session-loading-spinner { min-width: 32px; min-height: 32px; } headerbar.flat { background: none; border: none; } /* Account switcher */ #account-switcher row { border-radius: 10px; margin-top: 2px; margin-bottom: 2px; padding-top: 7px; padding-bottom: 7px; } #account-switcher .user-id { font-size: 12px; } #new-login-icon { /* * 2 * padding + pixel-size = size (of avatar) */ padding: 12px; background-color: lightgrey; border-radius: 9999px; } /* Sidebar List */ .sidebar-list row { padding-left: 10px; padding-right: 10px; } .sidebar-list .category { margin-top: 4px; font-size: 0.8em; font-weight: bold; } .sidebar-list .entry { margin-top: 4px; font-weight: bold; } .sidebar-list .category image.arrow { transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } .sidebar-list .category .category-row:not(:checked) image.arrow:dir(ltr) { transform: rotate(-0.25turn); } .sidebar-list .category .category-row:not(:checked) image.arrow:dir(rtl) { transform: rotate(0.25turn); } .sidebar-list .room { padding-top: 4px; padding-bottom: 4px; } .sidebar-list .room .bold { font-weight: bold; } .sidebar-list .room .notification_count { /* TODO: use correct color variable */ background-color: #555; color: white; font-weight: bold; font-size: 0.8em; border-radius: 10px; min-width: 0.7em; padding: 2px 5px; } .sidebar-list .room .highlight { background-color: @accent_bg_color; } /* Content */ .room-history { background: @theme_base_color; } .room-history row { min-height: 0; padding-top: 6px; padding-bottom: 6px; } .room-history row.has-header { margin-top: 6px; } .room-history .event-content { margin-right: 46px; } .room-history row:not(.has-header) .event-content { margin-left: 46px; } .room-history .event-content .thumbnail { border-radius: 6px; } .room-history .event-content .quote { border-left: 2px solid @theme_selected_bg_color; padding-left: 6px; } .divider-row { font-size: 0.9em; font-weight: bold; } .timestamp { min-width: 36px; font-weight: normal; } .codeview { border-radius: 5px; padding: 6px; font-family: monospace; background-color: @text_view_bg; color: @theme_text_color; } .message-entry .view { padding: 7px 0; } .invite-room-name { font-size: 24px; } .app-notification { border-radius: 9999px; padding-left: 24px; } /* Event Source Dialog */ .event-source-dialog .sourceview { background-color: @theme_base_color; padding: 6px; } .explore listview row { padding: 12px; } listview.content { border-radius: 9px; border-width: 1px; border-style: solid; } listview.content row:last-child { border-bottom-width: 0px; } .bold { font-weight: bold; } button.cutout { box-shadow: 0 0 0 2px @theme_bg_color; background-color: #e2e2e1; } button.cutout:hover { background-color: #d8d8d7; } button.cutout:active { background-color: #c4c5c4; } .emoji { font-size: 2em; }