geary/ui/geary.css
Michael Gratton 8f04e4cc36 Fix switches in the accounts editor looking squashed
Don't apply CSS padding to all image widget descendants of an editor row
since switches and other stock widgets also use them internally.

Fixes #299
2019-03-30 15:40:50 +11:00

299 lines
6.2 KiB
CSS

/*
* Copyright 2016 Software Freedom Conservancy Inc.
* Copyright 2016, 2017 Michael Gratton <mike@vee.net>
*
* This software is licensed under the GNU Lesser General Public License
* (version 2.1 or later). See the COPYING file in this distribution.
*/
/* MainWindow */
.geary-folder-frame > border {
border-left-width: 0;
border-top-width: 0;
border-right-width: 0;
}
.geary-conversation-frame > border {
border-left-width: 0;
border-top-width: 0;
border-right-width: 0;
}
/* For 3-pane mode only */
.geary-sidebar-pane-separator.vertical .conversation-frame > border {
border-bottom-width: 0;
}
.geary-composer-box > border {
border-width: 0px;
}
.geary-composer-body > border {
border-left-width: 0;
border-right-width: 0;
border-bottom-width: 0;
}
.geary-overlay {
background-color: @theme_base_color;
padding: 2px 6px;
border: 1px solid @borders;
border-bottom: 0;
}
.geary-overlay:dir(ltr) {
border-left: 0;
}
.geary-overlay:dir(rtl) {
border-right: 0;
}
.geary-titlebar-left:dir(ltr),
.geary-titlebar-right:dir(rtl) {
border-top-right-radius: 0px;
}
.geary-titlebar-right:dir(ltr),
.geary-titlebar-left:dir(rtl) {
border-top-left-radius: 0px;
}
/* MainWindowInfoBarSet */
.geary-info-bar-frame > border {
border-top-width: 0;
border-left-width: 0;
border-right-width: 0;
}
/* FolderPopover */
row.geary-folder-popover-list-row {
padding: 6px;
border-color: @borders;
border-style: groove;
border-bottom-width: 1px;
}
row.geary-folder-popover-list-row > label {
color: @theme_text_color;
}
/* ConversationListBox */
.conversation-listbox {
padding: 0 12px;
}
.conversation-listbox > row {
margin: 0;
border: 1px solid @borders;
border-bottom-width: 0;
padding: 0;
box-shadow: 0 4px 8px 1px rgba(0,0,0,0.4);
}
.conversation-listbox > row > box {
background: @theme_base_color;
transition: background 0.25s;
}
.conversation-listbox > row:hover > box {
background: shade(@theme_base_color, 0.96);
}
.conversation-listbox > row.geary-expanded {
margin-bottom: 6px;
border-bottom-width: 1px;
}
.conversation-listbox *.geary-matched *.geary-match {
color: @theme_selected_fg_color;
background: @theme_selected_bg_color;
;}
.conversation-listbox > row.geary-loading {
border-top-width: 0px;
padding: 6px;
}
.conversation-listbox > row:first-child:not(.geary-loading) {
margin-top: 12px;
}
.conversation-listbox > row:last-child {
margin-bottom: 12px;
}
/* ConversationEmail */
.geary-unread grid.geary-message-summary {
border-color: @theme_selected_bg_color;
transition: border 0.25s;
}
/* ConversationMessage */
grid.geary-message-summary {
border-top: 4px solid transparent;
padding: 12px;
padding-top: 8px;
transition: border 4s;
}
.geary-headers label {
margin: 0;
padding: 1px;
}
.geary-headers label.geary-header:dir(ltr) {
padding-right: 6px;
}
.geary-headers label.geary-header:dir(rtl) {
padding-left: 6px;
}
.geary-headers flowboxchild {
margin: 0;
padding: 1px;
}
.geary-headers flowboxchild label {
margin: 0;
padding: 0;
}
.geary-headers label.geary-from {
font-weight: bold;
}
.geary-header-value > flowboxchild:active {
background: mix(@theme_base_color, @theme_bg_color, 0.5);
}
.geary-header-value > flowboxchild:hover {
background: @theme_base_color;
}
.geary-header-value > flowboxchild label.dim-label:dir(ltr) {
margin-left: 6px;
}
.geary-header-value > flowboxchild label.dim-label:dir(rtl) {
margin-right: 6px;
}
.geary-submessages .geary-message {
background-image: linear-gradient(rgba(0,0,0,0.2), @bg_color 6px);
}
.geary-message .geary-placeholder-pane {
margin: 36px 16px;
}
/* Composer */
.geary-composer-embed headerbar {
border-top: 1px solid @borders;
border-radius: 0px;
}
/* PlaceholderPane */
.geary-placeholder-pane.geary-has-text > image {
margin-bottom: 12px;
}
.geary-placeholder-pane > .title {
font-weight: bold;
}
/* Accounts.Editor */
grid.geary-accounts-editor-pane-content {
padding: 32px 128px;
}
grid.geary-account-view image:dir(ltr) {
margin-right: 6px;
}
grid.geary-account-view image:dir(rtl) {
margin-left: 6px;
}
grid.geary-welcome-panel {
margin-bottom: 32px;
}
label.geary-settings-heading {
font-weight: bold;
margin-top: 24px;
margin-bottom: 12px;
}
row.geary-settings {
padding: 0px;
}
row.geary-settings entry {
border-width: 0px;
background-color: transparent;
}
row.geary-settings.geary-drag-source {
color: @insensitive_fg_color;
background-color: @insensitive_bg_color;
}
row.geary-settings.geary-drag-icon {
background-color: @theme_base_color;
border: 1px solid @borders;
}
row.geary-settings > grid > * {
margin: 18px 6px;
}
row.geary-settings > grid > *:first-child:dir(ltr),
row.geary-settings > grid > *:last-child:dir(rtl) {
margin-left: 18px;
}
row.geary-settings > grid > *:last-child:dir(ltr),
row.geary-settings > grid > *:first-child:dir(rtl) {
margin-right: 18px;
}
/* dir pseudo-class used here for required additional specificity */
row.geary-settings > grid > grid.geary-drag-handle:dir(ltr),
row.geary-settings > grid > grid.geary-drag-handle:dir(rtl) {
margin: 0;
}
row.geary-settings > grid > grid.geary-drag-handle image:dir(ltr) {
padding: 12px;
padding-right: 6px;
}
row.geary-settings > grid > grid.geary-drag-handle image:dir(rtl) {
padding: 12px;
padding-left: 6px;
}
frame.geary-settings.geary-signature {
min-height: 5em;
}
/* Images should have some padding to offset them from adjacent
widgets, but care ust be taken since images are also used as children
of other widgets like entries, comboboxes and switches, and these
shouldn't be be touched. */
row.geary-settings widget > image,
row.geary-settings grid > image {
padding: 0px 6px;
}
row.geary-settings > grid > combobox,
row.geary-settings > grid > entry,
row.geary-settings:not(.geary-add-row) > grid > image,
row.geary-settings > grid > switch {
/* These use more space than labels, so set their valign to center
when adding them and free up some space around them here to keep a
consistent row height. */
margin: 0 12px;
}
buttonbox.geary-settings {
margin-top: 36px;
}
popover.geary-editor > grid {
margin: 12px;
}
popover.geary-editor > grid > button.geary-setting-remove {
margin-top: 12px;
}