Foundry376/Mailspring
1
1
Fork 0
mirror of https://github.com/Foundry376/Mailspring.git synced 2025-01-05 07:35:34 +08:00
Code Issues Projects Releases Packages Wiki Activity

fix(toolbar-style): Add gradient to top toolbar, blurred styling

Browse source
This commit is contained in:
Ben Gotow 2015-07-16 17:51:18 -07:00
parent 26705d8cfe
commit 3983269004
3 changed files with 12 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
internal_packages/message-list/stylesheets/message-list.less
View file

@ -69,6 +69,7 @@
}
.message-subject {
font-size: @font-size-large;
color: @text-color;
}
.message-count {
float: right;
@ -119,7 +120,7 @@
margin: @message-spacing auto;
padding: 0;
background: @background-primary;
border: 0;
box-shadow: 0 0 0.5px rgba(0, 0, 0, 0.28), 0 1px 1.5px rgba(0, 0, 0, 0.08);

2
static/variables/ui-variables.less
View file

@ -481,7 +481,7 @@
@body-bg: @white;
//== Panels and Sidebars
@panel-background-color: @gray-lighter;
@toolbar-background-color: @gray-lighter;
@toolbar-background-color: darken(@white, 13%);
// Helpers for Specs - Do Not Remove
@spec-test-variable: rgb(152,123,0);

16
static/workspace.less
View file

@ -120,14 +120,17 @@ body.is-blurred {
background-position: 0 -36px;
}
}
.sheet-toolbar-container {
background-image: -webkit-linear-gradient(top, lighten(@toolbar-background-color, 12%), lighten(@toolbar-background-color, 12%));
.btn.btn-toolbar img {
opacity:0.5;
}
}
}
.sheet-toolbar-container {
background: @toolbar-background-color;
&.mode-popout {
background: transparent;
}
background-image: -webkit-linear-gradient(top, lighten(@toolbar-background-color, 10.5%), @toolbar-background-color);
box-shadow: inset 0 1px 0 lighten(@toolbar-background-color, 15%);
}
.layout-mode-popout {
@ -145,8 +148,7 @@ body.is-blurred {
.sheet-toolbar {
position: relative;
-webkit-app-region: drag;
background: @toolbar-background-color;
border-bottom: 1px solid @border-color-divider;
border-bottom: 1px solid darken(@toolbar-background-color, 9%);
width: 100%;
height: 50px;