2022-06-03 12:36:52 +02:00

714 lines
16 KiB
SCSS

/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
Created on : 13-Aug-2018, 12:32:48
Author : podkrizniku
*/
#branching{
li.if,
li.block,
li.loop{
display: flex;
.if_remove{
display: none;
z-index: 5;
position: absolute;
top: 0;
right: 0;
a{
margin-left: 16px;
}
.faicon:before{
line-height: 28px;
font-size: 16px;
}
}
.pm.faicon{
padding: 3px 8px 0 0;
margin-left: -20px;
}
.if_content {
width: 100%;
strong{
font-weight: 600;
}
span.conditions_display {
cursor: pointer;
display: block;
line-height: 28px;
}
.clr_if,
.clr_bl,
.clr_lp{
color: $blue;
font-weight: 600;
}
.colorif,
.colorblock,
.colorif{
color: $blue;
font-weight: 400;
}
}
.if_warning{
margin-left: 16px;
color: $red;
font-size: 14px;
span.faicon{
margin-right: 4px;
&:before{
color: $red;
font-size: 14px;
}
}
}
&:hover {
div.if_remove {
display: block;
}
}
}
li.if.if_editing,
li.block.if_editing,
li.loop.if_editing{
div.if_remove {
display: block;
padding: 10px 12px;
}
.if_content {
padding: 12px;
background-color: $medium-blue;
border: 1px #CCE4F9 solid;
border-left: 1px $blue solid;
border-radius: 1px 2px 2px 1px;
}
}
li.endif,
li.endblock,
li.endloop,
li.inout{
&:hover {
cursor: pointer;
}
.clr_if,
.clr_bl,
.clr_lp{
color: $blue;
font-weight: 600;
}
.colorif,
.colorblock,
.colorif{
color: $blue;
font-weight: 400;
}
}
li.endif_editing {
padding: 12px;
background-color: $medium-blue;
border: 1px #CCE4F9 solid;
border-left: 1px $blue solid;
border-radius: 1px 2px 2px 1px;
}
ul.if_editing{
div.spr,
li.spr,
li.if,
li.endif,
li.block,
li.endblock,
li.loop,
li.endloop{
border-left: 1px $blue solid;
}
}
// Float z nastavitvami na desni
#div_condition_editing_float {
display: flex;
flex-direction: column;
box-sizing: border-box;
position: absolute;
top: 0;
right: -389px;
width: 325px;
background-color: $white;
border: 1px solid #CCE4F9;
border-radius: 2px;
// Naslovna vrstica
.condition_header{
height: 45px;
padding: 0 7px;
margin-bottom: 16px;
color: $black;
font-weight: 600;
font-size: 14px;
line-height: 45px;
text-transform: uppercase;
background-color: $medium-blue;
border-bottom: 1px solid #CCE4F9;
.faicon{
margin-right: 8px;
&:before{
color: $blue;
}
}
}
// Glavna vsebina
.condition_edit {
margin: 0 16px;
background-color: white;
// Fieldset znotraj urejanja
fieldset {
display: flex;
flex-direction: column;
margin-bottom: 16px;
padding: 0;
border: 0;
border-top: 1px solid $dark-gray2;
legend {
margin: 0;
padding: 0 10px 0 0;
color: $black;
font-weight: 700;
font-size: 14px;
text-transform: none;
background-color: transparent;
}
}
// Posamezen blok nastavitve
.condition_setting_holder{
display: flex;
flex-direction: column;
margin-top: 8px;
&.space_bottom{
margin-top: 0;
margin-bottom: 16px;
.condition_setting_line{
margin-top: 0px;
}
}
.condition_setting_line{
display: flex;
align-items: center;
justify-content: left;
min-height: 20px;
margin-top: 8px;
line-height: 20px;
color: $black;
font-size: 14px;
&.half-half{
justify-content: space-between;
label{
width: 50%;
margin: 0;
}
.content{
width: 50%;
input[type="text"],
input[type="number"],
select,
textarea{
width: 100%;
}
}
}
&.with-icon{
span{
display: flex;
align-items: center;
cursor: pointer;
color: $blue;
&:hover{
color: $dark-blue;
.faicon::before{
color: $dark-blue;
}
}
}
.faicon{
margin-right: 8px;
&:before{
color: $blue;
font-size: 18px;
}
}
}
}
}
p,
span,
label{
line-height: 20px;
color: $black;
font-size: 14px;
}
.jquery-selectbox {
background-color: white;
background: #FFFFFF;
border: 1px solid $dark-gray2;
box-sizing: border-box;
border-radius: 4px;
}
select{
cursor: pointer;
box-sizing: border-box;
height: 30px;
padding: 0 8px;
background-color: $white;
border: 1px solid $dark-gray2;
border-radius: 4px;
}
input[type="text"],
input[type="number"]{
box-sizing: border-box;
padding: 8px;
height: 30px;
background-color: $white;
border: 1px solid $dark-gray2;
border-radius: 4px;
}
textarea{
box-sizing: border-box;
padding: 8px;
min-height: 30px;
font-size: 14px;
background-color: $white;
border: 1px solid $dark-gray2;
border-radius: 4px;
}
}
// Gumbi na dnu
.button_holder {
flex-direction: column;
margin: 0 16px 10px 16px;
padding-top: 8px;
border-top: 1px $dark-gray2 solid;
button{
margin-bottom: 8px;
&:last-of-type{
margin-bottom: 0;
}
}
}
.remove_condition_holder{
margin: 0 16px;
padding: 16px 0;
border-top: 1px $dark-gray2 solid;
div{
cursor: pointer;
margin-bottom: 16px;
color: $blue;
font-size: 14px;
transition: 0.2s;
.faicon{
margin-right: 8px;
&:before{
font-size: 14px;
}
}
&:last-child{
margin-bottom: 0;
}
&:hover{
color: $dark-blue;
.faicon:before{
color: $dark-blue;
}
}
}
}
}
// Naslov popupa, črta pod naslovom
span.IF_title_start {
font-weight: $heavy;
color: $blue;
margin-right: 8px;
}
span.IF_title {
font-weight: $semi-bold;
text-transform: uppercase;
}
span.IF_title_line {
content: "";
display: inline-block;
height: 0.5em;
vertical-align: bottom;
width: 100%;
margin-top: 8px;
border-top: 1px solid $dark-gray;
}
select.spremenljivka_select {
option {
max-width: 500px;
}
}
.condition {
position: relative;
left: -21px;
}
span.endif {
position: relative;
left: -29px;
font-weight: bold;
}
.error_display {
display: block;
line-height: 24px;
}
.tbl_ce_bck_blue {
background-color: $blue;
}
.tbl_ce_lol {
border-top: 1px solid $gray;
border-bottom: 1px solid $gray;
border-left: 1px solid $gray;
}
.tbl_ce_tb {
border-top: 1px solid $gray;
border-bottom: 1px solid $gray;
}
.tbl_ce_lor {
border-top: 1px solid $gray;
border-bottom: 1px solid $gray;
border-right: 1px solid $gray;
}
.endif {
a.surveycomment {
padding-right: 15px;
font-size: 10px;
}
}
.endblock {
a.surveycomment {
padding-right: 15px;
font-size: 10px;
}
}
#condition_editing_bottom_placeholder {
display: block;
height: 1px;
margin-bottom: 15px;
border-top: 1px solid $blue;
}
}
#div_condition_editing {
display: none;
height: auto;
width: 800px;
div#div_condition_editing_container {
margin-bottom: 44px;
}
.error_display {
background-color: transparent;
}
.condition_editing_vrednost_title {
margin: 8px 0;
font-size: 14px;
font-weight: 600;
}
}
//IF - vsebina pogoja, kalkulacije, kvote
#div_condition_editing_inner,
#quota_editing_inner,
#calculation_editing_inner{
.condition_editing_preview {
}
.condition_editing_body,
.quota_editing_body,
.calculation_editing_body{
max-height: 70vh;
overflow-y: auto;
margin: 32px 0 0 0;
.condition_editing_row{
display: flex;
align-items: center;
box-sizing: border-box;
width: 100%;
margin-bottom: 8px;
&.conjunction{
padding-left: 22px;
}
.move_holder{
cursor: pointer;
margin-right: 12px;
.faicon:before{
font-size: 20px;
color: $blue;
}
}
.white_holder{
display: flex;
flex-grow: 1;
align-items: center;
justify-content: space-between;
padding: 32px 0;
font-size: 14px;
background-color: $white;
span,
label{
font-size: 14px;
}
.column{
display: flex;
align-items: baseline;
padding: 0 16px;
&.bracket{
flex-direction: column;
.bracket_icons{
display: flex;
align-items: baseline;
justify-content: space-evenly;
width: 100%;
.faicon{
&:before{
font-size: 14px;
}
&.icon-grey_normal:before{
line-height: 22px;
color: $very-dark-gray2;
}
}
}
.bracket_text{
font-size: 12px;
line-height: 15px;
}
}
&.variable{
flex-direction: column;
}
&.operator{
flex-grow: 1;
.fill_vrednost,
.ostanek{
display: flex;
align-items: center;
input,
select,
a{
margin-right: 32px;
&.operator{
width: 50px;
}
&[type="text"]{
width: 100px;
}
&:last-child{
margin-right: 0;
}
.faicon.edit{
margin-left: 8px;
}
}
.edit_fill_value,
.preview_fill_value{
display: flex;
flex-direction: column;
label,
span{
display: flex;
margin-bottom: 8px;
&:last-child{
margin-bottom: 0;
}
}
input[type="checkbox"].enka-admin-custom + span.enka-checkbox-radio::before {
color: $very-dark-gray;
}
input[type="checkbox"].enka-admin-custom:checked + span.enka-checkbox-radio::before {
color: $blue;
}
}
}
}
}
}
.delete_holder{
margin-left: 12px;
.faicon:before{
font-size: 16px;
color: $blue;
}
}
select{
margin: 0;
width: auto;
}
input[type="text"]{
margin: 0;
width: auto;
}
}
}
.div_condition_bottom,
.div_quota_bottom,
.div_calculation_bottom {
margin: 8px 0 0 22px;
font-size: 14px;
font-weight: 400;
&.loop_bottom{
margin: 12px 0 0 0;
}
}
}