mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-06-27 23:19:35 +02:00
MINOR Moved "insert x" dialog styling from generic UploadField.scss to CMS-specific _style.scss
This commit is contained in:
Ingo Schommer
parent
f0f6f1abec
commit
9009d43f63
|
|
@ -526,6 +526,25 @@ form.member-profile-form .ui-tabs-nav .ui-corner-all, form.member-profile-form .
|
|||
body.cms-dialog { overflow: auto; background: url("../images/textures/bg_cms_main_content.png") repeat left top #f0f3f4; position: relative; }
|
||||
|
||||
/** -------------------------------------------- "Insert X" forms -------------------------------------------- */
|
||||
.htmleditorfield-dialog.ui-dialog-content { padding: 0; position: relative; }
|
||||
.htmleditorfield-dialog .cms-content-header { padding: 0; width: 100%; height: 40px; }
|
||||
.htmleditorfield-dialog .cms-content-header h3 { padding: 0 8px; margin: 10px; }
|
||||
.htmleditorfield-dialog .ui-tabs { position: static; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav { float: right; position: absolute; top: 0; right: 40px; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzhjYTFhZSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #8ca1ae)); background-image: -webkit-linear-gradient(#b0bec7, #8ca1ae); background-image: -moz-linear-gradient(#b0bec7, #8ca1ae); background-image: -o-linear-gradient(#b0bec7, #8ca1ae); background-image: -ms-linear-gradient(#b0bec7, #8ca1ae); background-image: linear-gradient(#b0bec7, #8ca1ae); -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; padding-top: 10px; height: 28px; overflow: hidden; font-weight: bold; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li a { color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li.ui-state-active { background: #f0f3f4 url("../admin/images/textures/bg_cms_main_content.png") repeat left top; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li.ui-state-active a { color: #444444; text-shadow: none; }
|
||||
.htmleditorfield-dialog .ui-tabs .ui-tabs-panel { padding: 0; }
|
||||
.htmleditorfield-dialog .ss-insert-media, .htmleditorfield-dialog .Actions { padding: 8px 16px; }
|
||||
.htmleditorfield-dialog .details .file-url { display: block; width: 450px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; }
|
||||
.htmleditorfield-dialog .details .cms-file-info .field { border: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); }
|
||||
.htmleditorfield-dialog .details .field { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }
|
||||
.htmleditorfield-dialog .details .field.last { border-bottom: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); margin-bottom: 0; }
|
||||
.htmleditorfield-dialog .details .img-detail-group { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); margin: 0 0 8px 0; }
|
||||
.htmleditorfield-dialog .details .img-detail-group .extraLabel { display: block; position: relative; top: -8px; margin-left: 184px; color: #ccc; color: rgba(0, 0, 0, 0.5); font-style: italic; padding: 0; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.7); }
|
||||
.htmleditorfield-dialog .details .img-detail-group .field { border-bottom: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); }
|
||||
|
||||
.htmleditorfield-linkform .step2 { margin-bottom: 16px; }
|
||||
|
||||
.htmleditorfield-mediaform .ss-gridfield tbody td:first-child img { max-height: 30px; }
|
||||
|
|
|
|||
|
|
@ -1429,6 +1429,101 @@ body.cms-dialog {
|
|||
/** --------------------------------------------
|
||||
* "Insert X" forms
|
||||
* -------------------------------------------- */
|
||||
.htmleditorfield-dialog{
|
||||
&.ui-dialog-content{
|
||||
padding:0;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.cms-content-header{
|
||||
padding:0;
|
||||
width:100%;
|
||||
height: 40px;
|
||||
h3{
|
||||
padding: 0 8px;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
.ui-tabs{
|
||||
position:static;
|
||||
ul.ui-tabs-nav{
|
||||
float:right;
|
||||
position:absolute;
|
||||
top:0;
|
||||
right: 40px;
|
||||
li{
|
||||
@include background-image(
|
||||
linear-gradient(#B0BEC7, #8CA1AE)
|
||||
);
|
||||
@include border-radius(0px);
|
||||
padding-top: 10px;
|
||||
height: 28px;
|
||||
overflow:hidden;
|
||||
font-weight:bold;
|
||||
a{
|
||||
color:#fff;
|
||||
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
&.ui-state-active{
|
||||
background: #F0F3F4 url("../admin/images/textures/bg_cms_main_content.png") repeat left top;
|
||||
a{
|
||||
color:$color-text;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.ui-tabs-panel{
|
||||
padding:0;
|
||||
}
|
||||
}
|
||||
.ss-insert-media, .Actions{
|
||||
padding:$grid-y $grid-x*2 ;
|
||||
}
|
||||
.details{
|
||||
.file-url{
|
||||
display:block;
|
||||
width:450px;
|
||||
@include hide-text-overflow;
|
||||
}
|
||||
.cms-file-info{
|
||||
.field{
|
||||
border:none;
|
||||
@include box-shadow(0 0 0 rgba(0, 0, 0, 0));
|
||||
}
|
||||
}
|
||||
.field{
|
||||
border-bottom: 1px solid $color-shadow-light;
|
||||
@include box-shadow(0 1px 0 lighten($color-shadow-light, 95%));
|
||||
&.last{
|
||||
border-bottom:none;
|
||||
@include box-shadow(0 0 0 rgba(0, 0, 0, 0));
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
.img-detail-group{
|
||||
border-bottom: 1px solid $color-shadow-light;
|
||||
@include box-shadow(0 1px 0 lighten($color-shadow-light, 95%));
|
||||
margin: 0 0 8px 0;
|
||||
.extraLabel{
|
||||
display:block;
|
||||
position:relative;
|
||||
top: 0 - $grid-y;
|
||||
margin-left:176px + $grid-y; //width of main label
|
||||
color: #ccc;
|
||||
color: rgba(#000, 0.5);
|
||||
font-style:italic;
|
||||
padding:0;
|
||||
@include text-shadow(1px 1px 0 rgba($color-text-shadow, 0.7));
|
||||
}
|
||||
.field{
|
||||
border-bottom:none;
|
||||
@include box-shadow(0 0 0 rgba(0, 0, 0, 0));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.htmleditorfield-linkform {
|
||||
.step2 {
|
||||
margin-bottom: $grid-x*2;
|
||||
|
|
|
|||
|
|
@ -4,25 +4,6 @@
|
|||
/** ----------------------------------------------- Typography. ------------------------------------------------ */
|
||||
/** ----------------------------------------------- Grid Units (px) We have a vertical rhythm that the grid is based off both x (=horizontal) and y (=vertical). All internal padding and margins are scaled to this and accounting for paragraphs ------------------------------------------------ */
|
||||
/** ----------------------------------------------- Application Logo (CMS Logo) Must be 24px x 24px ------------------------------------------------ */
|
||||
.htmleditorfield-dialog.ui-dialog-content { padding: 0; position: relative; }
|
||||
.htmleditorfield-dialog .cms-content-header { padding: 0; width: 100%; height: 40px; }
|
||||
.htmleditorfield-dialog .cms-content-header h3 { padding: 0 8px; margin: 10px; }
|
||||
.htmleditorfield-dialog .ui-tabs { position: static; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav { float: right; position: absolute; top: 0; right: 40px; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li { background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #8ca1ae)); background-image: -webkit-linear-gradient(#b0bec7, #8ca1ae); background-image: -moz-linear-gradient(#b0bec7, #8ca1ae); background-image: -o-linear-gradient(#b0bec7, #8ca1ae); background-image: -ms-linear-gradient(#b0bec7, #8ca1ae); background-image: linear-gradient(#b0bec7, #8ca1ae); -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; padding-top: 10px; height: 28px; overflow: hidden; font-weight: bold; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li a { color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li.ui-state-active { background: #f0f3f4 url("../admin/images/textures/bg_cms_main_content.png") repeat left top; }
|
||||
.htmleditorfield-dialog .ui-tabs ul.ui-tabs-nav li.ui-state-active a { color: #444444; text-shadow: none; }
|
||||
.htmleditorfield-dialog .ui-tabs .ui-tabs-panel { padding: 0; }
|
||||
.htmleditorfield-dialog .ss-insert-media, .htmleditorfield-dialog .Actions { padding: 8px 16px; }
|
||||
.htmleditorfield-dialog .details .file-url { display: block; width: 450px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; o-text-overflow: ellipsis; }
|
||||
.htmleditorfield-dialog .details .cms-file-info .field { border: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); }
|
||||
.htmleditorfield-dialog .details .field { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }
|
||||
.htmleditorfield-dialog .details .field.last { border-bottom: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); margin-bottom: 0; }
|
||||
.htmleditorfield-dialog .details .img-detail-group { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); margin: 0 0 8px 0; }
|
||||
.htmleditorfield-dialog .details .img-detail-group .extraLabel { display: block; position: relative; top: -8px; margin-left: 184px; color: #ccc; color: rgba(0, 0, 0, 0.5); font-style: italic; padding: 0; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.7); }
|
||||
.htmleditorfield-dialog .details .img-detail-group .field { border-bottom: none; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 rgba(0, 0, 0, 0); }
|
||||
|
||||
.ss-uploadfield .clear { clear: both; }
|
||||
.ss-insert-media .ss-uploadfield { margin-top: 20px; }
|
||||
.ss-insert-media .ss-uploadfield h4 { float: left; }
|
||||
|
|
@ -33,7 +14,7 @@
|
|||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info { margin: 0 0 0 100px; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name { display: block; line-height: 13px; height: 26px; margin: 0; text-align: left; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name b { font-weight: bold; padding: 0 5px 0 0; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name .name { font-size: 11px; color: #848484; width: 290px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; o-text-overflow: ellipsis; display: inline; float: left; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name .name { font-size: 11px; color: #848484; width: 290px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; display: inline; float: left; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name .ss-uploadfield-item-status { float: right; padding: 0 0 0 5px; width: 100px; text-align: right; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name .ss-uploadfield-item-status.ui-state-error-text { color: red; font-weight: bold; }
|
||||
.ss-uploadfield .ss-uploadfield-item .ss-uploadfield-item-info .ss-uploadfield-item-name .ss-uploadfield-item-status.ui-state-warning-text { color: #cc7600; }
|
||||
|
|
|
|||
|
|
@ -4,104 +4,6 @@
|
|||
@import "../admin/scss/themes/default.scss";
|
||||
@import "../admin/scss/_mixins";
|
||||
|
||||
.htmleditorfield-dialog{
|
||||
&.ui-dialog-content{
|
||||
padding:0;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.cms-content-header{
|
||||
padding:0;
|
||||
width:100%;
|
||||
height: 40px;
|
||||
h3{
|
||||
padding: 0 8px;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
.ui-tabs{
|
||||
position:static;
|
||||
ul.ui-tabs-nav{
|
||||
float:right;
|
||||
position:absolute;
|
||||
top:0;
|
||||
right: 40px;
|
||||
li{
|
||||
@include background-image(
|
||||
linear-gradient(#B0BEC7, #8CA1AE)
|
||||
);
|
||||
@include border-radius(0px);
|
||||
padding-top: 10px;
|
||||
height: 28px;
|
||||
overflow:hidden;
|
||||
font-weight:bold;
|
||||
a{
|
||||
color:#fff;
|
||||
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
&.ui-state-active{
|
||||
background: #F0F3F4 url("../admin/images/textures/bg_cms_main_content.png") repeat left top;
|
||||
a{
|
||||
color:$color-text;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.ui-tabs-panel{
|
||||
padding:0;
|
||||
}
|
||||
}
|
||||
.ss-insert-media, .Actions{
|
||||
padding:$grid-y $grid-x*2 ;
|
||||
}
|
||||
.details{
|
||||
|
||||
.file-url{
|
||||
display:block;
|
||||
width:450px;
|
||||
@include hide-text-overflow;
|
||||
}
|
||||
|
||||
|
||||
.cms-file-info{
|
||||
.field{
|
||||
border:none;
|
||||
@include box-shadow(0 0 0 rgba(0, 0, 0, 0));
|
||||
}
|
||||
}
|
||||
.field{
|
||||
border-bottom: 1px solid $color-shadow-light;
|
||||
@include box-shadow(0 1px 0 lighten($color-shadow-light, 95%));
|
||||
&.last{
|
||||
border-bottom:none;
|
||||
@include box-shadow(0 0 0 rgba(0, 0, 0, 0));
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
.img-detail-group{
|
||||
border-bottom: 1px solid $color-shadow-light;
|
||||
@include box-shadow(0 1px 0 lighten($color-shadow-light, 95%));
|
||||
margin: 0 0 8px 0;
|
||||
.extraLabel{
|
||||
display:block;
|
||||
position:relative;
|
||||
top: 0 - $grid-y;
|
||||
margin-left:176px + $grid-y; //width of main label
|
||||
color: #ccc;
|
||||
color: rgba(#000, 0.5);
|
||||
font-style:italic;
|
||||
padding:0;
|
||||
@include text-shadow(1px 1px 0 rgba($color-text-shadow, 0.7));
|
||||
}
|
||||
.field{
|
||||
border-bottom:none;
|
||||
@include box-shadow(0 0 0 rgba(0, 0, 0, 0));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ss-uploadfield {
|
||||
|
||||
.clear {
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user