/* Copyright 2009, Red Hat, Inc. * * Portions adapted from Mx's data/style/default.css * Copyright 2009 Intel Corporation * * This program is free software; you can redistribute it and/or modify it * under the terms and conditions of the GNU Lesser General Public License, * version 2.1, as published by the Free Software Foundation. * * This program is distributed in the hope it will be useful, but WITHOUT ANY * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS * FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for * more details. * * You should have received a copy of the GNU Lesser General Public License * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin St - Fifth Floor, Boston, MA 02110-1301 USA. */ /* Text Styles */ /* default text style */ stage { font-family: cantarell, sans-serif; font-size: 11pt; color: white; } /* links */ .shell-link { color: #0000ff; text-decoration: underline; } .shell-link:hover { color: #0000e0; } /* small */ .app-well-menu, .run-dialog-error-label { font-size: 9pt; } /* small bold */ .dash-label, .window-caption, .switcher-list, .app-well-app > .overview-icon, .show-apps > .overview-icon, .grid-search-result .overview-icon { font-size: 9pt; font-weight: bold; } /* Scroll Bars */ StScrollBar { padding: 0px; } StScrollView.vfade { -st-vfade-offset: 68px; } StScrollView.hfade { -st-hfade-offset: 68px; } StScrollView StScrollBar { min-width: 14px; min-height: 14px; } StScrollBar StBin#trough { background-color: rgba(0,0,0,0.3); border-radius: 8px; } StScrollBar StButton#vhandle { background-color: #5d6464; border: 2px solid #242424; border-radius: 8px; } StScrollBar StButton#hhandle { background-color: #5d6464; border: 2px solid #242424; border-radius: 8px; } StScrollBar StButton#hhandle:hover, StScrollBar StButton#vhandle:hover { background-color: #777d7c; } StScrollBar StButton#hhandle:active, StScrollBar StButton#vhandle:active { background-color: #3465a4; } /* Check Boxes */ .check-box ShellGenericContainer { spacing: .8em; } .check-box StBin { width: 24px; height: 22px; background-image: url("checkbox-off.svg"); } .check-box:focus StBin { background-image: url("checkbox-off-focused.svg"); } .check-box:checked StBin { background-image: url("checkbox.svg"); } .check-box:focus:checked StBin { background-image: url("checkbox-focused.svg"); } /* PopupMenu */ .popup-menu-boxpointer, .candidate-popup-boxpointer { -arrow-border-radius: 8px; -arrow-background-color: rgba(0,0,0,0.9); -arrow-border-width: 2px; -arrow-border-color: #a5a5a5; -arrow-base: 24px; -arrow-rise: 11px; } .popup-menu { min-width: 200px; } .popup-submenu-menu-item:open { background-color: #4c4c4c; } .popup-sub-menu { background-gradient-start: rgba(80,80,80,0.3); background-gradient-end: rgba(80,80,80,0.7); background-gradient-direction: vertical; box-shadow: inset 0px 2px 4px rgba(0,0,0,0.9); } .popup-sub-menu:scrolled .popup-menu-item:ltr { padding-right: 0em; } .popup-sub-menu:scrolled .popup-menu-item:rtl { padding-left: 0em; } .popup-sub-menu StScrollBar { padding: 4px; } .popup-sub-menu StScrollBar StBin#trough { border-width: 0px; } .popup-sub-menu StScrollBar StBin#vhandle { background-color: #4c4c4c; border-width: 0px; } .popup-combo-menu { background-color: rgba(0,0,0,0.9); padding: 1em 0em; border: 1px solid #5f5f5f; border-radius: 9px; } /* The remaining popup-menu sizing is all done in ems, so that if you * override .popup-menu.font-size, everything else will scale with it. */ .popup-menu-content { padding: 1em 0em; } .popup-menu-item { padding: .4em 1.75em; spacing: 1em; } .popup-menu-item:active { background-color: #4c4c4c; } .popup-menu-item:insensitive { color: #9f9f9f; } .popup-image-menu-item { } .popup-combobox-item { spacing: 1em; } .popup-separator-menu-item { -gradient-height: 1px; -gradient-start: rgba(255,255,255,0.0); -gradient-end: rgba(255,255,255,0.3); -margin-horizontal: 24px; height: 1px; padding: 8px 0px; } .popup-alternating-menu-item:alternate { font-weight: bold; } .popup-slider-menu-item { height: 1em; min-width: 15em; -slider-height: 0.3em; -slider-background-color: #333333; -slider-border-color: #5f5f5f; -slider-active-background-color: #76b0ec; -slider-active-border-color: #1f6dbc; -slider-border-width: 1px; -slider-handle-radius: 0.5em; } .popup-device-menu-item { spacing: .5em; } .popup-status-menu-item { font-weight: normal; color: #999; } .popup-inactive-menu-item, .popup-inactive-menu-item:insensitive { color: white; } .popup-subtitle-menu-item, .popup-subtitle-menu-item:insensitive { font-weight: bold; color: white; } .popup-menu-icon { icon-size: 1.09em; } .popup-battery-percentage { padding-left: 24px; } /* Switches */ .toggle-switch { width: 65px; height: 22px; } .toggle-switch-us { background-image: url("toggle-off-us.svg"); background-size: contain; } .toggle-switch-us:checked { background-image: url("toggle-on-us.svg"); background-size: contain; } .toggle-switch-intl { background-image: url("toggle-off-intl.svg"); background-size: contain; } .toggle-switch-intl:checked { background-image: url("toggle-on-intl.svg"); background-size: contain; } .nm-menu-item-icons { spacing: .5em; } /* Buttons */ .candidate-page-button, .notification-button, .notification-icon-button, .hotplug-notification-item, .hotplug-resident-eject-button, .modal-dialog-button, .app-view-control { border: 1px solid #8b8b8b; background-gradient-direction: vertical; background-gradient-start: rgba(255, 255, 255, 0.2); background-gradient-end: rgba(255, 255, 255, 0); } .modal-dialog-button { font-weight: bold; } .candidate-page-button:hover, .notification-button:hover, .notification-icon-button:hover, .hotplug-notification-item:hover, .hotplug-resident-eject-button:hover, .modal-dialog-button:hover { background-gradient-start: rgba(255, 255, 255, 0.3); background-gradient-end: rgba(255, 255, 255, 0.1); } .notification-button:focus, .notification-icon-button:focus, .hotplug-notification-item:focus, .modal-dialog-button:focus, .app-view-control:focus { border-width: 2px; } .app-view-control:focus { padding: 3px; } .app-view-control:first-child:ltr:focus, .app-view-control:last-child:rtl:focus { border-right-width: 1px; } .candidate-page-button:active, .candidate-page-button:pressed, .notification-button:active, .notification-icon-button:active, .hotplug-notification-item:active, .hotplug-resident-eject-button:active, .modal-dialog-button:active, .modal-dialog-button:pressed, .app-view-control:checked { background-gradient-start: rgba(255, 255, 255, 0); background-gradient-end: rgba(255, 255, 255, 0.2); } .candidate-page-button:insensitive, .notification-button:insensitive, .notification-icon-button:insensitive, .modal-dialog-button:insensitive { border-color: #666666; color: #9f9f9f; background-gradient-direction: none; background-color: rgba(102, 102, 102, 0.15); } /* Common radii */ #searchEntry, .modal-dialog-button, .notification-button, .hotplug-notification-item, .app-view-controls { border-radius: 18px; } .app-view-control:first-child:ltr, .app-view-control:last-child:rtl { border-radius: 18px 0px 0px 18px; border-right-width: 0px; } .app-view-control:last-child:ltr, .app-view-control:first-child:rtl { border-radius: 0px 18px 18px 0px; } /* Entries */ #searchEntry, .notification StEntry, .modal-dialog StEntry { color: rgb(64, 64, 64); caret-color: rgb(64, 64, 64); font-size: 12pt; caret-size: 1px; selected-color: white; padding: 4px 12px; } #searchEntry, .run-dialog-entry, .notification StEntry { border: 2px solid rgba(245,245,245,0.2); background-gradient-start: rgba(5,5,6,0.1); background-gradient-end: rgba(254,254,254,0.1); background-gradient-direction: vertical; transition-duration: 300ms; box-shadow: inset 0px 2px 4px rgba(0,0,0,0.6); } #searchEntry:focus, #searchEntry:hover, .notification StEntry:focus, .modal-dialog StEntry { border: 2px solid rgb(136,138,133); background-gradient-start: rgb(200,200,200); background-gradient-end: white; background-gradient-direction: vertical; box-shadow: inset 0px 2px 4px rgba(0,0,0,0.6); } .notification StEntry:focus, .modal-dialog StEntry:focus { border: 2px solid #3465a4; } #searchEntry { border-color: rgba(245,245,245,0.3); color: rgb(192, 192, 192); caret-color: rgb(192, 192, 192); } #searchEntry:hover { color: rgb(128, 128, 128); caret-color: rgb(128, 128, 128); } #searchEntry:focus { color: rgb(64, 64, 64); caret-color: rgb(64, 64, 64); font-weight: bold; transition-duration: 0ms; } .notification StEntry, .modal-dialog StEntry { border-radius: 5px; padding: 4px 4px; } .prompt-dialog-password-entry .capslock-warning, .login-dialog-prompt-entry .capslock-warning { icon-size: 16px; warning-color: #999; padding: 0 4px; } .modal-dialog StEntry:insensitive { border-color: #666666; color: #9f9f9f; border: 2px solid #9f9f9f; background-gradient-direction: none; background-color: rgba(102, 102, 102, 0.15); box-shadow: inset 0 0 rgba(0,0,0,1.0); } /* Panel */ #panel { background-color: black; font-weight: bold; height: 1.86em; } #panel.lock-screen { background-color: rgba(0,0,0,0.3); } #panel.unlock-screen, #panel.login-screen { background-color: transparent; } #panelLeft, #panelCenter { spacing: 4px; } #panelLeft:ltr { padding-right: 4px; } #panelLeft:rtl { padding-left: 4px; } #panelRight:ltr { padding-left: 4px; } #panelRight:rtl { padding-right: 4px; } .panel-corner { -panel-corner-radius: 6px; -panel-corner-background-color: black; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } .panel-corner:active, .panel-corner:overview, .panel-corner:focus { -panel-corner-border-color: rgba(255,255,255,0.8); } .panel-corner.lock-screen, .panel-corner.unlock-screen, .panel-corner.login-screen { -panel-corner-background-color: transparent; -panel-corner-border-color: transparent; } #appMenu { spinner-image: url("process-working.svg"); spacing: 4px; } /* used for the app menu header only */ .label-shadow { color: rgba(0,0,0,0.5); } .panel-button #appMenuIcon { app-icon-bottom-clip: 1px; } .panel-button:active #appMenuIcon, .panel-button:checked #appMenuIcon, .panel-button:focus #appMenuIcon { app-icon-bottom-clip: 2px; } .app-menu-icon { width: 24px; height: 24px; } .panel-button { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; color: #ccc; transition-duration: 100ms; } #panel.unlock-screen .panel-button, #panel.lock-screen .panel-button, #panel.login-screen .panel-button { color: #e6e6e6; } #panel.unlock-screen .panel-button:hover, #panel.lock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.unlock-screen .panel-button:active, #panel.lock-screen .panel-button:active, #panel.login-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.lock-screen .panel-button:focus, #panel.login-screen .panel-button:focus { color: white; } .panel-button:hover { color: white; text-shadow: black 0px 2px 2px; } .panel-button:active, .panel-button:overview, .panel-button:focus { border-image: url("panel-button-border.svg") 6 10 0 2; background-image: url("panel-button-highlight-wide.svg"); color: white; text-shadow: black 0px 2px 2px; } .panel-status-button:active, .panel-status-button:checked, .panel-status-button:focus { background-image: url("panel-button-highlight-narrow.svg"); } .panel-button:active > .system-status-icon, .panel-button:checked > .system-status-icon, .panel-button:focus > .system-status-icon { icon-shadow: black 0px 2px 2px; } .panel-menu { -boxpointer-gap: 4px; } .panel-status-button-box { spacing: 4px; } .lock-screen-status-button-box { spacing: 8px; } /* User Menu */ #panelUserMenu { spacing: 4px; } .status-chooser { spacing: .4em; } .status-chooser .popup-menu-item, .status-chooser-combo .popup-menu-item { padding: .4em; } .status-chooser-user-icon { border: 2px solid #8b8b8b; border-radius: 5px; width: 48pt; height: 48pt; background-size: contain; } .status-chooser-user-icon:hover { border: 2px solid #bbbbbb; } .status-chooser-user-name { font-weight: bold; font-size: 1.3em; min-width: 120pt; } .status-chooser-combo { border: 1px solid transparent; } .status-chooser-combo.popup-combo-menu { padding: .4em 0em; border-radius: 4px; border: 1px solid #5f5f5f; } .status-chooser-status-item, .status-chooser-combo .popup-combobox-item { spacing: .4em; } .system-status-icon { icon-size: 1.09em; } /* Overview */ #overview { spacing: 24px; } .overview-controls { padding-bottom: 32px; } .workspace-thumbnails-background { border: 1px solid rgba(128, 128, 128, 0.4); border-right: 0px; border-radius: 9px 0px 0px 9px; background-color: rgba(0, 0, 0, 0.5); padding: 11px 7px 11px 11px; } .workspace-thumbnails-background:rtl { border-right: 1px; border-left: 0px; border-radius: 0px 9px 9px 0px; padding: 11px 11px 11px 7px; } .workspace-thumbnails { spacing: 11px; visible-width: 32px; /* Amount visible before hovering */ } .workspace-thumbnail-indicator { border: 4px solid rgba(255,255,255,0.7); border-radius: 4px; padding: 1px; } .window-caption { spacing: 25px; background: rgba(0,0,0,0.5); border-radius: 8px; padding: 4px 12px; -shell-caption-spacing: 12px; border: 2px solid rgba(0, 0, 0, 0); } .window-caption:hover { border: 2px solid rgba(255, 255, 255, 0); } .window-close, .notification-close { background-image: url("close-window.svg"); background-size: 32px; height: 32px; width: 32px; } .window-close { -shell-close-overlap: 16px; } .window-clone-border { border: 4px solid rgba(255, 255, 255, 0.5); border-radius: 4px; } .notification-close { /* we start out in the top right of the * notification, inset. * * center is 32px/2 = 16px * * adjust left 2px * adjust down 8px */ -shell-close-overlap-x: 14px; -shell-close-overlap-y: -12px; } .notification-close:rtl { /* as above, but starting out in the top left of the * notification. */ -shell-close-overlap-x: -14px; } .window-close:rtl { -st-background-image-shadow: 2px 2px 6px rgba(0,0,0,0.5); } .window-picker { -horizontal-spacing: 32px; -vertical-spacing: 32px; padding-left: 32px; padding-right: 32px; padding-bottom: 48px; } .window-picker.external-monitor { padding: 32px; } .messages-indicator { color: #999999; height: 32px; } .messages-indicator-contents { spacing: 12px; padding-bottom: 12px; } .messages-indicator-contents:hover { color: white; text-shadow: black 0px 2px 2px; } .messages-indicator-highlight { background-gradient-start: transparent; background-gradient-end: #999999; background-gradient-direction: vertical; height: 6px; } /* Dash */ #dash { color: #5f5f5f; font-size: 9pt; padding: 4px 0px; background-color: rgba(0, 0, 0, 0.5); border: 1px solid rgba(128, 128, 128, 0.4); border-left: 0px; border-radius: 0px 9px 9px 0px; } #dash:rtl { border-left: 1px; border-right: 0px; border-radius: 9px 0px 0px 9px; } .placeholder { background-image: url("dash-placeholder.svg"); background-size: contain; height: 24px; } .empty-dash-drop-target { width: 24px; height: 24px; } /* Search Box */ #searchEntry { width: 320px; } .search-entry-icon { icon-size: 1em; color: #c0c0c0; } #searchEntry:hover .search-entry-icon, #searchEntry:focus .search-entry-icon { color: #8d8f8a; } /* Search Results */ #searchResults { padding: 20px 10px 0px 10px; spacing: 18px; } #searchResultsBin { max-width: 1000px; } #searchResultsContent { padding-left: 20px; padding-right: 20px; spacing: 16px; } .search-section { /* This should be equal to #searchResultsContent spacing */ spacing: 16px; } .search-section-separator { -gradient-height: 1px; -gradient-start: rgba(255,255,255,0); -gradient-end: rgba(255,255,255,0.5); -margin-horizontal: 1.5em; height: 1px; } .search-section-content { /* This is the space between the provider icon and the results container */ spacing: 32px; } .search-statustext { color: #efefef; font-size: 2em; font-weight: bold; } .list-search-results { spacing: 3px; } .dash-label { border-radius: 7px; padding: 4px 12px; background-color: rgba(0,0,0,0.5); text-align: center; -x-offset: 8px; } /* Application Launchers, Grid and List results */ .icon-grid { spacing: 36px; -shell-grid-horizontal-item-size: 118px; -shell-grid-vertical-item-size: 118px; } .icon-grid .overview-icon { icon-size: 96px; } .app-display { padding: 8px; spacing: 20px; } .app-view-controls { padding-bottom: 32px; } .app-view-control { padding: 4px 32px; } .search-display > StBoxLayout, .all-apps > StBoxLayout, .frequent-apps > StBoxLayout { /* horizontal padding to make sure scrollbars or dash don't overlap content */ padding: 0px 88px; } .app-folder-icon { padding: 5px; } .dash-item-container > StButton { padding: 4px 8px; } .list-search-result-content { spacing: 12px; padding: 12px; } .list-search-result-title { font-weight: bold; font-size: 14pt; color: white; } .list-search-result-description { color: #eeeeec; } .search-provider-icon-more { width: 16px; height: 16px; background-image: url("more-results.svg"); } .app-well-app > .overview-icon, .show-apps > .overview-icon, .search-provider-icon, .list-search-result, .grid-search-result .overview-icon { border-radius: 4px; padding: 3px; border: 1px rgba(0,0,0,0); transition-duration: 100ms; text-align: center; } .app-folder-popup { -arrow-border-radius: 8px; -arrow-background-color: black; -arrow-base: 24px; -arrow-rise: 11px; } .app-folder-popup-bin { padding: 15px; } .app-well-app.running > .overview-icon { text-shadow: black 0px 2px 2px; background-image: url("running-indicator.svg"); background-size: contain; } .app-well-app.app-folder > .overview-icon { background-color: rgba(0,0,0,0.5); } .app-well-app:hover > .overview-icon, .show-apps:hover > .overview-icon, .search-provider-icon:hover, .list-search-result:hover, .grid-search-result:hover .overview-icon { background-color: rgba(255,255,255,0.1); text-shadow: black 0px 2px 2px; transition-duration: 100ms; color:white; } .app-display .app-well-app > .overview-icon { border-radius: 10px; } .list-search-result:hover .list-search-result-description { text-shadow: rgba(0,0,0,0.8) 0px 1px 2px; } .show-apps { padding: 4px 0; } .show-apps-icon { color: #a0a0a0; } .show-apps:hover .show-apps-icon { color: white; } .app-well-app:checked > .overview-icon, .app-well-app:active > .overview-icon, .show-apps:checked > .overview-icon, .show-apps:active > .overview-icon { background-gradient-start: rgba(255, 255, 255, .05); background-gradient-end: rgba(255, 255, 255, .15); background-gradient-direction: vertical; border-radius: 4px; box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 1); transition-duration: 100ms; } .show-apps:checked .show-apps-icon, .show-apps:focus .show-apps-icon { color: white; transition-duration: 100ms; } .app-well-app:focus > .overview-icon, .grid-search-result:focus .overview-icon, .show-apps:focus > .overview-icon, .search-provider-icon:focus, .list-search-result:focus, .app-well-app:selected > .overview-icon, .grid-search-result:selected .overview-icon, .search-provider-icon:selected, .list-search-result:selected { background-color: rgba(255,255,255,0.33); } /* LookingGlass */ #LookingGlassDialog { background-color: rgba(0,0,0,0.80); spacing: 4px; padding: 4px; border: 2px solid grey; border-radius: 4px; } #LookingGlassDialog > #Toolbar { border: 1px solid grey; border-radius: 4px; } #LookingGlassDialog .labels { spacing: 4px; } #LookingGlassDialog .notebook-tab { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; color: #ccc; transition-duration: 100ms; padding-left: .3em; padding-right: .3em; } #LookingGlassDialog .notebook-tab:hover { color: white; text-shadow: black 0px 2px 2px; } #LookingGlassDialog .notebook-tab:selected { border-image: url("panel-button-border.svg") 10 10 0 2; background-image: url("panel-button-highlight-wide.svg"); color: white; text-shadow: black 0px 2px 2px; } #LookingGlassDialog .lg-inspector-title { font-weight: bold; padding-bottom: 8px; } .lg-dialog StEntry { selection-background-color: #bbbbbb; selected-color: #333333; } .lg-completions-text { font-size: .9em; font-style: italic; } .lg-obj-inspector-title { spacing: 4px; } .lg-obj-inspector-button { border: 1px solid gray; padding: 4px; border-radius: 4px; } .lg-obj-inspector-button:hover { border: 1px solid #ffffff; } .lg-dialog .shell-link { color: #999999; } .lg-dialog .shell-link:hover { color: #dddddd; } #LookingGlassDialog StBoxLayout#EvalBox { padding: 4px; spacing: 4px; } #LookingGlassDialog StBoxLayout#ResultsArea { spacing: 4px; } #lookingGlassExtensions { padding: 4px; } .lg-extension-list { padding: 4px; spacing: 6px; } .lg-extension { border: 1px solid #6f6f6f; border-radius: 4px; padding: 4px; } .lg-extension-name { font-weight: bold; } .lg-extension-meta { spacing: 6px; } #LookingGlassPropertyInspector { background: rgba(0, 0, 0, 0.8); border: 2px solid grey; border-radius: 4px; padding: 6px; } /* Calendar popup */ #calendarEventsArea { /* this is the width of the second column of the popup */ min-width: 320px; } .calendar-vertical-separator { -stipple-width: 1px; -stipple-color: #505050; width: 0.3em; } #calendarPopup .calendar { padding: 10px; } .calendar { padding: .4em 1.75em .8em 1.75em; spacing-rows: 0px; spacing-columns: 0px; } .calendar-month-label { color: #888a85; font-size: 9.5pt; font-weight: bold; padding-bottom: 8px; padding-top: 8px; } .calendar-change-month-back { width: 18px; height: 12px; background-image: url("calendar-arrow-left.svg"); border-radius: 4px; } .calendar-change-month-back:rtl { background-image: url("calendar-arrow-right.svg"); } .calendar-change-month-back:hover { background-color: #999999; } .calendar-change-month-back:active { background-color: #aaaaaa; } .calendar-change-month-forward { width: 18px; height: 12px; background-image: url("calendar-arrow-right.svg"); border-radius: 4px; } .calendar-change-month-forward:rtl { background-image: url("calendar-arrow-left.svg"); } .calendar-change-month-forward:hover { background-color: #999999; } .calendar-change-month-forward:active { background-color: #aaaaaa; } .datemenu-date-label { padding: .4em 1.7em; font-weight: bold; text-align: center; color: #eeeeec; } .calendar-day-base { font-size: 9pt; text-align: center; width: 2.4em; height: 2.4em; } .calendar-day-base:hover { background-color: #777777; } .calendar-day-base:active { font-size: 9pt; background-color: #555555; color: white; } .calendar-day-heading { color: #888a85; padding-top: .2em; height: 1.7em; } .calendar-week-number { color: #babdb6; font-weight: bold; } /* Hack used in lieu of border-collapse - see calendar.js */ .calendar-day { border: 1px solid #505050; color: #babdb6; border-top-width: 0; border-left-width: 0; } .calendar-day-top { border-top-width: 1px; } .calendar-day-left { border-left-width: 1px; } .calendar-work-day { } .calendar-nonwork-day { background-color: rgba(128, 128, 128, .1); } .calendar-today { background-image: url("calendar-today.svg"); text-shadow: black 0px 2px 2px; font-weight: bold; } .calendar-day-with-events { font-weight: bold; color: white; } .calendar-other-month-day { color: #333333; } .events-header-vbox { spacing: 6pt; padding-right: .5em; } .events-header-vbox:rtl { padding-left: .5em; } .events-header-hbox { padding: 0.3em 1.4em; } .events-day-header { font-weight: bold; color: #999999; padding: 0.4em 1.4em 0em 1.4em; } .events-day-header:rtl { padding: 0em 1.4em 0.4em 1.4em; } .events-day-dayname { color: rgba(153, 153, 153, 1.0); text-align: left; } .events-day-dayname:rtl { text-align: right; } .events-day-time { color: #fff; text-align: right; } .events-day-time:rtl { text-align: left; } .events-day-task { color: rgba(153, 153, 153, 1.0); } .events-day-name-box { min-width: 15pt; } .events-time-box { min-width: 48pt; padding-right: 12pt; } .events-time-box:rtl { padding-right: 0px; padding-left: 12pt; } .events-event-box { } .url-highlighter { link-color: #ccccff; } /* Message Tray */ #message-tray { background: #2e3436 url(message-tray-background.png); background-repeat: repeat; height: 72px; } .message-tray-summary { height: 72px; } .no-messages-label { font-family: cantarell, sans-serif; font-size: 11pt; color: #999999; } .notification { border-radius: 10px 10px 0px 0px; background: rgba(0,0,0,0.9); padding: 8px 8px 4px 8px; spacing-rows: 4px; spacing-columns: 10px; } .notification, #notification-container { font-size: 11pt; width: 34em; } .notification.multi-line-notification { padding-bottom: 8px; } .notification-unexpanded { /* We want to force the actor at a specific size, irrespective of its minimum and preferred size, so we override both */ min-height: 36px; height: 36px; } /* We use row-span = 2 for the image cell, which prevents its height preferences to be taken into account during allocation, so its height ends up being limited by the height of the content in the other rows. To avoid showing a stretched image, we set the minimum height of the table to be ICON_SIZE + IMAGE_SIZE + spacing-rows = 24 + 125 + 10 = 159 */ .notification-with-image { min-height: 159px; } .summary-boxpointer { -arrow-border-radius: 15px; -arrow-background-color: rgba(0,0,0,0.9); -arrow-base: 36px; -arrow-rise: 18px; color: white; -boxpointer-gap: 4px; } .summary-boxpointer .notification { border-radius: 9px; background: rgba(0,0,0,0) !important; padding-bottom: 12px; } .summary-boxpointer #summary-right-click-menu { padding-top: 12px; padding-bottom: 12px; } .summary-notification-stack-scrollview { max-height: 18em; padding-top: 8px; padding-bottom: 8px; } .summary-notification-stack-scrollview:ltr { padding-right: 8px; } .summary-notification-stack-scrollview:rtl { padding-left: 8px; } .notification-scrollview { max-height: 10em; -st-vfade-offset: 24px; } .notification-scrollview:ltr > StScrollBar { padding-left: 6px; } .notification-scrollview:rtl > StScrollBar { padding-right: 6px; } .notification-body { spacing: 5px; } .notification-actions { padding-top: 18px; spacing: 10px; } .notification-button { -st-natural-width: 140px; padding: 4px 4px 5px; } .notification-button:focus { -st-natural-width: 138px; padding: 3px 4px 4px; } .notification-icon-button { border-radius: 5px; padding: 5px; } .notification-icon-button:focus { padding: 4px; } .notification-icon-button > StIcon { icon-size: 16px; padding: 8px; } .secondary-icon { icon-size: 1.09em; } .hotplug-transient-box { spacing: 6px; padding: 2px 72px 2px 12px; } .hotplug-notification-item { padding: 2px 10px; } .hotplug-notification-item:focus { padding: 1px 71px 1px 11px; } .hotplug-notification-item-icon { icon-size: 24px; padding: 2px 5px; } .hotplug-resident-box { spacing: 8px; } .hotplug-resident-mount { spacing: 8px; border-radius: 4px; color: #ccc; } .hotplug-resident-mount:hover { background-gradient-direction: horizontal; background-gradient-start: rgba(255, 255, 255, 0.1); background-gradient-end: rgba(255, 255, 255, 0); color: #fff; } .hotplug-resident-mount-label { color: inherit; padding-left: 6px; } .hotplug-resident-mount-icon { icon-size: 24px; padding-left: 6px; } .hotplug-resident-eject-icon { icon-size: 16px; } .hotplug-resident-eject-button { padding: 7px; border-radius: 5px; color: #ccc; } .chat-log-message { color: #888888; } .chat-group-sent, .chat-group-meta { padding: 8px 0; } .chat-received { padding-left: 4px; } .chat-received:rtl { padding-left: 0px; padding-right: 4px; } .chat-sent { padding-left: 18pt; color: #959595; } .chat-sent:rtl { padding-left: 0px; padding-right: 18pt; } .chat-meta-message { padding-left: 4px; font-size: 9pt; color: #bbbbbb; } .chat-meta-message:rtl { padding-left: 0px; padding-right: 4px; } .chat-notification-scrollview{ max-height: 22em; } .subscription-message { font-style: italic; } .notification StEntry { border-radius: 4px; } .summary-source-button { padding: 6px 3px 6px 3px; } .summary-source-button:last-child:ltr { padding-right: 6px; } .summary-source-button:last-child:rtl { padding-left: 6px; } .summary-source-button:hover .summary-source { background-color: rgba(255,255,255,0.1); } .summary-source-button:focus .summary-source, .summary-source-button:selected .summary-source { background-color: rgba(255,255,255,0.33); } .summary-source { border-radius: 4px; padding: 0 6px 0 6px; transition-duration: 100ms; } .summary-source-counter { background-image: url("summary-counter.svg"); background-size: 2.4em; font-size: 10pt; font-weight: bold; height: 2.4em; width: 2.4em; -shell-counter-overlap-x: 13px; -shell-counter-overlap-y: 13px; } /* OSD */ .osd-window { text-align: center; font-weight: bold; spacing: 1em; } .osd-window .level { height: 0.6em; border-radius: 0.3em; background-color: rgba(190,190,190,0.2); } /* App Switcher */ .switcher-popup { padding: 8px; spacing: 16px; } .osd-window, .switcher-list { background: rgba(0,0,0,0.8); border: 1px solid rgba(128,128,128,0.40); border-radius: 24px; padding: 20px; } .switcher-list-item-container { spacing: 8px; } .thumbnail-scroll-gradient-left { background-gradient-direction: horizontal; background-gradient-start: rgba(51, 51, 51, 1.0); background-gradient-end: rgba(51, 51, 51, 0); border-radius: 24px; border-radius-topright: 0px; border-radius-bottomright: 0px; width: 60px; } .thumbnail-scroll-gradient-right { background-gradient-direction: horizontal; background-gradient-start: rgba(51, 51, 51, 0); background-gradient-end: rgba(51, 51, 51, 1.0); border-radius: 24px; border-radius-topleft: 0px; border-radius-bottomleft: 0px; width: 60px; } .switcher-list .item-box { padding: 8px; border-radius: 8px; } .switcher-list .item-box:outlined { padding: 6px; border: 2px solid rgba(85,85,85,1.0); } .switcher-list .item-box:selected { background: rgba(255,255,255,0.33); } .switcher-list .thumbnail-box { padding: 2px; spacing: 4px; } .switcher-list .thumbnail { width: 256px; } .switcher-list .separator { width: 1px; background: rgba(255,255,255,0.33); } .ripple-box { width: 52px; height: 52px; background-image: url("corner-ripple-ltr.png"); background-size: contain; } .ripple-box:rtl { background-image: url("corner-ripple-rtl.png"); } .switcher-arrow { border-color: rgba(0,0,0,0); color: #808080; } .switcher-arrow:highlighted { border-color: rgba(0,0,0,0); color: white; } /* Workspace Switcher */ .workspace-switcher-group { padding: 12px; } .workspace-switcher-container { background: rgba(0,0,0,0.8); border: 1px solid rgba(128,128,128,0.40); border-radius: 24px; padding: 20px; } .workspace-switcher { background: transparent; border: 0px; border-radius: 0px; padding: 0px; spacing: 8px; } .ws-switcher-active-up { height: 100px; border: 0px; background: rgba(255,255,255,0.5); background-image: url("ws-switch-arrow-up.png"); border-radius: 8px; } .ws-switcher-active-down { height: 100px; border: 0px; background: rgba(255,255,255,0.5); background-image: url("ws-switch-arrow-down.png"); border-radius: 8px; } .ws-switcher-box { height: 96px; border: 2px solid rgba(85,85,85,0.5); background: transparent; border-radius: 8px; } /* Modal Dialogs */ /* Dialog Subject Text Style */ .show-processes-dialog-subject, .mount-question-dialog-subject, .end-session-dialog-subject { font-size: 14pt; font-weight: bold; color: #999999; } .modal-dialog { border-radius: 24px; background-color: rgba(0.0, 0.0, 0.0, 0.9); border: 2px solid #868686; padding-right: 42px; padding-left: 42px; padding-bottom: 30px; padding-top: 30px; } .modal-dialog-button-box { spacing: 21px; padding-top: 50px; } .modal-dialog-button { margin-left: 10px; margin-right: 10px; padding: 4px 32px 5px; } .modal-dialog-button:focus { padding: 3px 31px 4px; } /* Run Dialog */ .run-dialog-label { font-size: 12pt; font-weight: bold; color: #999999; padding-bottom: .4em; } .run-dialog-error-box { padding-top: 15px; spacing: 5px; } .modal-dialog .run-dialog-entry { width: 20em; } .lightbox { background-color: black; } .flashspot { background-color: white; } /* End Session Dialog */ .end-session-dialog { spacing: 42px; } .end-session-dialog-subject { padding-left: 17px; padding-bottom: 20px; } .end-session-dialog-subject:rtl { padding-left: 0px; padding-right: 17px; } .end-session-dialog-description { padding-left: 17px; width: 28em; } .end-session-dialog-description:rtl { padding-right: 17px; } .end-session-dialog-logout-icon { border: 2px solid #8b8b8b; border-radius: 5px; width: 32px; height: 32px; background-size: contain; } .end-session-dialog-shutdown-icon { color: #bebebe; width: 32px; height: 32px; } .end-session-dialog-app-list { font-size: 10pt; max-height: 200px; padding-top: 42px; padding-left: 49px; padding-right: 32px; } .end-session-dialog-app-list:rtl { padding-right: 49px; padding-left: 32px; } .end-session-dialog-app-list-item { color: #ccc; } .end-session-dialog-app-list-item:hover { color: white; } .end-session-dialog-app-list-item:ltr { padding-right: 1em; } .end-session-dialog-app-list-item:rtl { padding-left: 1em; } .end-session-dialog-app-list-item-icon:ltr { padding-right: 17px; } .end-session-dialog-app-list-item-icon:rtl { padding-left: 17px; } .end-session-dialog-app-list-item-name { font-size: 10pt; } .end-session-dialog-app-list-item-description { font-size: 8pt; color: #444444; } /* ShellMountOperation Dialogs */ .shell-mount-operation-icon { icon-size: 48px; } .mount-password-reask { color: red; } .show-processes-dialog, .mount-question-dialog { spacing: 24px; } .show-processes-dialog-subject, .mount-question-dialog-subject { padding-top: 10px; padding-left: 17px; padding-bottom: 6px; } .mount-question-dialog-subject { max-width: 500px; } .show-processes-dialog-subject:rtl, .mount-question-dialog-subject:rtl { padding-left: 0px; padding-right: 17px; } .show-processes-dialog-description, .mount-question-dialog-description { padding-left: 17px; width: 28em; } .show-processes-dialog-description:rtl, .mount-question-dialog-description:rtl { padding-right: 17px; } .show-processes-dialog-app-list { font-size: 10pt; max-height: 200px; padding-top: 24px; padding-left: 49px; padding-right: 32px; } .show-processes-dialog-app-list:rtl { padding-right: 49px; padding-left: 32px; } .show-processes-dialog-app-list-item { color: #ccc; } .show-processes-dialog-app-list-item:hover { color: white; } .show-processes-dialog-app-list-item:ltr { padding-right: 1em; } .show-processes-dialog-app-list-item:rtl { padding-left: 1em; } .show-processes-dialog-app-list-item-icon:ltr { padding-right: 17px; } .show-processes-dialog-app-list-item-icon:rtl { padding-left: 17px; } .show-processes-dialog-app-list-item-name { font-size: 10pt; } /* Password or Authentication Dialog */ .prompt-dialog { /* this is the width of the entire modal popup */ width: 500px; } .prompt-dialog-main-layout { spacing: 24px; padding: 10px; } .prompt-dialog-message-layout { spacing: 16px; } .prompt-dialog-headline { font-size: 12pt; font-weight: bold; color: #666666; } .prompt-dialog-password-box { spacing: 1em; padding-bottom: 1em; } .prompt-dialog-error-label { font-size: 10pt; color: #ffff00; padding-bottom: 8px; } .prompt-dialog-info-label { font-size: 10pt; padding-bottom: 8px; } .hidden { color: rgba(0,0,0,0); } .prompt-dialog-null-label { font-size: 10pt; padding-bottom: 8px; } /* Polkit Dialog */ .polkit-dialog-user-layout { padding-left: 10px; spacing: 10px; } .polkit-dialog-user-layout:rtl { padding-left: 0px; padding-right: 10px; } .polkit-dialog-user-root-label { color: #ff0000; } .polkit-dialog-user-icon { border: 2px solid #8b8b8b; border-radius: 5px; background-size: contain; width: 48px; height: 48px; } /* Network Agent Dialog */ .network-dialog-secret-table { spacing-rows: 15px; spacing-columns: 1em; } .keyring-dialog-control-table { spacing-rows: 15px; spacing-columns: 1em; } /* Magnifier */ .magnifier-zoom-region { border: 2px solid rgba(128, 0, 0, 255); } .magnifier-zoom-region.full-screen { border-width: 0px; } /* On-screen Keyboard */ #keyboard { background: rgba(0,0,0,0.8); } .keyboard-layout { spacing: 10px; padding: 10px; } .keyboard-row { spacing: 15px; } .keyboard-key { min-height: 30px; min-width: 30px; background-gradient-start: rgba(255,245,245,0.4); background-gradient-end: rgba(105,105,105,0.1); background-gradient-direction: vertical; font-size: 14pt; font-weight: bold; border-radius: 10px; border: 2px solid #a0a0a0; color: white; } .keyboard-key:grayed { color: #808080; border-color: #808080; } .keyboard-key:checked, .keyboard-key:hover { background: #303030; border: 3px solid white; } .keyboard-key:active { background: #808080; } .keyboard-subkeys { color: white; padding: 5px; -arrow-border-radius: 10px; -arrow-background-color: #090909; -arrow-border-width: 2px; -arrow-border-color: white; -arrow-base: 20px; -arrow-rise: 10px; -boxpointer-gap: 5px; } /* IBus Candidate Popup */ .candidate-popup-content { padding: 0.5em; spacing: 0.3em; } .candidate-index { padding: 0 0.5em 0 0; color: #cccccc; } .candidate-box { padding: 0.3em 0.5em 0.3em 0.5em; } .candidate-box:selected { border-radius: 4px; background-color: rgba(255,255,255,0.2); } .candidate-box:hover { border-radius: 4px; background-color: rgba(255,255,255,0.1); } .candidate-page-button-box { height: 2em; width: 80px; } .vertical .candidate-page-button-box { padding-top: 0.5em; } .horizontal .candidate-page-button-box { padding-left: 0.5em; } .candidate-page-button-previous { border-radius: 4px 0px 0px 4px; } .candidate-page-button-next { border-radius: 0px 4px 4px 0px; } .candidate-page-button-icon { icon-size: 1em; } /* Login Dialog */ .login-dialog-banner { font-size: 10pt; font-weight: bold; text-align: center; color: #666666; padding-bottom: 1em; } .login-dialog-title { font-size: 14pt; font-weight: bold; color: #666666; padding-bottom: 2em; } .login-dialog { /* Reset border and background */ border: none; background-color: transparent; padding-bottom: 80px; padding-top: 80px; border-radius: 16px; min-height: 150px; max-height: 700px; min-width: 350px; } .login-dialog-prompt-login-hint-message { font-size: 10.5pt; } .login-dialog-user-list-view { -st-vfade-offset: 1em; } .login-dialog-user-list { spacing: 12px; padding: .2em; } .login-dialog-user-list-item { border-radius: 10px; padding: .2em; } .login-dialog-user-list-item:ltr { padding-right: 1em; } .login-dialog-user-list-item:rtl { padding-left: 1em; } .login-dialog-user-list-item .login-dialog-user-list-item-name { font-size: 20pt; padding-left: 1em; } .login-dialog-user-list:expanded .login-dialog-user-list-item { color: #666666; } .login-dialog-user-list-item, .login-dialog-user-list-item:hover .login-dialog-user-list-item-name, .login-dialog-user-list:expanded .login-dialog-user-list-item:focus .login-dialog-user-list-item-name, .login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in { color: white; text-shadow: black 0px 2px 2px; } .login-dialog-user-list-item:hover { background-color: rgba(255,255,255,0.1); } .login-dialog-user-list:expanded .login-dialog-user-list-item:focus { background-color: rgba(255,255,255,0.33); } .login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in { background-image: url("logged-in-indicator.svg"); background-size: contain; } .login-dialog-user-list-item-text-box { padding: 0 0.5em; } .login-dialog-user-list-item .login-dialog-timed-login-indicator { background-color: rgba(0,0,0,0.0); height: 2px; } .login-dialog-user-list-item:focus .login-dialog-timed-login-indicator { background-color: #8b8b8b; } .login-dialog-user-list-item-icon { border: 2px solid #8b8b8b; border-radius: 8px; width: 64px; height: 64px; } .login-dialog-not-listed-label { font-size: 10.5pt; font-weight: bold; color: #666666; padding-top: 1em; padding-left: 2px; } .login-dialog-not-listed-button:focus .login-dialog-not-listed-label, .login-dialog-not-listed-button:hover .login-dialog-not-listed-label { color: #E8E8E8; } .login-dialog-username { font-size: 16pt; font-weight: bold; text-align: left; padding-left: 15px; text-shadow: black 0px 4px 3px 0px; } .login-dialog-prompt-layout { padding-top: 24px; padding-bottom: 12px; spacing: 8px; } .login-dialog-prompt-label { color: #eeeeee; font-size: 14px; } .login-dialog-prompt-entry { width: 15em; } .login-dialog-session-list, .login-dialog-session-list-item { color: #babdb6; } .login-dialog-session-list-button:focus, .login-dialog-session-list-button:active, .login-dialog-session-list-button:hover, .login-dialog-session-list-item:focus, .login-dialog-session-list-item:hover { color: white; } .login-dialog-session-list-button { padding: 4px; } .login-dialog-session-list-scroll-view { padding: 6px; } .login-dialog-session-list-item { padding-bottom: 6px; } .login-dialog-session-list-triangle { padding-right: 6px; } .login-dialog-session-list-item-box { padding-left: 6px; spacing: 6px; } .login-dialog-session-list-item-dot { width: 10px; height: 10px; } .login-dialog-logo-bin { padding: 24px 0px; } .login-dialog .modal-dialog-button-box { spacing: 3px; } .login-dialog .modal-dialog-button { border-radius: 5px; padding: 3px 18px; } .login-dialog .modal-dialog-button:focus { padding: 2px 17px; } .login-dialog .modal-dialog-button:default { background-gradient-start: #6793c4; background-gradient-end: #335d8f; background-gradient-direction: vertical; border-color: #16335d; } .login-dialog .modal-dialog-button:default:focus { border: 2px solid #377fe7; } .login-dialog .modal-dialog-button:default:hover { background-gradient-start: #74a0d0; background-gradient-end: #436d9f; } .login-dialog .modal-dialog-button:default:active, .login-dialog .modal-dialog-button:default:pressed { background-gradient-start: #436d9f; background-gradient-end: #74a0d0; } .login-dialog .modal-dialog-button:default:insensitive { border-color: #666666; color: #9f9f9f; background-gradient-direction: none; background-color: rgba(102, 102, 102, 0.15); } .login-dialog-message-warning { color: orange; } .user-widget { spacing: .4em; } .user-widget-label { font-size: 16pt; font-weight: bold; text-align: left; padding-left: 15px; text-shadow: black 0px 4px 3px 0px; } /* Screen shield */ .screen-shield-background { background: black; } #lockDialogGroup { background: #2e3436 url(noise-texture.png); background-repeat: repeat; } .screen-shield-arrows { padding-bottom: 3em; } .screen-shield-arrows Gjs_Arrow { color: white; width: 80px; height: 48px; -arrow-thickness: 12px; -arrow-shadow: 0 1px 1px rgba(0,0,0,0.4); } .screen-shield-contents-box { spacing: 48px; } .screen-shield-clock { color: white; text-shadow: 0px 1px 2px rgba(0,0,0,0.6); font-weight: bold; text-align: center; padding-bottom: 1.5em; } .screen-shield-clock-time { font-size: 72pt; text-shadow: 0px 2px 2px rgba(0,0,0,0.4); } .screen-shield-clock-date { font-size: 28pt; } #screenShieldNotifications { border-radius: 8px; background-color: rgba(0.0, 0.0, 0.0, 0.9); border: 2px solid #868686; max-height: 500px; padding: 18px 0; box-shadow: .5em .5em 20px rgba(0, 0, 0, 0.5); } .screen-shield-notifications-box { spacing: 18px; max-width: 34em; } .screen-shield-notification-source { padding: 13px 24px; spacing: 5px; } .screen-shield-notification-label { font-size: 1.2em; font-weight: bold; padding: 0px 18px; color: #babdb6; } .screen-shield-notification-count-text { padding: 0px 18px; } /* Remove background from notifications, otherwise opacity is doubled and they look darker */ .screen-shield-notifications-box .notification { background-color: transparent; } /* Override padding on resident notifications, since the notifications box has its own spacing */ .screen-shield-notifications-box .summary-notification-stack-scrollview { padding-top: 0px; padding-bottom: 0px; } .input-source-switcher-symbol { font-size: 34pt; width: 96px; height: 96px; } /* Background menu */ .background-menu { -boxpointer-gap: 4px; }