silverstripe-framework/admin/client/src/styles/legacy/_elementMixins.scss

95 lines
1.8 KiB
SCSS

//**
// * This file contains mixins relating to specific functionality
// *
// * Mixins should be stored here rather than individual files
// */
//*Mixin generates the generic button styling for the gridfield*/
@mixin gridFieldButtons{
border:none;
display:block;
text-indent:-9999em;
width:30px;
height:25px; //match the height of the input field
}
// Mixin generates the styling for the actions buttons in file uploads
@mixin ss-uploadfield-action-buttons{
.ss-ui-button {
background: none;
border: 0;
box-shadow: none;
text-shadow: none;
color: $color-text-light;
float: right;
&.ss-uploadfield-item-delete {
// TODO tmp hack until we have permissions and can disable delete
display: none;
}
&.ss-uploadfield-item-cancel, &.ss-uploadfield-item-overwrite-warning {
border-radius: 0;
border-left:1px solid rgba(#fff, 0.2);
margin-top:0px;
cursor: pointer;
opacity:0.9;
&:hover{
opacity:1;
}
.ui-icon {
display: block;
margin: 0;
position:realtive;
top:8px;
}
}
@include ss-uploadfield-editButton;
}
}
//**
// Mixin creates a transparent button with a dropdown arrow,
// as is used for files in the files up-load area. The arrows
// themselves are added in the _style file
//**/
@mixin ss-uploadfield-editButton{
&.ss-uploadfield-item-edit {
opacity:0.9;
padding-top: 1px;
padding-bottom: 0;
height:100%;
border-radius: 0;
&.ui-state-hover{
background:none;
opacity:1;
span.toggle-details{
opacity:1;
}
}
span.toggle-details{
opacity:0.9;
margin-left:3px;
display: inline-block;
width: 5px;
height: 100%;
cursor: pointer;
.toggle-details-icon {
margin-top:1px;
display: inline-block;
width: 8px;
height: 6px;
vertical-align: middle;
&.opened {
margin-top:0;
}
}
}
}
.ui-icon {
display: none;
}
}