tao-test/app/taoQtiItem/views/scss/qtiCreator/_interaction-sidebar.scss

109 lines
2.9 KiB
SCSS

@import "inc/bootstrap";
#item-editor-interaction-bar {
img.interaction-sidebar-icon {
width: 28px;
height: 28px;
display: block;
margin: 5px auto 8px;
opacity: 0.8;
}
.tool-group {
.panel.sub-group {
position: relative;
padding-top: 0 !important;
padding-bottom: 4px;
.tool-list {
position: relative;
z-index: 4;
}
.sub-group-cover {
position: absolute;
left: 0;
top: -7px;
width: 96%;
height: 100%;
background-color: rgba(mix(#fff, $grey, 85%), 0.3) !important;
z-index: 2;
border: 1px $websiteBorder solid;
@include border-radius(3);
margin: 2%;
cursor: no-drop !important;
&.blocking {
z-index: 10;
}
}
.sub-group-cover:after, .sub-group-cover:before {
bottom: 100%;
left: 35%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.sub-group-cover:after {
border-color: transparent;
border-bottom-color: mix(#fff, $grey, 85%);
border-width: 8px;
margin-left: -8px;
}
.sub-group-cover:before {
border-color: transparent;
border-bottom-color: $websiteBorder;
border-width: 9px;
margin-left: -9px;
}
}
}
.tool-list {
margin-top: -3px;
@extend %clearfix;
li {
width: 50%;
margin: 0;
float: left;
padding: 9px 3px;
@include font-size(12);
border: 1px dotted transparent;
cursor: move;
text-align: center;
&:hover {
background: white(.6);
border: 1px dotted #aaa;
}
span {
display: block;
margin: 5px auto 8px;
@include font-size(28);
opacity: .9;
}
img.icon {
max-height: 28px;
}
&.disabled {
cursor: default;
background-color: #eee !important;
&:hover {
background: white(.6);
border: 1px dotted transparent;
}
}
&.dev {
background: whiten($info, .95);
color: $info;
&:hover {
background: white(.6);
}
}
}
}
}