silverstripe-dms/scss/DMSMainCMS.scss

341 lines
6.0 KiB
SCSS

@import '_mixins';
//data-icon="cross-circle"
$gf_colour_zebra: #F0F4F7;
.ui-autocomplete{
border: 1px solid #DDD;
box-shadow: 0 1px 2px 0px #AFAFAF;
max-height: 300px;
overflow: scroll;
}
.cms fieldset.documents, .cms fieldset.relatedLinks{
table{
td{
white-space:normal;
}
td.col-buttons{
white-space:nowrap;
.dms-delete-link-only{
.ui-icon{
background: url(../images/chain-unchain.png) no-repeat;
}
}
}
tr.dms-document-hidden-row {
&.odd {
background-color: mix($gf_colour_zebra, rgba(255, 4, 0, 0.2));
}
&.even {
background-color: mix($gf_colour_zebra, rgba(255, 4, 0, 0.35));
}
&:hover {
background-color: mix($gf_colour_zebra, rgba(255, 4, 0, 0.6)) !important;
}
}
}
}
.DMSDocumentAddController .ui-tabs{
ul.ui-tabs-nav{
border-bottom:none;
float: right;
margin: 8px 0 -1px 0;
padding: 0 24px 0 0;
li{
padding-bottom: 1px;
border: 1px solid #C0C0C2;
a{
padding: 8px 20px 8px;
}
}
}
}
.ss-add {
.document-add-existing {
input.document-autocomplete {
position: absolute;
z-index: 9999;
//top: 70px;
width: 390px;
padding: 9px 7px;
border-bottom-right-radius:0;
border-top-right-radius:0;
outline:none;
box-sizing:border-box;
-moz-box-sizing: border-box;
&[disabled] {
color: #C0C0C2;
text-shadow: 0 -1px 0 #FFF;
background: #EEE;
background-image:none;
box-shadow: inset 0 1px 8px 0 #C4C4C4;
border-bottom-left-radius:0;
border-bottom-right-radius:0;
}
}
.TreeDropdownField {
border:none;
width: 100%;
max-width: 512px;
box-sizing: border-box;
cursor:pointer;
}
.treedropdownfield-toggle-panel-link {
padding: 5px 9px 9px;
background: #fff;
border: 1px solid #B3B3B3;
float: right;
z-index: 99999;
position: relative;
&.treedropdownfield-open-tree {
background: #fff;
border: 1px solid #B3B3B3;
border-bottom:none;
border-bottom-right-radius:0;
}
}
.treedropdownfield-title {
width: auto;
}
.treedropdownfield-toggle-panel-link a {
display: inline-block;
top: 4px;
position: relative;
}
.document-list {
position: absolute;
z-index: 9999;
width: 510px;
border: 1px solid #DDD;
border-top:none;
background: #ffffff;
display: none;
box-shadow:0 2px 4px 1px #DDD;
max-height:300px;
border-radius: 6px;
background-clip: padding-box;
overflow:scroll;
ul{
padding: 4px 0;
li{
line-height:18px;
a{
display: block;
padding: 4px 8px;
border: 1px solid #FFF;
color: black;
&:hover{
border: 1px solid #CCC;
border-radius: 4px;
background: rgba(203, 203, 203, 0.4);
cursor: pointer;
text-decoration:none;
outline:none;
text-shadow:none;
}
}
}
}
}
&.link-editor-context{
label{
float: left;
display: block;
width: 176px;
padding:8px 8px 8px 0;
line-height: 16px;
font-weight: bold;
text-shadow: 1px 1px 0 white;
}
.middleColumn{
margin-left: 184px;
input{
background:white;
border: 1px solid #B3B3B3;
line-height: 16px;
margin: 0;
border-radius: 4px;
background-size: 100%;
max-width: 512px;
}
}
}
}
.ss-assetuploadfield{
&.link-editor-context{
label{
float: left;
display: block;
width: 176px;
padding:8px 8px 8px 0;
line-height: 16px;
font-weight: bold;
text-shadow: 1px 1px 0 white;
}
.middleColumn{
margin-left: 184px;
display: block;
padding: 8px 8px 8px 0;
font-style: italic;
min-height:20px;
}
}
.step4{
margin-bottom: 10px;
}
}
}
//Styling for tree dropdown field
.cms{
.ss-add, .selectiongroup{
.treedropdownfield-panel {
margin: -1px 0 0 0;
box-sizing: border-box;
ul {
padding: 4px 0;
li {
border: 1px solid #ffffff;
a {
display: block;
padding: 4px 2px;
&.jstree-hovered {
background: rgba(203, 203, 203, 0.4);
border: 1px solid #CCC;
}
}
}
}
}
}
}
// Hack for Firefox to fix padding on adding document input.
// FF renders the size different and pushes it out by 2px compared to webkit
@-moz-document url-prefix() {
.ss-add{
.document-add-existing{
input{
padding: 10px 7px;
}
}
}
}
#Form_EditForm_Documents{
padding: 1em 0;
input[name="filter[LastChanged]"] {
display: none;
}
}
#Form_EditForm_RelatedLinks{
table{
padding: 1em 0;
thead{
h2{
display: none;
}
}
}
}
#SectionID, #DocumentTypeID{
@include tabButtons;
}
#Form_ItemEditForm{
h3:first-child{
display: inline-block;
float: left;
width: 184px;
}
ul.SelectionGroup{
display: inline-block;
position: relative;
padding: 0;
margin-top: 9px;
margin-left: 0;
height: 110px;
background: none;
border: none;
li{
width: auto;
clear: none;
display: inline;
margin-right: 4px;
input{
&.selector{
display:none;
}
}
label{
&.ui-button{
@include background(
linear-gradient(color-stops(
lighten($color-button-generic, 10%),
darken($color-button-generic, 5%)
))
);
font-weight: bold;
border: 1px solid #C0C0C2;
border-radius: 3px;
padding: 0.8em 1.5em;
&:hover {
box-shadow: 0 0 5px rgba(0,0,0,0.3);
}
}
}
div.field{
margin-left: 0px;
margin-bottom: 1em;
width: 600px;
position: absolute;
left:0;
margin-top: 13px;
padding: 10px;
background: white;
border: 1px solid #B3B3B3;
@include border-radius(4px);
@include background-image(linear-gradient(#efefef, #fff 10%, #fff 90%, #efefef));
}
&.selected{
label.ui-button{
@include active-actions-btn;
&:after {
top: 43px;
}
}
}
}
.treedropdownfield-panel{
margin: 1px 0 0 -1px;
box-sizing: content-box;
ul{
li{
display: block;
clear: both;
width: 100%;
margin: 0;
li {
padding-left: 20px;
}
}
}
}
}
}