tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-10-22 14:05:37 +02:00
Code Issues Projects Releases Wiki Activity

FIX tab wrapping

Browse Source 
jQuery UI css specificity is different to SS so causes some conflicts. (fixes #5207)
This commit is contained in:
Jonathon Menz 2016-03-20 10:29:45 -07:00
parent f28dcdbb2e
commit 283885f091
3 changed files with 133 additions and 129 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
admin/css/screen.css
View File

@ -612,11 +612,12 @@ body.cms { overflow: hidden; }
.ui-tabs .ui-tabs-nav li:active { outline: none; } .ui-tabs .ui-tabs-nav li:active { outline: none; }
.ui-tabs .ui-tabs-nav li a { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; outline: none; float: none; font-weight: normal; color: #4f5861; line-height: 32px; padding: 0 12px 0; } .ui-tabs .ui-tabs-nav li a { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; outline: none; float: none; font-weight: normal; color: #4f5861; line-height: 32px; padding: 0 12px 0; }
.ui-tabs .ui-tabs-nav li:last-child { margin-right: 0; } .ui-tabs .ui-tabs-nav li:last-child { margin-right: 0; }
.ui-tabs .ui-tabs-nav li.ui-tabs-active, .ui-tabs .ui-tabs-nav li.ui-state-default, .ui-tabs .ui-tabs-nav li.ui-state-active { margin-bottom: -1px; padding-bottom: 0; }
.ui-tabs .ui-tabs-nav .ui-state-default { border: 0; background: transparent; } .ui-tabs .ui-tabs-nav .ui-state-default { border: 0; background: transparent; }
.ui-tabs .ui-tabs-nav .ui-state-default a { line-height: 28px; padding-top: 12px; padding-bottom: 8px; color: #66727d; } .ui-tabs .ui-tabs-nav .ui-state-default a { line-height: 28px; padding-top: 12px; padding-bottom: 5px; color: #66727d; border-bottom: 3px solid transparent; }
.ui-tabs .ui-tabs-nav .ui-state-default a:hover { color: #4f5861; } .ui-tabs .ui-tabs-nav .ui-state-default a:hover { color: #4f5861; }
.ui-tabs .ui-tabs-nav .ui-state-active { padding-bottom: 1px; background-color: transparent; cursor: text; } .ui-tabs .ui-tabs-nav .ui-state-active { background-color: transparent; cursor: text; }
.ui-tabs .ui-tabs-nav .ui-state-active a { border-bottom: 3px solid #66727d; padding-left: 0; padding-right: 0; margin: 0 12px 0; color: #4f5861; } .ui-tabs .ui-tabs-nav .ui-state-active a { border-color: #66727d; padding-left: 0; padding-right: 0; margin: 0 12px 0; color: #4f5861; }
.ui-tabs .ui-tabs-nav.ui-state-active { border-color: #808080; } .ui-tabs .ui-tabs-nav.ui-state-active { border-color: #808080; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.ui-corner-top { text-indent: -9999em; } .ui-tabs .ui-tabs-nav li.cms-tabset-icon.ui-corner-top { text-indent: -9999em; }
.ui-tabs .ui-tabs-nav li.cms-tabset-icon.ui-corner-top a { display: block; padding-left: 40px; padding-right: 0; margin: 0; } .ui-tabs .ui-tabs-nav li.cms-tabset-icon.ui-corner-top a { display: block; padding-left: 40px; padding-right: 0; margin: 0; }
@ -649,8 +650,7 @@ body.cms { overflow: hidden; }
.cms-content-header-tabs .icon-button-group { margin-right: 16px; } .cms-content-header-tabs .icon-button-group { margin-right: 16px; }
.cms-content-fields .ui-tabs-nav { float: none; padding: 0; border-bottom: 1px solid #d0d3d5; margin: 0 16px 0; } .cms-content-fields .ui-tabs-nav { float: none; padding: 0; border-bottom: 1px solid #d0d3d5; margin: 0 16px 0; }
.cms-content-fields .ui-tabs-nav li { margin-bottom: -1px; } .cms-content-fields .ui-tabs-nav li { margin: 0 12px -1px -12px; }
.cms-content-fields .ui-tabs-nav li.first a { margin-left: 0; padding-left: 0; }
/** ------------------------------------------------------- Loading Interface ------------------------------------------------------- */ /** ------------------------------------------------------- Loading Interface ------------------------------------------------------- */
.cms-content-loading-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9998; } .cms-content-loading-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9998; }

4
admin/css/screen.css.map
View File

File diff suppressed because one or more lines are too long

22
admin/scss/_style.scss
View File

@ -538,6 +538,14 @@ body.cms {
} }
} }
//jquery UI override
li.ui-tabs-active,
li.ui-state-default,
li.ui-state-active {
margin-bottom: -1px;
padding-bottom: 0;
}
.ui-state-default { .ui-state-default {
border: 0; border: 0;
background: transparent; background: transparent;
@ -545,8 +553,9 @@ body.cms {
a { a {
line-height: 28px; line-height: 28px;
padding-top: 12px; padding-top: 12px;
padding-bottom: 8px; padding-bottom: 5px;
color: lighten($color-text, 10%); color: lighten($color-text, 10%);
border-bottom: 3px solid transparent;
&:hover { &:hover {
color: $color-text; color: $color-text;
@ -555,12 +564,11 @@ body.cms {
} }
.ui-state-active { .ui-state-active {
padding-bottom: 1px;
background-color: transparent; background-color: transparent;
cursor: text; cursor: text;
a { a {
border-bottom: 3px solid #66727d; border-color: #66727d;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
margin: 0 12px 0; margin: 0 12px 0;
@ -683,12 +691,8 @@ body.cms {
margin: 0 16px 0; margin: 0 16px 0;
li { li {
margin-bottom: -1px; // Align tab content with gutter (supports multiple rows of tabs)
margin: 0 $grid-x*1.5 -1px $grid-x*-1.5;
&.first a {
margin-left: 0;
padding-left: 0;
}
} }
} }