mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-10-22 14:05:37 +02:00
3ee8f505b7
The main benefit of this is so that authors who make use of
.editorconfig don't end up with whitespace changes in their PRs.
Spaces vs. tabs has been left alone, although that could do with a
tidy-up in SS4 after the switch to PSR-1/2.
The command used was this:
for match in '*.ss' '*.css' '*.scss' '*.html' '*.yml' '*.php' '*.js' '*.csv' '*.inc' '*.php5'; do
find . -path ./thirdparty -not -prune -o -path ./admin/thirdparty -not -prune -o -type f -name "$match" -exec sed -E -i '' 's/[[:space:]]+$//' {} \+
find . -path ./thirdparty -not -prune -o -path ./admin/thirdparty -not -prune -o -type f -name "$match" | xargs perl -pi -e 's/ +$//'
done
401 lines
9.0 KiB
SCSS
401 lines
9.0 KiB
SCSS
@import "compass/css3";
|
|
|
|
|
|
// TODO we need a seperated file for styles that are used in both cms and front end (such as buttons)
|
|
@import "../admin/scss/themes/default.scss";
|
|
@import "../admin/scss/_mixins";
|
|
@import "_elementMixins";
|
|
|
|
// Temporary. To be hidden and replaced with javascript tooltip
|
|
.ss-uploadfield-view-allowed-extensions {
|
|
padding-top:5px;
|
|
clear:both;
|
|
max-width:750px;
|
|
display:block;
|
|
|
|
.toggle {
|
|
font-style: normal;
|
|
font-size: $font-base-size;
|
|
}
|
|
}
|
|
|
|
.backlink {
|
|
padding-left: 12px;
|
|
}
|
|
|
|
body.cms.ss-uploadfield-edit-iframe {
|
|
overflow: auto;
|
|
background: #E2E2E2;
|
|
|
|
span.readonly {
|
|
font-style:italic;
|
|
color:lighten($color-text, 20%);
|
|
text-shadow: 0px 1px 0px #fff;
|
|
}
|
|
.fieldholder-small{
|
|
|
|
label{
|
|
margin-left:0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.composite.ss-assetuploadfield .details fieldset {
|
|
@extend body.cms.ss-uploadfield-edit-iframe;
|
|
padding: $grid-x*2;
|
|
}
|
|
|
|
.ss-assetuploadfield {
|
|
border-bottom: 0;
|
|
@include box-shadow(none);
|
|
|
|
h3 {
|
|
border-bottom: 1px solid $color-shadow-light;
|
|
@include box-shadow(0 1px 0 lighten($color-shadow-light, 95%));
|
|
margin: 0 0 8px;
|
|
padding: 0 0 7px;
|
|
clear: both;
|
|
position:relative;
|
|
}
|
|
.field {
|
|
border-bottom: 0;
|
|
box-shadow:none;
|
|
}
|
|
.fileOverview{
|
|
clear:both;
|
|
margin-top:10px;
|
|
position:relative;
|
|
|
|
.uploadStatus{
|
|
@include clearfix;
|
|
.state{
|
|
float:left;
|
|
font-size: 16px;
|
|
font-weight:bold;
|
|
line-height:1.1em;
|
|
}
|
|
.details{
|
|
opacity:0.9;
|
|
float:right;
|
|
}
|
|
}
|
|
}
|
|
.ss-uploadfield-item-actions.edit-all{
|
|
clear:both;
|
|
position:relative;
|
|
z-index:9;
|
|
.ss-uploadfield-item-edit-all {
|
|
z-index:8;
|
|
position:absolute;
|
|
top:-33px;
|
|
padding:0;
|
|
background: none;
|
|
border: 0;
|
|
right:0;
|
|
@include box-shadow(none);
|
|
color: $color-text;
|
|
&:hover{
|
|
color: #1e7cba;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.ss-uploadfield-files {
|
|
margin: 0;
|
|
padding: 0;
|
|
clear:both;
|
|
|
|
.ss-uploadfield-item {
|
|
border: 1px solid lighten($color-medium-separator, 20%);
|
|
@include border-radius(5px);
|
|
@include background-clip(padding-box);
|
|
margin: 0 0 5px;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
position: relative;
|
|
.info {
|
|
position: relative;
|
|
padding: 7px;
|
|
overflow: hidden;
|
|
background-color: #FFBE66;
|
|
border: 1px solid #FF9300;
|
|
}
|
|
}
|
|
.ss-uploadfield-item-preview {
|
|
position: absolute;
|
|
height: 30px;
|
|
width: 40px;
|
|
overflow: hidden;
|
|
z-index: 1;
|
|
.no-preview{
|
|
display:block;
|
|
height:100%;
|
|
width:100%;
|
|
background:url('../images/icons/document.png') 2px 0px no-repeat;
|
|
}
|
|
}
|
|
.ss-uploadfield-item-info {
|
|
position: relative;
|
|
line-height: 30px;
|
|
overflow: hidden;
|
|
background-color: #5db4df;
|
|
@include background-image(linear-gradient(top, #5db4df 0%,#5db1dd 8%,#439bcb 50%,#3f99cd 54%,#207db6 96%,#1e7cba 100%));
|
|
}
|
|
.ui-state-error .ss-uploadfield-item-info {
|
|
background-color: #c11f1d;
|
|
padding-right:130px;
|
|
@include background-image(linear-gradient(top, #c11f1d 0%,#bf1d1b 4%,#b71b1c 8%,#b61e1d 15%,#b11d1d 27%,#ab1d1c 31%,#a51b1b 42%,#9f1b19 46%,#9f1b19 50%,#991c1a 54%,#971a18 58%,#911b1b 62%,#911b1b 65%,#7e1816 88%,#771919 92%,#731817 100%));
|
|
|
|
.ss-uploadfield-item-name {
|
|
width:100%;
|
|
cursor:default;
|
|
background: darken($color-button-disabled,20%); //for browsers that don't support rgba
|
|
background: rgba(darken($color-button-disabled, 15%),0.9);
|
|
|
|
.name {
|
|
text-shadow: 0px 1px 0px rgba(#fff, 0.7);
|
|
}
|
|
}
|
|
}
|
|
.ui-state-warning .ss-uploadfield-item-info {
|
|
background-color: $color-warning;
|
|
@include background-image(
|
|
linear-gradient(
|
|
top,
|
|
desaturate(lighten($color-warning, 10%), 20%) 0%,
|
|
desaturate(lighten($color-warning, 5%), 20%) 8%,
|
|
desaturate($color-warning, 20%) 50%,
|
|
desaturate(darken(mix($color-warning, $color-button-destructive, 99%),0%), 20%) 54%,
|
|
desaturate(darken(mix($color-warning, $color-button-destructive, 80%),1%), 20%) 96%,
|
|
desaturate(darken(mix($color-warning, $color-button-destructive, 70%),2%), 20%) 100%)
|
|
);
|
|
}
|
|
|
|
.ss-uploadfield-item-name {
|
|
position: relative;
|
|
z-index: 1;
|
|
margin: 3px 0 3px 50px;
|
|
width: 50%;
|
|
color:lighten($color-text, 10%);
|
|
background:$color-button-disabled; //for browsers that don't support rgba
|
|
background: rgba(#fff, 0.8);
|
|
@include border-radius(3px);
|
|
line-height: 24px;
|
|
height: 22px;
|
|
padding: 0 5px;
|
|
text-align: left;
|
|
cursor:pointer;
|
|
//display:table, and table-layout:fixed allows us to use percentages with text-overflow
|
|
display:table;
|
|
table-layout:fixed;
|
|
|
|
.name {
|
|
text-shadow: 0px 1px 0px rgba(#fff, 0.5);
|
|
display:inline;
|
|
float:left;
|
|
max-width:50%;
|
|
font-weight: normal;
|
|
padding: 0 5px 0 0;
|
|
@include hide-text-overflow;
|
|
}
|
|
.ss-uploadfield-item-status {
|
|
position:relative;
|
|
float: right;
|
|
padding: 0 0 0 5px;
|
|
max-width:30%;
|
|
@include hide-text-overflow;
|
|
text-shadow: 0px 1px 0px rgba(#fff, 0.5);
|
|
|
|
&.ui-state-error-text {
|
|
text-shadow: 0px 1px 0px rgba(#fff, 0.6);
|
|
color: darken($color-button-destructive, 10%);
|
|
}
|
|
&.ui-state-warning-text {
|
|
color: darken($color-warning, 10%);
|
|
}
|
|
&.ui-state-success-text {
|
|
color: $color-button-constructive;
|
|
}
|
|
}
|
|
}
|
|
.ss-uploadfield-item-actions {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
left: 0;
|
|
z-index: 0;
|
|
color: #f00;
|
|
@include ss-uploadfield-action-buttons;
|
|
font-size:14px;
|
|
}
|
|
|
|
.ss-uploadfield-item-progress {
|
|
width: 100%;
|
|
|
|
div {
|
|
@include border-radius(5px);
|
|
height: 30px;
|
|
padding: 0;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
}
|
|
.ss-uploadfield-item-progressbar {
|
|
background-color: #92a6b3;
|
|
@include background-image(linear-gradient(top, #92a6b3 0%,#90aab8 11%,#96b1bf 22%,#9eb4c1 33%,#a7bac7 44%,#c1d5dc 100%));
|
|
}
|
|
.ss-uploadfield-item-progressbarvalue {
|
|
width: 0;
|
|
background: #60b3dd url(../images/progressbar_blue.gif) repeat left center;
|
|
}
|
|
}
|
|
|
|
.ss-uploadfield-item-editform {
|
|
/* don't use display none, for it will break jQuery('iframe').contents().height() */
|
|
height: 0;
|
|
overflow: hidden;
|
|
clear: both;
|
|
|
|
&.loading {
|
|
width: 100%;
|
|
height: 22px;
|
|
padding: 15px 0;
|
|
background: url(../admin/images/spinner.gif) no-repeat 50% 50%;
|
|
|
|
iframe {
|
|
/* Old IE needs this or it'll give the iframe a white background, covering the spinner */
|
|
padding-top: 0; margin-top: 37px;
|
|
border: none;
|
|
}
|
|
}
|
|
|
|
iframe {
|
|
width: 100%;
|
|
padding: $grid-x*2;
|
|
background: #E2E2E2;
|
|
}
|
|
}
|
|
}
|
|
|
|
.ss-uploadfield-addfile {
|
|
|
|
.ss-uploadfield-item-info {
|
|
float: left;
|
|
margin: 25px 0 0;
|
|
.ss-insert-media &{
|
|
margin: 10px 0px 0 20px;
|
|
}
|
|
label{
|
|
font-size: 18px;
|
|
line-height: 30px;
|
|
padding: 0px 16px;
|
|
margin-right:0px;
|
|
}
|
|
}
|
|
.ss-uploadfield-fromcomputer {
|
|
/*position: relative; */
|
|
overflow: hidden;
|
|
display: block;
|
|
.btn-icon-drive-upload-large {
|
|
background: url(../images/drive-upload-white.png) no-repeat 0px 0px;
|
|
width:32px;
|
|
height:32px;
|
|
margin-top:-12px;
|
|
}
|
|
}
|
|
.ss-uploadfield-item-uploador {
|
|
float: left;
|
|
font-weight: bold;
|
|
font-size: 22px;
|
|
padding: 0 20px;
|
|
line-height: 70px;
|
|
margin-top:10px;
|
|
display: none;
|
|
.ss-insert-media &{
|
|
font-size: 18px;
|
|
margin-top: -5px;
|
|
}
|
|
}
|
|
.ss-uploadfield-dropzone {
|
|
margin-top:9px;
|
|
padding: 8px 0;
|
|
@include border-radius(13px);
|
|
@include box-shadow(rgba($color-medium-separator, 0.4) 0 0 4px 0 inset, 0 1px 0 #FAFAFA);
|
|
border: 2px dashed $color-medium-separator;
|
|
background: lighten($color-base,12%);
|
|
display: none;
|
|
height: 54px;
|
|
min-width: 280px;
|
|
float: left;
|
|
text-align: center;
|
|
|
|
&.active{
|
|
&.hover{
|
|
@include box-shadow(rgba(#fff,0.6) 0 0 3px 2px inset);
|
|
}
|
|
}
|
|
div {
|
|
color:lighten($color-text, 10%);
|
|
text-shadow: 0px 1px 0px #fff;
|
|
background: url('../images/upload.png') 0 10px no-repeat;
|
|
z-index:1;
|
|
padding: 6px 48px 0;
|
|
line-height: 25px;
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
display: inline-block;
|
|
span {
|
|
display: block;
|
|
font-size: 12px;
|
|
z-index:-1;
|
|
margin-top:-3px;
|
|
}
|
|
}
|
|
.ss-insert-media &{
|
|
height: 54px;
|
|
min-width: 250px; //Design has these smaller than main upload area
|
|
overflow:hidden;
|
|
padding:0;
|
|
margin-top:2px;
|
|
div{
|
|
background-position:0 11px;
|
|
padding-top:21px;
|
|
margin-left: 33px;
|
|
span{
|
|
height:38px;
|
|
font-size:18px;
|
|
line-height: 18px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/** ----------------------------------------------------
|
|
* "@2x" media query
|
|
* ---------------------------------------------------- */
|
|
|
|
@media
|
|
only screen and (-webkit-min-device-pixel-ratio: 2),
|
|
only screen and ( min--moz-device-pixel-ratio: 2),
|
|
only screen and ( -o-min-device-pixel-ratio: 2/1),
|
|
only screen and ( min-device-pixel-ratio: 2),
|
|
only screen and ( min-resolution: 192dpi),
|
|
only screen and ( min-resolution: 2dppx) {
|
|
|
|
/* Loading spinner */
|
|
.ss-assetuploadfield {
|
|
.ss-uploadfield-files {
|
|
.ss-uploadfield-item-editform {
|
|
&.loading {
|
|
background-image: url(../admin/images/spinner@2x.gif);
|
|
background-size: 43px 43px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|