diff --git a/src/sass/components/_buttons.scss b/src/sass/components/_buttons.scss
index bef74d8..6ca7e68 100755
--- a/src/sass/components/_buttons.scss
+++ b/src/sass/components/_buttons.scss
@@ -104,8 +104,8 @@
font-size: $font-size-base;
font-family: $font-family-icons;
line-height: 1;
- height: 2em;
- width: 2em;
+ height: 2.5em;
+ width: 2.5em;
text-align: center;
-webkit-font-smoothing: antialiased;
@include respond-to(desktop) {
@@ -127,7 +127,7 @@
&.active {
outline: 0;
top: 2px;
- left: 2px;
+ right: -2px;
}
&:after {
diff --git a/src/sass/components/_lightbox.scss b/src/sass/components/_lightbox.scss
index 3307c1a..33d8ec8 100755
--- a/src/sass/components/_lightbox.scss
+++ b/src/sass/components/_lightbox.scss
@@ -39,7 +39,7 @@
display: block;
border: none;
background: none;
- padding: 0;
+ padding: 0 0 0 40px;
margin: 0;
color: $color-grey-dark;
outline: none;
diff --git a/src/sass/views/_mail-list.scss b/src/sass/views/_mail-list.scss
index e7eb330..e73f810 100755
--- a/src/sass/views/_mail-list.scss
+++ b/src/sass/views/_mail-list.scss
@@ -12,6 +12,10 @@
flex-shrink: 0;
cursor: pointer;
padding: $padding-vertical $padding-horizontal;
+ @include respond-to(mobile) {
+ padding: ($padding-vertical + 5px) $padding-horizontal;
+ }
+
&:before {
color: $color-blue;
font-size: $font-size-bigger;
@@ -27,20 +31,37 @@
vertical-align: middle;
text-shadow: 0px 1px 1px $color-grey-lighter;
}
- button {
- float: right;
- margin-top: -0.05em; // for perfect vertical alignment with headline
-
- @include respond-to(desktop) {
- display: none;
- }
- }
&.active {
background-color: darken($color-white, 10%);
}
}
+ .compose {
+ position: absolute;
+ top: $padding-vertical;
+ right: $padding-horizontal;
+ margin-top: -0.05em; // for perfect vertical alignment with headline
+ padding-left: 40px;
+
+ &.active {
+ top: $padding-vertical + 2px;
+ right: $padding-horizontal - 2px;
+ }
+
+ @include respond-to(desktop) {
+ display: none;
+ }
+
+ button {
+ &:active,
+ &.active {
+ top: 0;
+ right: 0;
+ }
+ }
+ }
+
.search {
flex-shrink: 0;
padding: 0 $padding-horizontal $padding-vertical $padding-horizontal;
diff --git a/src/sass/views/_read.scss b/src/sass/views/_read.scss
index cad1e4a..5ee37f2 100644
--- a/src/sass/views/_read.scss
+++ b/src/sass/views/_read.scss
@@ -50,7 +50,6 @@
.controls {
float: right;
- margin: 0 15px 10px;
button {
margin-left: 7px;
diff --git a/src/tpl/mail-list.html b/src/tpl/mail-list.html
index c5bb1b2..a313de5 100644
--- a/src/tpl/mail-list.html
+++ b/src/tpl/mail-list.html
@@ -2,9 +2,12 @@
{{state.nav.currentFolder.type}}
-