diff options
Diffstat (limited to 'web-ui/app/scss')
| -rw-r--r-- | web-ui/app/scss/_security.scss | 48 | ||||
| -rw-r--r-- | web-ui/app/scss/_styles.scss | 110 | ||||
| -rw-r--r-- | web-ui/app/scss/style.scss | 3 | ||||
| -rw-r--r-- | web-ui/app/scss/views/_mail-list.scss | 96 |
4 files changed, 113 insertions, 144 deletions
diff --git a/web-ui/app/scss/_security.scss b/web-ui/app/scss/_security.scss deleted file mode 100644 index ff36cb3e..00000000 --- a/web-ui/app/scss/_security.scss +++ /dev/null @@ -1,48 +0,0 @@ -.security-status { - margin: 0 0 5px; - clear: both; - span { - display: inline-block; - padding: 2px 6px; - white-space: nowrap; - background: $success; - color: $white; - border-radius: 12px; - &:before { - font-family: FontAwesome; - } - &.encrypted { - &:before { - content: "\f023"; - } - &.encryption-error { - background: $attention; - &:before { - content: "\f023 \f057"; - } - } - } - &.signed { - &:before { - content: "\f00c"; - } - &.signature-not-trusted { - background: $error; - &:before { - content: "\f05e"; - } - } - } - &[class^=not-], &.signature-expired, &.signature-revoked { - background: $attention; - &:before { - content: "\f05e" - } - } - &.not-encrypted { - &:before { - content: "\f13e "; - } - } - } -} diff --git a/web-ui/app/scss/_styles.scss b/web-ui/app/scss/_styles.scss index b4ffbd75..aacc5dd5 100644 --- a/web-ui/app/scss/_styles.scss +++ b/web-ui/app/scss/_styles.scss @@ -32,6 +32,11 @@ bottom: 33px } + header { + border-bottom: 1px solid white; + margin-bottom: 10px; + } + #user-settings-close { float: right; } @@ -42,6 +47,14 @@ line-height: 1.2em; } + h2 { + font-size: 1.1em; + color: white; + line-height: 1.1em; + display: inline; + margin-left: 5px; + } + i.fa-user { margin-right: 10px; float: left; @@ -54,7 +67,7 @@ } p { - font-size: 1.2em; + font-size: 1.1em; color: $light_orange; } } @@ -128,100 +141,6 @@ } } -@mixin email-list { - ul#mail-list { - clear: both; - li { - position: relative; - padding: 8px 10px 10px 10px; - background: $contrast; - border-bottom: 1px solid white; - cursor: pointer; - font-weight: bold; - transition: background-color 150ms ease-out; - span { - display: inline-block; - vertical-align: top; - &:last-child { - width: 92%; - } - input[type=checkbox] { - @include check-box; - margin-right: 2px; - } - a { - color: $dark_grey; - display: block; - height: 62px; - margin-top: -8px; - padding-top: 3px; - width: 106%; - } - } - - .subject { - display: block; - width: 90%; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - - i.fa-pencil, i.fa-trash-o { - color: $indicator_icon_color; - } - } - - .tags { - @include tags; - - // HACK: overwrite default from ul li property - &-tag { - border-bottom: none; - } - } - - .received-date, .sent-date { - position: absolute; - right: 10px; - font-size: 0.7em; - } - - .attachment-indicator { - margin: 2px 0 0 25px; - font-size: initial; - - i.fa-paperclip { - color: $indicator_icon_color; - } - } - .from { - white-space: nowrap; - font-size: 0.8em; - width: 80%; - overflow: hidden; - text-overflow: ellipsis; - } - - &.status-read { - a { - font-weight: normal; - color: $attachment_text; - } - } - &:hover { - background: darken($contrast, 5%); - } - &.selected { - background: $white; - z-index: 3; - a { - color: $dark_grey; - } - } - } - } -} - @mixin mail-count($bg_color) { background: $bg_color; color: $white; @@ -510,7 +429,6 @@ section { &#middle-pane { background: $contrast; - @include email-list; } &#right-pane { diff --git a/web-ui/app/scss/style.scss b/web-ui/app/scss/style.scss index 4dc79398..db9486fa 100644 --- a/web-ui/app/scss/style.scss +++ b/web-ui/app/scss/style.scss @@ -12,6 +12,8 @@ // mixins @import "mixins/position-helpers"; @import "mixins/tags"; + +// TODO @import "mixins"; // templates @@ -26,6 +28,7 @@ @import "views/security-labels"; @import "views/compose-view"; @import "views/compose-button"; +@import "views/mail-list"; // misc stuff @import "others"; diff --git a/web-ui/app/scss/views/_mail-list.scss b/web-ui/app/scss/views/_mail-list.scss new file mode 100644 index 00000000..417fabc2 --- /dev/null +++ b/web-ui/app/scss/views/_mail-list.scss @@ -0,0 +1,96 @@ +.mail-list-entry { + @include scut-clearfix; + + padding: 8px 10px 10px 10px; + border-bottom: 1px solid white; + transition: background-color 150ms ease-out; + cursor: pointer; + font-weight: bold; + height: 80px; + position: relative; + + // Workaround: + // Foundation is of the opinion that a 1.6 line height for all lists + // is a totally good idea. Please remove when Foundation is gone + line-height: normal; + + &.status-read { + font-weight: normal; + color: $attachment_text; + } + + &.selected { + background: $white; + z-index: 10; // overlay the box-shadow of the right page (z-index: 2) + } + + &:hover { + background: darken($contrast, 5%); + } + + &__checkbox { + margin-right: 5px; + display: block; + float: left; + min-height: 100%; + + & > input[type=checkbox] { + @include check-box; + } + } + + &__item { + display: block; + color: $dark_grey; + padding-left: 24px; + + &-from { + white-space: nowrap; + font-size: 0.8em; + overflow: hidden; + text-overflow: ellipsis; + display: inline-block; + } + + &-date { + font-size: 0.7em; + float: right; + display: inline-block; + } + + &-subject { + display: inline-block; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + width: 85%; + + &-icon { + color: $light_gray; + } + } + + &-attachment { + width: 14px; + text-align: right; + display: inline-block; + float: right; + color: $light_gray; + } + + &-tags { + @include tags; + + // Workaround: + // Foundation is of the opinion that a 1.6 line height and a 0.6 rem margin-bottom + // for all lists is a totally good idea. Please remove when Foundation is gone + line-height: normal; + margin-bottom: 0; + } + + &:hover, &:focus, &:active { + color: $dark_grey; + } + } +} + |