Styling improvement for tabs

This commit is contained in:
Hadi Nategh 2016-06-01 15:04:05 +02:00
parent 1fb42cb4e9
commit 9f1c0c89b4
4 changed files with 32 additions and 16 deletions

View File

@ -3014,7 +3014,6 @@ tr.dialogHeader4 .et2_label {
*/ */
.et2_tabheader { .et2_tabheader {
padding-left: 0em; padding-left: 0em;
border-bottom: 3px solid #E6E6E6;
margin: 0; margin: 0;
background-image: none; background-image: none;
background-color: #FFFFFF; background-color: #FFFFFF;
@ -3028,7 +3027,7 @@ tr.dialogHeader4 .et2_label {
.et2_tabflag, .et2_tabflag,
.etemplate_tab > div, .etemplate_tab > div,
.etemplate_tab_active > div { .etemplate_tab_active > div {
margin: 1em 3px -1px 0; margin: 1em 5px -1px 0;
padding: 4px; padding: 4px;
background-color: white; background-color: white;
-webkit-user-select: none; -webkit-user-select: none;
@ -3041,8 +3040,11 @@ tr.dialogHeader4 .et2_label {
.et2_tabflag:hover, .et2_tabflag:hover,
.etemplate_tab > div:hover, .etemplate_tab > div:hover,
.etemplate_tab_active > div:hover { .etemplate_tab_active > div:hover {
background-color: #FFDD73; background-color: #f0f0f0;
border: none; border: none;
border-bottom: 3px solid #696969;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
} }
td.etemplate_tab_active.th { td.etemplate_tab_active.th {
background-color: transparent; background-color: transparent;
@ -3064,10 +3066,12 @@ td.etemplate_tab_active.th {
.tab_body { .tab_body {
border: none; border: none;
border-bottom: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6;
border-top: 1px solid #E6E6E6;
padding: 5px; padding: 5px;
background-color: #FFFFFF; background-color: #FFFFFF;
margin-bottom: 11px; margin-bottom: 11px;
margin-top: 11px; margin-top: 3px;
padding-top: 15px;
} }
.tab_body { .tab_body {
border-top-width: 1px; border-top-width: 1px;

View File

@ -3003,7 +3003,6 @@ tr.dialogHeader4 .et2_label {
*/ */
.et2_tabheader { .et2_tabheader {
padding-left: 0em; padding-left: 0em;
border-bottom: 3px solid #E6E6E6;
margin: 0; margin: 0;
background-image: none; background-image: none;
background-color: #FFFFFF; background-color: #FFFFFF;
@ -3017,7 +3016,7 @@ tr.dialogHeader4 .et2_label {
.et2_tabflag, .et2_tabflag,
.etemplate_tab > div, .etemplate_tab > div,
.etemplate_tab_active > div { .etemplate_tab_active > div {
margin: 1em 3px -1px 0; margin: 1em 5px -1px 0;
padding: 4px; padding: 4px;
background-color: white; background-color: white;
-webkit-user-select: none; -webkit-user-select: none;
@ -3030,8 +3029,11 @@ tr.dialogHeader4 .et2_label {
.et2_tabflag:hover, .et2_tabflag:hover,
.etemplate_tab > div:hover, .etemplate_tab > div:hover,
.etemplate_tab_active > div:hover { .etemplate_tab_active > div:hover {
background-color: #FFDD73; background-color: #f0f0f0;
border: none; border: none;
border-bottom: 3px solid #696969;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
} }
td.etemplate_tab_active.th { td.etemplate_tab_active.th {
background-color: transparent; background-color: transparent;
@ -3053,10 +3055,12 @@ td.etemplate_tab_active.th {
.tab_body { .tab_body {
border: none; border: none;
border-bottom: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6;
border-top: 1px solid #E6E6E6;
padding: 5px; padding: 5px;
background-color: #FFFFFF; background-color: #FFFFFF;
margin-bottom: 11px; margin-bottom: 11px;
margin-top: 11px; margin-top: 3px;
padding-top: 15px;
} }
.tab_body { .tab_body {
border-top-width: 1px; border-top-width: 1px;

View File

@ -236,7 +236,6 @@ tr.dialogHeader4{
.et2_tabheader { .et2_tabheader {
padding-left: 0em; padding-left: 0em;
border-bottom: 3px solid @gray_10;
margin: 0; margin: 0;
background-image: none; background-image: none;
background-color: @gray_0; background-color: @gray_0;
@ -246,7 +245,7 @@ tr.dialogHeader4{
} }
.et2_tabflag {border:none;} .et2_tabflag {border:none;}
.et2_tabflag, .etemplate_tab > div, .etemplate_tab_active > div { .et2_tabflag, .etemplate_tab > div, .etemplate_tab_active > div {
margin: 1em 3px -1px 0; margin: 1em 5px -1px 0;
padding: 4px; padding: 4px;
background-color: white; background-color: white;
-webkit-user-select: none; -webkit-user-select: none;
@ -256,8 +255,11 @@ tr.dialogHeader4{
border-bottom:3px solid @gray_10; border-bottom:3px solid @gray_10;
margin-bottom:-3px; margin-bottom:-3px;
&:hover { &:hover {
.background_color_egw_lighter; .background_color_10_gray;
border:none; border:none;
border-bottom: 3px solid @gray_60;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
} }
} }
td.etemplate_tab_active.th { td.etemplate_tab_active.th {
@ -283,10 +285,12 @@ td.etemplate_tab_active.th {
.et2_tabs, .tab_body { .et2_tabs, .tab_body {
border:none; border:none;
border-bottom:1px solid @gray_10; border-bottom:1px solid @gray_10;
border-top: 1px solid @gray_10;
padding: 5px; padding: 5px;
background-color: @gray_0; background-color: @gray_0;
margin-bottom: 11px; margin-bottom: 11px;
margin-top:11px; margin-top:3px;
padding-top: 15px;
} }
.tab_body { .tab_body {

View File

@ -3025,7 +3025,6 @@ tr.dialogHeader4 .et2_label {
*/ */
.et2_tabheader { .et2_tabheader {
padding-left: 0em; padding-left: 0em;
border-bottom: 3px solid #E6E6E6;
margin: 0; margin: 0;
background-image: none; background-image: none;
background-color: #FFFFFF; background-color: #FFFFFF;
@ -3039,7 +3038,7 @@ tr.dialogHeader4 .et2_label {
.et2_tabflag, .et2_tabflag,
.etemplate_tab > div, .etemplate_tab > div,
.etemplate_tab_active > div { .etemplate_tab_active > div {
margin: 1em 3px -1px 0; margin: 1em 5px -1px 0;
padding: 4px; padding: 4px;
background-color: white; background-color: white;
-webkit-user-select: none; -webkit-user-select: none;
@ -3052,8 +3051,11 @@ tr.dialogHeader4 .et2_label {
.et2_tabflag:hover, .et2_tabflag:hover,
.etemplate_tab > div:hover, .etemplate_tab > div:hover,
.etemplate_tab_active > div:hover { .etemplate_tab_active > div:hover {
background-color: #FFDD73; background-color: #f0f0f0;
border: none; border: none;
border-bottom: 3px solid #696969;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
} }
td.etemplate_tab_active.th { td.etemplate_tab_active.th {
background-color: transparent; background-color: transparent;
@ -3075,10 +3077,12 @@ td.etemplate_tab_active.th {
.tab_body { .tab_body {
border: none; border: none;
border-bottom: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6;
border-top: 1px solid #E6E6E6;
padding: 5px; padding: 5px;
background-color: #FFFFFF; background-color: #FFFFFF;
margin-bottom: 11px; margin-bottom: 11px;
margin-top: 11px; margin-top: 3px;
padding-top: 15px;
} }
.tab_body { .tab_body {
border-top-width: 1px; border-top-width: 1px;