diff --git a/src/sass/_variables.scss b/src/sass/_variables.scss
index 015e21a..357b890 100755
--- a/src/sass/_variables.scss
+++ b/src/sass/_variables.scss
@@ -20,7 +20,7 @@ $color-white: #fff;
$color-grey: #666;
$color-grey-input: #949494;
$color-grey-dark: #333;
-$color-grey-medium: #aaa;
+$color-grey-medium: #999;
$color-grey-light: #ccc;
$color-grey-lighter: #ddd;
$color-grey-lighterer: #f0eff5;
diff --git a/src/sass/components/_input.scss b/src/sass/components/_input.scss
index 7454f94..63acb8b 100644
--- a/src/sass/components/_input.scss
+++ b/src/sass/components/_input.scss
@@ -20,7 +20,11 @@
font-size: em(13);
}
-.input-search {
- width: 93%;
+// need to be more specific than normalize.css
+.input-search,
+input[type="search"].input-search {
+ box-sizing: border-box;
+ width: 100%;
+ border-radius: 0;
-webkit-appearance: searchfield;
}
\ No newline at end of file
diff --git a/src/sass/components/_mail-list.scss b/src/sass/components/_mail-list.scss
index 7373bc6..c6df7b6 100755
--- a/src/sass/components/_mail-list.scss
+++ b/src/sass/components/_mail-list.scss
@@ -6,11 +6,7 @@
margin: 0;
padding: 0;
- &:last-child {
- margin-bottom: 0;
- }
-
- li {
+ & > li {
position: relative;
display: block;
margin-bottom: 7px;
@@ -19,6 +15,10 @@
cursor: pointer;
transition: background-color $time-li-fade, color $time-li-fade;
+ &:last-child {
+ margin-bottom: 0;
+ }
+
&.ng-animate {
transition: none;
}
@@ -67,16 +67,31 @@
text-align: right;
line-height: 1.5em * ($font-size-small / $font-size-smaller);
}
- .flag {
- width: 1em;
- height: 1em;
- border-radius: 50%;
- box-shadow: inset 1px 1px 1px $color-grey-light;
- position: absolute;
- top: 0;
- left: 0;
- margin-top: 0.2em;
- margin-left: -1.3em;
+ }
+ .flags {
+ position: absolute;
+ top: 0;
+ left: 0;
+ list-style: none;
+ margin: 0.8em 0 0;
+ padding: 0;
+ color: $color-grey-medium;
+ width: 30px;
+ line-height: 1.6em;
+ & > li {
+ font-size: 90%;
+ text-align: center;
+
+ &:nth-child(1) {
+ &:after {
+ display: inline-block;
+ content: '';
+ width: 1em;
+ height: 1em;
+ border-radius: 50%;
+ background-color: $color-blue;
+ }
+ }
}
}
diff --git a/src/sass/views/_mail-list.scss b/src/sass/views/_mail-list.scss
index 77b1ad4..a8877c3 100755
--- a/src/sass/views/_mail-list.scss
+++ b/src/sass/views/_mail-list.scss
@@ -25,7 +25,14 @@
font-weight: normal;
vertical-align: middle;
}
+ button {
+ float: right;
+ margin-top: -0.05em; // for perfect vertical alignment with headline
+ @include respond-to(desktop) {
+ display: none;
+ }
+ }
}
.search {
@@ -38,10 +45,10 @@
height: 100%;
padding: 0 $padding-horizontal;
overflow-y: hidden;
- }
- ul {
- padding-bottom: 126px;
+ .mail-list {
+ padding-bottom: 126px;
+ }
}
footer {
diff --git a/src/tpl/mail-list.html b/src/tpl/mail-list.html
index e32eccd..0047699 100644
--- a/src/tpl/mail-list.html
+++ b/src/tpl/mail-list.html
@@ -2,6 +2,7 @@
{{state.nav.currentFolder.type}}
+
{{email.subject || 'No subject'}}
{{email.body}}
+