add appear anim, fixes for chrome
parent
08fc077e07
commit
01ff8ffd08
68
mail.css
68
mail.css
|
|
@ -93,6 +93,7 @@ button img, a.button img
|
|||
button:hover, a.button:hover
|
||||
{
|
||||
background: -moz-linear-gradient(top, #fdfbfa 0%, #efebea 100%);
|
||||
background: -webkit-linear-gradient(top, #fdfbfa 0%, #efebea 100%);
|
||||
border-color: #cac6c5 #bab7b4 #bab7b4 #cac6c5;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
|
@ -101,6 +102,7 @@ button:active, button.pressed, a.button:active, a.button.pressed
|
|||
{
|
||||
box-shadow: inset 0 1px 2px 0px rgba(0, 0, 0, 0.2);
|
||||
background: -moz-linear-gradient(top, #efebea 0%, #fdfbfa 100%);
|
||||
background: -webkit-linear-gradient(top, #efebea 0%, #fdfbfa 100%);
|
||||
border-color: #bab7b4 #cac6c5 #cac6c5 #bab7b4;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
|
@ -143,9 +145,26 @@ div
|
|||
top: 0;
|
||||
z-index: 10;
|
||||
background: -moz-linear-gradient(top, #ebe9e8 0%, #c2bbb8 100%);
|
||||
background: -webkit-linear-gradient(top, #ebe9e8 0%, #c2bbb8 100%);
|
||||
padding: 3px;
|
||||
border: 1px solid gray;
|
||||
box-shadow: 3px 3px 6px 0 rgba(0, 0, 0, 0.25);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@keyframes fadeIn
|
||||
{
|
||||
from { opacity: 0; }
|
||||
to { opacity: 1; }
|
||||
}
|
||||
|
||||
.dropdown.visible
|
||||
{
|
||||
animation-name: fadeIn;
|
||||
animation-duration: 0.2s;
|
||||
animation-iteration-count: 1;
|
||||
animation-timing-function: linear;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.dropdown.window
|
||||
|
|
@ -232,6 +251,7 @@ div
|
|||
height: 2px;
|
||||
margin: 2px 0;
|
||||
background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
|
||||
.dropdown .split i
|
||||
|
|
@ -239,6 +259,7 @@ div
|
|||
display: block;
|
||||
height: 1px;
|
||||
background: -moz-linear-gradient(left, rgba(188, 180, 177, 0) 0%, rgba(188, 180, 177, 1) 50%, rgba(188, 180, 177, 0) 100%);
|
||||
background: -webkit-linear-gradient(left, rgba(188, 180, 177, 0) 0%, rgba(188, 180, 177, 1) 50%, rgba(188, 180, 177, 0) 100%);
|
||||
}
|
||||
|
||||
.folder-list
|
||||
|
|
@ -266,6 +287,7 @@ div
|
|||
top: 0;
|
||||
height: 30px;
|
||||
background: -moz-linear-gradient(top, #f2edeb 0%, #aca9a7 100%);
|
||||
background: -webkit-linear-gradient(top, #f2edeb 0%, #aca9a7 100%);
|
||||
}
|
||||
|
||||
.bottom-border-gradient
|
||||
|
|
@ -276,6 +298,7 @@ div
|
|||
bottom: 0;
|
||||
height: 30px;
|
||||
background: -moz-linear-gradient(top, #aca9a7 0%, #f2edeb 100%);
|
||||
background: -webkit-linear-gradient(top, #aca9a7 0%, #f2edeb 100%);
|
||||
}
|
||||
|
||||
.folder-list .actions
|
||||
|
|
@ -283,6 +306,7 @@ div
|
|||
padding: 5px;
|
||||
height: 42px;
|
||||
background: -moz-linear-gradient(top, #f6f1ef 0%, #e8e5e3 100%);
|
||||
background: -webkit-linear-gradient(top, #f6f1ef 0%, #e8e5e3 100%);
|
||||
border-bottom: 1px solid #aca9a7;
|
||||
}
|
||||
|
||||
|
|
@ -354,6 +378,7 @@ div
|
|||
border-style: solid;
|
||||
border-color: #73a0c2 #547ba0 #33557c #547ba0;
|
||||
background: -moz-linear-gradient(top, #90d7ff 0%, #76baf6 30%, #0098dd 31%, #43aced 100%);
|
||||
background: -webkit-linear-gradient(top, #90d7ff 0%, #76baf6 30%, #0098dd 31%, #43aced 100%);
|
||||
color: white;
|
||||
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
|
@ -361,6 +386,7 @@ div
|
|||
.folder-list .account-header
|
||||
{
|
||||
background: -moz-linear-gradient(top, #ffffff 0%, #f3eeec 100%);
|
||||
background: -webkit-linear-gradient(top, #ffffff 0%, #f3eeec 100%);
|
||||
padding: 1px 10px;
|
||||
position: relative;
|
||||
cursor: default;
|
||||
|
|
@ -399,6 +425,7 @@ div
|
|||
.folder-list .account-header:active
|
||||
{
|
||||
background: -moz-linear-gradient(top, #f3eeec 0%, #ffffff 100%);
|
||||
background: -webkit-linear-gradient(top, #f3eeec 0%, #ffffff 100%);
|
||||
}
|
||||
|
||||
.folder-list .account-header .cfg
|
||||
|
|
@ -561,6 +588,7 @@ div
|
|||
padding: 0 2px;
|
||||
border-bottom: 1px solid #b0adac;
|
||||
background: -moz-linear-gradient(top, #e9e7e5 0%, #dddad8 100%);
|
||||
background: -webkit-linear-gradient(top, #e9e7e5 0%, #dddad8 100%);
|
||||
}
|
||||
|
||||
.tab-panel .tab-bar .tab
|
||||
|
|
@ -577,6 +605,7 @@ div
|
|||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
background: -moz-linear-gradient(top, #f3f1f1 0%, #e6e2e2 100%);
|
||||
background: -webkit-linear-gradient(top, #f3f1f1 0%, #e6e2e2 100%);
|
||||
transition: all 0.2s ease-out;
|
||||
position: relative;
|
||||
opacity: 1;
|
||||
|
|
@ -614,16 +643,19 @@ div
|
|||
{
|
||||
border-bottom: 1px solid transparent;
|
||||
background: #f6f1ef -moz-linear-gradient(top, #f6f1ef 0%, #f6f1ef 100%);
|
||||
background: #f6f1ef -webkit-linear-gradient(top, #f6f1ef 0%, #f6f1ef 100%);
|
||||
}
|
||||
|
||||
.tab-panel .tab-bar .tab:hover
|
||||
{
|
||||
background: -moz-linear-gradient(top, #fefefe 0%, #efecec 100%);
|
||||
background: -webkit-linear-gradient(top, #fefefe 0%, #efecec 100%);
|
||||
}
|
||||
|
||||
.tab-panel .tab-bar .tab.selected:hover
|
||||
{
|
||||
background: -moz-linear-gradient(top, #fefefe 0%, #f6f1ef 100%);
|
||||
background: -webkit-linear-gradient(top, #fefefe 0%, #f6f1ef 100%);
|
||||
}
|
||||
|
||||
.tab-panel .tab-content
|
||||
|
|
@ -657,6 +689,7 @@ div
|
|||
padding: 5px;
|
||||
height: 42px;
|
||||
background: -moz-linear-gradient(top, #f6f1ef 0%, #e8e5e3 100%);
|
||||
background: -webkit-linear-gradient(top, #f6f1ef 0%, #e8e5e3 100%);
|
||||
border-bottom: 1px solid #aca9a7;
|
||||
}
|
||||
|
||||
|
|
@ -669,6 +702,7 @@ div
|
|||
border-color: #bab7b4 #cac6c5 #cac6c5 #bab7b4;
|
||||
border-radius: 3px;
|
||||
background: url(icons/search.png) 5px 6px no-repeat, -moz-linear-gradient(top, #efefef 0%, #ffffff 10%, #ffffff 100%);
|
||||
background: url(icons/search.png) 5px 6px no-repeat, -webkit-linear-gradient(top, #efefef 0%, #ffffff 10%, #ffffff 100%);
|
||||
padding: 1px 4px 1px 24px;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
|
@ -677,6 +711,7 @@ div
|
|||
{
|
||||
border: 0;
|
||||
background: transparent;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.message-list .actions .threads
|
||||
|
|
@ -708,6 +743,7 @@ div
|
|||
{
|
||||
background: white;
|
||||
overflow: auto;
|
||||
outline: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
|
|
@ -723,6 +759,7 @@ div
|
|||
font-weight: bold;
|
||||
text-align: center;
|
||||
background: -moz-linear-gradient(top, #ffffff 0%, #f3eeec 100%);
|
||||
background: -webkit-linear-gradient(top, #ffffff 0%, #f3eeec 100%);
|
||||
border-top: 1px solid #dadce0;
|
||||
border-bottom: 1px solid #aca9a7;
|
||||
}
|
||||
|
|
@ -730,6 +767,7 @@ div
|
|||
.message-list .listview .day:active
|
||||
{
|
||||
background: -moz-linear-gradient(top, #f3eeec 100%, #ffffff 0%);
|
||||
background: -webkit-linear-gradient(top, #f3eeec 100%, #ffffff 0%);
|
||||
}
|
||||
|
||||
.message-list .listview .day.collapsed
|
||||
|
|
@ -937,6 +975,7 @@ div
|
|||
{
|
||||
padding: 5px 5px 4px;
|
||||
background: -moz-linear-gradient(top, #f6f1ef 0%, #e8e5e3 100%);
|
||||
background: -webkit-linear-gradient(top, #f6f1ef 0%, #e8e5e3 100%);
|
||||
border-bottom: 1px solid #aca9a7;
|
||||
}
|
||||
|
||||
|
|
@ -1003,6 +1042,7 @@ div
|
|||
.message-view .message
|
||||
{
|
||||
display: table-cell;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.message-view .message .flex
|
||||
|
|
@ -1026,36 +1066,10 @@ div
|
|||
flex: 1;
|
||||
}
|
||||
|
||||
/*.message-view .message .flex
|
||||
{
|
||||
display: table;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.message-view .message .flex .top
|
||||
{
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.message-view .message .flex .headers
|
||||
{
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.message-view .message .flex .text
|
||||
{
|
||||
display: table-row;
|
||||
height: 100%;
|
||||
}*/
|
||||
|
||||
.message-view .message .headers
|
||||
{
|
||||
background: -moz-linear-gradient(top, #fef9f7 0%, #f7f2f0 100%);
|
||||
background: -webkit-linear-gradient(top, #fef9f7 0%, #f7f2f0 100%);
|
||||
padding: 20px;
|
||||
border-bottom: 1px solid #bab7b5;
|
||||
max-height: 50%;
|
||||
|
|
|
|||
3
mail.htm
3
mail.htm
|
|
@ -691,6 +691,7 @@ function collapseFolders()
|
|||
m.style.top = (p.top+b.offsetHeight)+'px';
|
||||
m.style.left = p.left+'px';
|
||||
m.style.display = 'block';
|
||||
m.className += ' visible';
|
||||
if (m.className.indexOf(' window') >= 0)
|
||||
{
|
||||
m.style.top = (p.top+b.offsetHeight+3)+'px';
|
||||
|
|
@ -707,6 +708,7 @@ function collapseFolders()
|
|||
{
|
||||
this.className = this.className.replace(/ pressed/g, '');
|
||||
var m = document.getElementById('dropdown-'+this.id.substr(14));
|
||||
m.className = m.className.replace(/ visible/g, '');
|
||||
m.style.display = '';
|
||||
}
|
||||
}
|
||||
|
|
@ -719,6 +721,7 @@ function collapseFolders()
|
|||
{
|
||||
var m = document.getElementById('show-'+e[i].id);
|
||||
m.className = m.className.replace(/ pressed/g, '');
|
||||
e[i].className = e[i].className.replace(/ visible/g, '');
|
||||
e[i].style.display = '';
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue