You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1087 lines
22 KiB
1087 lines
22 KiB
// ---------------------------------------------------------
|
|
// BASE CSS
|
|
// ---------------------------------------------------------
|
|
|
|
html, html a, body {
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
a {
|
|
transition: all 0.3s ease-in-out;
|
|
}
|
|
|
|
body {
|
|
font-family: $font-primary;
|
|
font-size: 14px;
|
|
color: $default-text-color;
|
|
line-height: 1.5;
|
|
letter-spacing: 0.2px;
|
|
background: $page-background;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
font-family: $font-secondary;
|
|
letter-spacing: 0.5px;
|
|
line-height: 1.5;
|
|
|
|
a {
|
|
font-family: $font-secondary;
|
|
}
|
|
|
|
small {
|
|
font-weight: 300;
|
|
color: lighten($default-dark, 5%);
|
|
}
|
|
}
|
|
|
|
p {
|
|
font-family: $font-primary;
|
|
line-height: 1.9;
|
|
}
|
|
|
|
.lead {
|
|
font-size: 18px;
|
|
}
|
|
|
|
ul {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
a {
|
|
color: $default-link;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: none;
|
|
color: darken($default-link, 20%);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
}
|
|
|
|
&.text-gray {
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
color: $default-dark !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
:focus {
|
|
outline: none;
|
|
}
|
|
|
|
hr {
|
|
border-top: 1px solid $border-color;
|
|
}
|
|
|
|
.btn-create-one{
|
|
border-color: #b8daff;
|
|
background-color: #cce5ff;
|
|
color: #004085 !important;
|
|
}
|
|
.btn-create-two{
|
|
border-color: #c3e6cb;
|
|
background-color: #d4edda;
|
|
color: #155724 !important;
|
|
}
|
|
.btn-create-three{
|
|
border-color: #cecece;
|
|
background-color: #ffffff;
|
|
color: #374548 !important;
|
|
}
|
|
|
|
/** BTN BUTTONS COLORS **/
|
|
.btn{
|
|
.btn-fw {
|
|
min-width: 120px;
|
|
}
|
|
}
|
|
.btn-primary {
|
|
color: #fff;
|
|
background-color: #308ee0;
|
|
border-color: #308ee0;
|
|
&:hover{
|
|
background-color: #1e7bcb;
|
|
border-color: #1d74c0;
|
|
}
|
|
}
|
|
.btn-secondary {
|
|
color: #212529;
|
|
background-color: #e5e5e5;
|
|
border-color: #e5e5e5;
|
|
&:hover{
|
|
background-color: #d2d2d2;
|
|
border-color: #cccccc;
|
|
}
|
|
}
|
|
.btn-success {
|
|
color: #fff;
|
|
background-color: #00ce68;
|
|
border-color: #00ce68;
|
|
&:hover{
|
|
background-color: #00a855;
|
|
border-color: #009b4e;
|
|
}
|
|
}
|
|
.btn-danger {
|
|
color: #fff;
|
|
background-color: #e65251;
|
|
border-color: #e65251;
|
|
&:hover{
|
|
background-color: #e13130;
|
|
border-color: #e02624;
|
|
}
|
|
}
|
|
.btn-warning {
|
|
color: #FFF;
|
|
background-color: #ffaf00;
|
|
border-color: #ffaf00;
|
|
&:hover{
|
|
background-color: #d99500;
|
|
border-color: #cc8c00;
|
|
}
|
|
}
|
|
.btn-info {
|
|
color: #fff;
|
|
background-color: #8862e0;
|
|
border-color: #8862e0;
|
|
&:hover{
|
|
background-color: #7042da;
|
|
border-color: #6837d8;
|
|
}
|
|
}
|
|
.btn-light {
|
|
color: #212529;
|
|
background-color: #f3f5f6;
|
|
border-color: #f3f5f6;
|
|
&:hover{
|
|
background-color: #dde3e6;
|
|
border-color: #d6dde0;
|
|
}
|
|
}
|
|
.btn-dark {
|
|
color: #fff;
|
|
background-color: #424964;
|
|
border-color: #424964;
|
|
&:hover{
|
|
background-color: #33384d;
|
|
border-color: #2e3345;
|
|
}
|
|
}
|
|
|
|
.btn-outline-primary {
|
|
color: #308ee0;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-color: #308ee0;
|
|
}
|
|
.btn-outline-secondary {
|
|
color: rgba(0, 0, 0, 0.5);
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-color: #e5e5e5;
|
|
}
|
|
.btn-outline-success {
|
|
color: #00ce68;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-color: #00ce68;
|
|
}
|
|
.btn-outline-danger {
|
|
color: #e65251;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-color: #e65251;
|
|
}
|
|
.btn-outline-warning {
|
|
color: #ffaf00;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-color: #ffaf00;
|
|
}
|
|
.btn-outline-info {
|
|
color: #8862e0;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border-color: #8862e0;
|
|
}
|
|
|
|
.footer p{
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.footer{
|
|
padding: 18px;
|
|
background-color: $default-white;
|
|
border-top: 1px solid #dee2e6;
|
|
}
|
|
|
|
/*** TABS ***/
|
|
.nav-tabs{
|
|
margin-bottom: 10px;
|
|
}
|
|
.tab-content{
|
|
margin-top: 10px;
|
|
}
|
|
|
|
/** SELECT */
|
|
|
|
.btn-select{
|
|
color: #495057;
|
|
background-color: white;
|
|
border-color: $select-color;
|
|
&.bs-placeholder{
|
|
color: $select-color !important;
|
|
}
|
|
}
|
|
|
|
.select2-container--default{
|
|
.select2-selection--single {
|
|
background-color: #fff;
|
|
border: 1px solid $select-color;
|
|
border-radius: 4px;
|
|
height: 40px !important;
|
|
line-height: 40px;
|
|
.select2-selection__rendered{
|
|
line-height: 40px;
|
|
}
|
|
.select2-selection__arrow{
|
|
height: 40px;
|
|
b{
|
|
border-color: #495057 transparent transparent transparent;
|
|
border-width: 6px 5px 0 5px;
|
|
left: 20%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.help-block{
|
|
font-size: 12px;
|
|
margin-bottom: 0;
|
|
}
|
|
// ---------------------------------------------------------
|
|
// PAGE CONTAINER
|
|
// ---------------------------------------------------------
|
|
|
|
.page-container {
|
|
min-height: 100vh;
|
|
padding-left: $offscreen-size;
|
|
transition: all 0.2s ease;
|
|
|
|
@include between($breakpoint-md, $breakpoint-xl) {
|
|
padding-left: $collapsed-size;
|
|
}
|
|
|
|
@include to($breakpoint-md) {
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
|
|
// ---------------------------------------------------------
|
|
// MAIN CONTAINER
|
|
// ---------------------------------------------------------
|
|
|
|
.main-content {
|
|
padding: 75px 20px 20px;
|
|
min-height: calc(100vh - 61px);
|
|
&.bg-content{
|
|
background-color: $page-background;
|
|
}
|
|
.box-body{
|
|
background-color: transparent;
|
|
}
|
|
@include to($breakpoint-md) {
|
|
padding: 85px 5px 5px;
|
|
}
|
|
}
|
|
|
|
.remain-height {
|
|
height: calc(100vh - 126px);
|
|
}
|
|
|
|
// ---------------------------------------------------------
|
|
// FULL CONTAINER
|
|
// ---------------------------------------------------------
|
|
|
|
.full-container {
|
|
left: $offscreen-size;
|
|
min-height: calc(100vh - #{$header-height});
|
|
position: absolute;
|
|
right: 0;
|
|
top: $header-height;
|
|
transition: all 0.2s ease;
|
|
|
|
@include between($breakpoint-md, $breakpoint-xl) {
|
|
left: 0;
|
|
padding-left: $collapsed-size;
|
|
}
|
|
|
|
@include to($breakpoint-md) {
|
|
left: 0;
|
|
}
|
|
}
|
|
|
|
// ---------------------------------------------------------
|
|
// COLLAPSE STATE
|
|
// ---------------------------------------------------------
|
|
|
|
.is-collapsed {
|
|
.page-container {
|
|
padding-left: $collapsed-size;
|
|
|
|
@include to($breakpoint-md) {
|
|
padding-left: 0;
|
|
}
|
|
|
|
@include between($breakpoint-md, $breakpoint-xl) {
|
|
padding-left: $offscreen-size;
|
|
}
|
|
}
|
|
|
|
.full-container {
|
|
left: $collapsed-size;
|
|
|
|
@include to($breakpoint-md) {
|
|
left: 0;
|
|
}
|
|
|
|
@include between($breakpoint-md, $breakpoint-xl) {
|
|
left: $offscreen-size;
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
// ---------------------------------------------------------
|
|
// FOOTER
|
|
// ---------------------------------------------------------
|
|
|
|
footer {
|
|
z-index: 1;
|
|
position: relative;
|
|
}
|
|
|
|
// ---------------------------------------------------------
|
|
// @Text Align
|
|
// ---------------------------------------------------------
|
|
|
|
.ta-c { text-align: center !important; }
|
|
.ta-l { text-align: left !important; }
|
|
.ta-r { text-align: right !important; }
|
|
|
|
// ---------------------------------------------------------
|
|
// @Font Size
|
|
// ---------------------------------------------------------
|
|
|
|
.fsz-xs { font-size: 0.75rem !important; }
|
|
.fsz-sm { font-size: 0.87rem !important; }
|
|
.fsz-def { font-size: 1rem !important; }
|
|
.fsz-md { font-size: 1.15rem !important; }
|
|
.fsz-lg { font-size: 1.4rem !important; }
|
|
.fsz-xl { font-size: 1.7rem !important; }
|
|
|
|
// ---------------------------------------------------------
|
|
// @Font Weight
|
|
// ---------------------------------------------------------
|
|
|
|
.fw-100 { font-weight: 100 !important; }
|
|
.fw-200 { font-weight: 200 !important; }
|
|
.fw-300 { font-weight: 300 !important; }
|
|
.fw-400 { font-weight: 400 !important; }
|
|
.fw-500 { font-weight: 500 !important; }
|
|
.fw-600 { font-weight: 600 !important; }
|
|
.fw-700 { font-weight: 700 !important; }
|
|
.fw-800 { font-weight: 800 !important; }
|
|
.fw-900 { font-weight: 900 !important; }
|
|
|
|
// ---------------------------------------------------------
|
|
// @Line Height
|
|
// ---------------------------------------------------------
|
|
|
|
.lh-0 { line-height: 0 !important; }
|
|
.lh-1 { line-height: 1 !important; }
|
|
.lh-3\/2 { line-height: 1.5 !important; }
|
|
|
|
.box-header{
|
|
color: $grey-900;
|
|
display: block;
|
|
padding: 0;
|
|
position: relative;
|
|
.box-title{
|
|
font-weight: 500;
|
|
color: #404852;
|
|
margin-bottom: 22px;
|
|
font-size: 14px;
|
|
text-transform: capitalize;
|
|
}
|
|
}
|
|
.carousel-item img{
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
//card cropper
|
|
.card-cropper{
|
|
padding-top: 1em;
|
|
padding-bottom: 1em;
|
|
.cropCanvas{
|
|
padding-bottom: 1em;
|
|
}
|
|
}
|
|
|
|
.card{
|
|
border: 1px solid rgba(0, 0, 0, 0.125);
|
|
border-radius: 0.25rem;
|
|
margin-bottom: 10px;
|
|
.card-body{
|
|
.tools{
|
|
width: 160px;
|
|
height: 160px;
|
|
display: block;
|
|
float: left;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
position: relative;
|
|
background-color: transparent;
|
|
&.cursor-none{
|
|
cursor: inherit;
|
|
}
|
|
.big_icon{
|
|
position: absolute;
|
|
width: 84px;
|
|
height: 84px;
|
|
top: 40%;
|
|
margin-top: -50px;
|
|
left: 44%;
|
|
margin-left: -32px;
|
|
text-align: center;
|
|
border: 1px solid rgba(0, 0, 0, 0.125) ;
|
|
border-radius: 50%;
|
|
img{
|
|
transition: transform .2s ease-in;
|
|
padding-top: 10px;
|
|
&:hover{
|
|
transform: scale(1.15);
|
|
}
|
|
}
|
|
a{
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
.content{
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
z-index: 2;
|
|
.name{
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
}
|
|
}
|
|
}
|
|
/*@include landscape($breakpoint-sm) {
|
|
padding: 0;
|
|
}*/
|
|
}
|
|
}
|
|
/* CATEGORY CLASSIC */
|
|
.category-list{
|
|
display: grid;
|
|
grid-gap: 1rem;
|
|
grid-row-gap: 16px;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
@include portrait($breakpoint-sm, $breakpoint-md){
|
|
grid-template-columns: repeat(2, 1fr);
|
|
}
|
|
@include landscape($breakpoint-sm) {
|
|
grid-template-columns: repeat(1, 1fr);
|
|
}
|
|
.card-category{
|
|
border: 1px solid #dee2e6;
|
|
border-bottom-width: 5px;
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-gap: 10px;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
position: relative;
|
|
.card-body{
|
|
padding: 0;
|
|
.image-container{
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
color: #ffffff;
|
|
overflow: hidden;
|
|
margin: auto;
|
|
.thumbnail{
|
|
&:before{
|
|
content: "";
|
|
background-color: #000;
|
|
z-index: 1;
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
opacity: .35;
|
|
}
|
|
}
|
|
&:hover img{
|
|
transform: scale(1.2);
|
|
}
|
|
img{
|
|
position: absolute;
|
|
top: -50%;
|
|
left: 0;
|
|
bottom: 25%;
|
|
right: 0;
|
|
transition: all 1s ease;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
.image-content{
|
|
position: relative;
|
|
z-index: 1;
|
|
text-align: center;
|
|
.title{
|
|
font-size: 18px;
|
|
}
|
|
.courses{
|
|
font-size: 12px;
|
|
}
|
|
a{
|
|
color: $default-white;
|
|
display: block;
|
|
width: 100%;
|
|
padding-top: 5%;
|
|
padding-bottom: 5%;
|
|
}
|
|
}
|
|
}
|
|
@include portrait($breakpoint-sm, $breakpoint-md){
|
|
padding: 0;
|
|
}
|
|
.title{
|
|
font-size: 16px;
|
|
a{
|
|
color: $grey-800;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
/* COURSE CLASSIC */
|
|
.course-list{
|
|
display: grid;
|
|
grid-gap: 1rem;
|
|
grid-row-gap: 16px;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
@include portrait($breakpoint-sm, $breakpoint-md){
|
|
grid-template-columns: repeat(2, 1fr);
|
|
}
|
|
@include landscape($breakpoint-sm) {
|
|
grid-template-columns: repeat(1, 1fr);
|
|
}
|
|
}
|
|
.card-course-classic{
|
|
border: 1px solid #dee2e6;
|
|
border-bottom-width: 5px;
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-gap: 10px;
|
|
align-items: center;
|
|
.card-body{
|
|
padding: 1rem 1.2rem;
|
|
.card-icon{
|
|
text-align: center;
|
|
}
|
|
@include portrait($breakpoint-sm, $breakpoint-md){
|
|
padding: 0.8rem;
|
|
}
|
|
.title{
|
|
font-size: 16px;
|
|
a{
|
|
color: $grey-800;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.checkbox_delete_picture{
|
|
padding-top: 1em;
|
|
}
|
|
|
|
/* COURSE GRID */
|
|
.card-course{
|
|
transform: perspective(1px) translateZ(0);
|
|
transition-property: box-shadow;
|
|
transition-duration: 0.3s;
|
|
box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15);
|
|
background-color: $default-white;
|
|
&:hover,
|
|
&:focus{
|
|
box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.20);
|
|
}
|
|
&.card-category{
|
|
.card-subtitle{
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
.card-image{
|
|
position: relative;
|
|
.card-tools{
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
}
|
|
|
|
.category{
|
|
position: absolute;
|
|
border-radius: 10px;
|
|
background-color: $default-yellow;
|
|
color: $default-black;
|
|
font-weight: bold;
|
|
padding: 0.2rem 0.8rem;
|
|
top: -0.8rem;
|
|
left: 0.5rem;
|
|
font-size: 12px;
|
|
}
|
|
.card-body{
|
|
padding: 0.5rem 0.25rem;
|
|
.card-title{
|
|
margin-bottom: 0.5rem;
|
|
.title{
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
line-height: 22px;
|
|
}
|
|
}
|
|
.card-author{
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
.list-name{
|
|
font-size: 12px;
|
|
color: $grey-700;
|
|
cursor: pointer;
|
|
}
|
|
.name{
|
|
font-size: 12px;
|
|
white-space: nowrap;
|
|
color: $grey-700;
|
|
display: inline-block;
|
|
&:after{
|
|
content: ", ";
|
|
}
|
|
&:last-child{
|
|
&:after{
|
|
content: " ";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/******************* Accordion B4 *****************/
|
|
|
|
.accordion-b4 {
|
|
.card {
|
|
border: 0 none;
|
|
box-shadow: none;
|
|
}
|
|
.card-header {
|
|
padding: 0;
|
|
background: #fff;
|
|
border: none;
|
|
}
|
|
.card-title a {
|
|
display: block;
|
|
position: relative;
|
|
color: $grey-900;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
margin-bottom: 15px;
|
|
padding: 10px 5px;
|
|
border: none;
|
|
border-bottom: 1px solid #cdcdcd;
|
|
transition: all 0.10s linear 0s;
|
|
cursor: pointer;
|
|
&.collapsed {
|
|
color: #808080;
|
|
margin: 0;
|
|
}
|
|
i {
|
|
color: $menu-background;
|
|
position: absolute;
|
|
top: 15px;
|
|
left: 20px;
|
|
font-size: 20px;
|
|
}
|
|
&:before {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -15px;
|
|
left: 36px;
|
|
}
|
|
&.collapsed {
|
|
&:before {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -15px;
|
|
left: 36px;
|
|
border: 0 none;
|
|
}
|
|
&:hover {
|
|
color: #6a6060;
|
|
}
|
|
}
|
|
&:after {
|
|
content: "\f106";
|
|
font-family: "Font Awesome 5 Free", serif;
|
|
font-weight: 900;
|
|
color: $menu-secondary;
|
|
font-size: 20px;
|
|
line-height: 20px;
|
|
position: absolute;
|
|
top: 18px;
|
|
right: 10px;
|
|
}
|
|
&.collapsed:after {
|
|
font-family: "Font Awesome 5 Free", serif;
|
|
font-weight: 900;
|
|
font-size: 20px;
|
|
line-height: 20px;
|
|
position: absolute;
|
|
top: 18px;
|
|
right: 10px;
|
|
content: "\f107";
|
|
color: #808080;
|
|
}
|
|
}
|
|
.card-body {
|
|
border-top: 0 none;
|
|
color: #808080;
|
|
}
|
|
}
|
|
|
|
/************* SOCIAL *************/
|
|
.profile {
|
|
.profile-bg {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
height: 100px;
|
|
width: 100%;
|
|
text-align: left;
|
|
overflow: hidden;
|
|
&.profile-bg-blur {
|
|
img {
|
|
filter: blur(10px) brightness(.85);
|
|
}
|
|
}
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
}
|
|
.btn-toolbar{
|
|
margin-left: 17px;
|
|
a{
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
}
|
|
.user-panel{
|
|
position: relative;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
align-items: center;
|
|
font-weight: 500;
|
|
z-index: 3;
|
|
&.user-panel-column{
|
|
flex-direction: column;
|
|
text-align: center;
|
|
.user-panel-image{
|
|
margin-right: 0;
|
|
margin-bottom: 8px;
|
|
}
|
|
.user-panel-info{
|
|
line-height: 23px;
|
|
p{
|
|
margin: 0;
|
|
}
|
|
small{
|
|
font-size: 14px;
|
|
display: block;
|
|
font-weight: 400;
|
|
line-height: 14px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.groups-messages{
|
|
.date{
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
/***** CALENDAR ******/
|
|
.fc-day-grid-event{
|
|
border: none;
|
|
padding: 6px 12px 6px 22px;
|
|
font-weight: 500;
|
|
color: #ffffff !important;
|
|
cursor: pointer;
|
|
border-radius: 4px;
|
|
}
|
|
/********* ACTIONS **********/
|
|
.actions {
|
|
background: #ffffff;
|
|
border: 1px solid #dddddd;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
|
|
margin-bottom: 10px;
|
|
img {
|
|
padding: 3px;
|
|
border: 1px solid #dcdcdc;
|
|
border-radius: 5px;
|
|
background: #ffffff;
|
|
&:hover {
|
|
background: #ededed;
|
|
}
|
|
}
|
|
a {
|
|
text-decoration: none;
|
|
margin-right: 10px;
|
|
&:hover {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
.form-group{
|
|
margin-bottom: 0;
|
|
}
|
|
.btn-toolbar {
|
|
border: 1px solid #dcdcdc;
|
|
border-radius: 5px;
|
|
display: inline-block;
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
margin: 0 0 0 5px;
|
|
background: #ffffff;
|
|
img {
|
|
background: none;
|
|
border: none;
|
|
}
|
|
&:hover {
|
|
background: #ededed;
|
|
}
|
|
}
|
|
.actions-pagination {
|
|
float: right;
|
|
margin-top: 2px;
|
|
* {
|
|
display: inline-block;
|
|
float: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
img {
|
|
margin: 6px;
|
|
padding: 0;
|
|
}
|
|
}
|
|
}
|
|
/****** EXERCISE *********/
|
|
.card-exercise{
|
|
margin-bottom: 20px;
|
|
.list-exercise{
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
li{
|
|
display: inline-block;
|
|
}
|
|
}
|
|
}
|
|
|
|
.main-question{
|
|
margin-bottom: 20px;
|
|
margin-top: 20px;
|
|
.title{
|
|
margin-bottom: 10px;
|
|
margin-top: 10px;
|
|
padding-bottom: 5px;
|
|
border-bottom: 1px solid #cdcdcd;
|
|
}
|
|
.description{
|
|
margin-bottom: 10px;
|
|
}
|
|
.options{
|
|
padding: 0.8em;
|
|
label{
|
|
display: block;
|
|
margin-bottom: 18px;
|
|
font-weight: bold;
|
|
&.radio, &.checkbox{
|
|
min-height: 18px;
|
|
margin-left: 25px;
|
|
}
|
|
input[type="radio"]{
|
|
margin-left: -25px;
|
|
&.checkradios{
|
|
border-radius: 50px;
|
|
}
|
|
}
|
|
input[type="checkbox"]{
|
|
margin-left: -25px;
|
|
&.checkradios{
|
|
border-radius: 5px;
|
|
}
|
|
}
|
|
|
|
.checkradios
|
|
{
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
display: inline-block;
|
|
position: relative;
|
|
background-color: #ffffff;
|
|
color: #666;
|
|
top: 10px;
|
|
height: 30px;
|
|
width: 30px;
|
|
border: 1px solid #cdcdcd;
|
|
|
|
cursor: pointer;
|
|
margin-right: 7px;
|
|
outline: none;
|
|
&:checked::before
|
|
{
|
|
position: absolute;
|
|
font: 13px/1 'Open Sans', sans-serif;
|
|
left: 11px;
|
|
top: 7px;
|
|
content: '\02143';
|
|
transform: rotate(40deg);
|
|
}
|
|
&:hover
|
|
{
|
|
background-color: #f7f7f7;
|
|
}
|
|
&:checked
|
|
{
|
|
background-color: #f1f1f1;
|
|
}
|
|
}
|
|
|
|
}
|
|
p{
|
|
line-height: 1em;
|
|
display: contents;
|
|
}
|
|
}
|
|
//Matching Draggable answer
|
|
.drag_question{
|
|
min-height: 4em;
|
|
width: 100%;
|
|
padding: 20px;
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
._jsPlumb_endpoint {
|
|
z-index: 50;
|
|
}
|
|
.data_table{
|
|
border: none;
|
|
td{
|
|
border: none;
|
|
}
|
|
}
|
|
.window {
|
|
border: 1px solid #dddddd;
|
|
border-radius: 10px;
|
|
-moz-border-radius: 10px;
|
|
-webkit-border-radius: 10px;
|
|
cursor: pointer;
|
|
min-height: 65px;
|
|
padding: 25px;
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
|
|
&.window_left_question {
|
|
padding: 10px 25px 10px 10px;
|
|
text-align: right;
|
|
background: #f2f9fe; /* Old browsers */
|
|
background: -moz-linear-gradient(top, #f2f9fe 0%, #d6f0fd 100%); /* FF3.6+ */
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f9fe), color-stop(100%, #d6f0fd)); /* Chrome,Safari4+ */
|
|
background: -webkit-linear-gradient(top, #f2f9fe 0%, #d6f0fd 100%); /* Chrome10+,Safari5.1+ */
|
|
background: -o-linear-gradient(top, #f2f9fe 0%, #d6f0fd 100%); /* Opera 11.10+ */
|
|
background: -ms-linear-gradient(top, #f2f9fe 0%, #d6f0fd 100%); /* IE10+ */
|
|
background: linear-gradient(to bottom, #f2f9fe 0%, #d6f0fd 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f9fe', endColorstr='#d6f0fd', GradientType=0); /* IE6-9 */
|
|
|
|
}
|
|
&.window_right_question {
|
|
padding: 10px 10px 10px 25px;
|
|
background: #ffffff; /* Old browsers */
|
|
background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #e5e5e5)); /* Chrome,Safari4+ */
|
|
background: -webkit-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* Chrome10+,Safari5.1+ */
|
|
background: -o-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* Opera 11.10+ */
|
|
background: -ms-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* IE10+ */
|
|
background: linear-gradient(to bottom, #ffffff 0%, #e5e5e5 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=0); /* IE6-9 */
|
|
}
|
|
}
|
|
.indent{
|
|
padding-top: 10px;
|
|
padding-bottom: 10px;
|
|
font-size: 14px;
|
|
}
|
|
.round{
|
|
border-radius: 0.8em;
|
|
color: #666666;
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
line-height: 1.6em;
|
|
margin-right: 5px;
|
|
text-align: center;
|
|
width: 1.6em;
|
|
}
|
|
.number{
|
|
background: #ffffff;
|
|
border: 1px solid #cdcdcd;
|
|
}
|
|
.letter{
|
|
background: #ffffff;
|
|
border: 1px solid #cdcdcd;
|
|
}
|
|
.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn){
|
|
width: 100px;
|
|
}
|
|
.hidden{
|
|
display: none;
|
|
}
|
|
|
|
}
|
|
.fill-blank{
|
|
.form-control{
|
|
display: inline-block;
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
} |