Alessandro Francia
1229 lines
32 KiB
Plaintext
1229 lines
32 KiB
Plaintext
// out: false, sourceMap: false, main: ../style.less
|
|
@import "colors.less";
|
|
|
|
.card{
|
|
width: 288px;
|
|
height: 216px;
|
|
background-color: @color-background-white;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
margin:8px;
|
|
cursor: pointer;
|
|
>header{
|
|
width: 288px;
|
|
height: 64px;
|
|
border-radius: 2px;
|
|
background-color: @color-white2;
|
|
span{
|
|
font-size: 18px;
|
|
float: left;
|
|
color: @color-darkish-blue;
|
|
margin-top: 22px;
|
|
margin-left: 24px;
|
|
}
|
|
button{
|
|
float: right;
|
|
margin: 8px 8px 8px;
|
|
width: 48px;
|
|
height: 48px;
|
|
// border: none;
|
|
// border-radius: 2px;
|
|
// background-image: linear-gradient(to bottom,@color-white2,@color-silver);
|
|
// box-shadow: 0 0 3px 0 @color-black-50;
|
|
color: @color-darkish-blue;
|
|
padding: 0;
|
|
.fa{
|
|
height: 22px;
|
|
font-size: 24px;
|
|
width: 25px;
|
|
}
|
|
}
|
|
}
|
|
>section{
|
|
height: calc(~'100% - 64px');
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.detail-card{
|
|
width: 288px;
|
|
height: 216px;
|
|
background-color: @color-background-white;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
margin-right: 32px;
|
|
header{
|
|
width: 288px;
|
|
height: 64px;
|
|
border-radius: 2px;
|
|
background-color: @color-white2;
|
|
border-bottom: 2px solid @color-background-white;
|
|
.title{
|
|
width: 64px;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
float: left;
|
|
color: @color-greyish-brown;
|
|
border-right: 2px solid @color-background-white;
|
|
}
|
|
button{
|
|
float: right;
|
|
margin: 8px 8px 8px;
|
|
width: 48px;
|
|
height: 48px;
|
|
color: @color-darkish-blue;
|
|
padding: 0;
|
|
.fa{
|
|
height: 22px;
|
|
font-size: 24px;
|
|
width: 25px;
|
|
}
|
|
}
|
|
}
|
|
section{
|
|
height: calc(~'100% - 66px');
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: @color-white2;
|
|
}
|
|
}
|
|
|
|
|
|
.equipment{
|
|
width: 360px;
|
|
height: 64px;
|
|
background-color: @color-background-white;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
display: flex;
|
|
flex-flow: row;
|
|
align-self: center;
|
|
margin: auto;
|
|
justify-items: center;
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color:@color-greyish-brown;
|
|
margin-bottom: 4px;
|
|
cursor: pointer;
|
|
|
|
&.selected{
|
|
background-color: rgba(23, 145, 255, 0.75);
|
|
color: #fff;
|
|
.image{
|
|
background-color: #FFF;
|
|
}
|
|
|
|
.text-body-position{
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.image{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-top: 8px;
|
|
margin-left: 14px;
|
|
width: 48px;
|
|
height: 48px;
|
|
background-color: #DDD;
|
|
img{
|
|
width: 48px;
|
|
height: 48px;
|
|
}
|
|
|
|
}
|
|
.text-body{
|
|
text-align: left;
|
|
width:100%;
|
|
margin-top: 11px;
|
|
margin-left: 14px;
|
|
|
|
}
|
|
.text-body-position{
|
|
margin-top: 24px;
|
|
width: 120px;
|
|
height: 20px;
|
|
font-size: 16px;
|
|
text-align: left;
|
|
color: @color-clear-blue;
|
|
}
|
|
}
|
|
|
|
.input-box{
|
|
width: 100%;
|
|
height: 80px;
|
|
border-radius: 2px;
|
|
display: flex;
|
|
flex-flow: row;
|
|
background-color: @color-background-white;
|
|
box-shadow: 0 1px 1px 0 @color-black-50;
|
|
.title{
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color: @color-greyish-brown;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 15px;
|
|
}
|
|
.control{
|
|
height: 100%;
|
|
display: flex;
|
|
margin-right: 16px;
|
|
align-items: center;
|
|
margin-left: auto;
|
|
input,select{
|
|
width: 294px;
|
|
height: 48px;
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color: @color-greyish-brown;
|
|
padding: 0 5px;
|
|
box-sizing: border-box;
|
|
border: solid 1px #ccc;
|
|
|
|
&[type=number]{
|
|
text-align: right;
|
|
}
|
|
}
|
|
input:read-only{
|
|
border: solid 1px transparent;
|
|
}
|
|
select:disabled{
|
|
border: solid 1px transparent;
|
|
-webkit-appearance: menulist-text;
|
|
-moz-appearance: menulist-text;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.load-equipment{
|
|
width: 495px;
|
|
height: 64px;
|
|
border-radius: 2px;
|
|
background-color: @color-background-white;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
display: flex;
|
|
flex-flow: row;
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color:@color-greyish-brown;
|
|
.image{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-left: 16px;
|
|
margin-right: 15px;
|
|
}
|
|
.text-body{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.arrow{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-left: auto;
|
|
margin-right: 20px;
|
|
.fa-arrow-up, .fa-arrow-down{
|
|
font-size: 24px;
|
|
}
|
|
.fa-arrow-up{
|
|
color: #54AEFF;
|
|
}
|
|
.fa-arrow-down{
|
|
color: #DC4557;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.card-utilities{
|
|
width: 288px;
|
|
height: 216px;
|
|
border-radius: 2px;
|
|
background-color: @color-white2;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
cursor: pointer;
|
|
.card-utilities-header{
|
|
height: 64px;
|
|
width: 100%;
|
|
border-bottom: solid 2px @color-white;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 18px;
|
|
color: @color-darkish-blue;
|
|
}
|
|
.card-utilities-body{
|
|
height: calc(~'100% - 66px');
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
button{
|
|
width: 272px;
|
|
height: 136px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: @color-white2;
|
|
}
|
|
.card-utilities-body-label{
|
|
width: 104px;
|
|
height: 104px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: @color-background-white;
|
|
font-size: 48px;
|
|
font-weight: 600;
|
|
color: @color-darkish-blue;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.card-assisted-tooling{
|
|
width: 256px;
|
|
height: 249px;
|
|
background-color: @color-background-white;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
.card-assisted-tooling-body{
|
|
height: 233px;
|
|
display: flex;
|
|
flex-flow: column;
|
|
align-items: center;
|
|
div.icon .fa-arrow-up{
|
|
margin-top: 28px;
|
|
font-size: 25px;
|
|
color: @color-clear-blue;
|
|
}
|
|
div.icon .fa-arrow-down{
|
|
margin-top: 28px;
|
|
font-size: 25px;
|
|
color: red;
|
|
}
|
|
.image{
|
|
margin-top: 11px;
|
|
img{
|
|
width: 108px;
|
|
&.anim_up{
|
|
animation: scroll_up 3s infinite;
|
|
}
|
|
&.anim_dw{
|
|
animation: scroll_dw 3s infinite;
|
|
}
|
|
@keyframes scroll_dw{
|
|
0%{
|
|
transform: translateY(-108px);
|
|
}
|
|
30%{
|
|
transform: translateY(0px);
|
|
}
|
|
70%{
|
|
transform: translateY(0px);
|
|
}
|
|
100%{
|
|
transform: translateY(108px);
|
|
}
|
|
|
|
}
|
|
|
|
@keyframes scroll_up{
|
|
0%{
|
|
transform: translateY(108px);
|
|
}
|
|
30%{
|
|
transform: translateY(0px);
|
|
}
|
|
70%{
|
|
transform: translateY(0px);
|
|
}
|
|
100%{
|
|
transform: translateY(-108px);
|
|
}
|
|
|
|
}
|
|
}
|
|
overflow: hidden;
|
|
}
|
|
.text{
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color: @color-greyish-brown;
|
|
text-align: center;
|
|
}
|
|
}
|
|
.card-assisted-tooling-footer{
|
|
height: 16px;
|
|
background-color: @color-darkish-blue;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.card-tool-depot{
|
|
width: 272px;
|
|
height: 136px;
|
|
display: flex;
|
|
flex-flow: column;
|
|
background-color: @color-white2;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
|
|
.card-tool-depot-body{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-flow: row;
|
|
.card-tool-depot-image{
|
|
position: relative;
|
|
margin-top: 20px;
|
|
margin-left: 10px;
|
|
img{
|
|
max-width: 104px;
|
|
max-height: 104px;
|
|
cursor: pointer;
|
|
}
|
|
i{
|
|
position: absolute;
|
|
right: 0;
|
|
bottom: 10px;
|
|
font-size: 28px;
|
|
cursor: pointer;
|
|
}
|
|
i.fa{
|
|
color: @color-darkish-blue;
|
|
}
|
|
}
|
|
.card-tool-depot-title{
|
|
display: flex;
|
|
height: 100%;
|
|
min-width: calc(~'100% - 164px');
|
|
flex-flow: column;
|
|
justify-content: center;
|
|
margin-left: 20px;
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color: @color-greyish-brown;
|
|
}
|
|
.card-tool-depot-remove{
|
|
width: 100%;
|
|
margin-top: 8px;
|
|
margin-right: 8px;
|
|
margin-left: auto;
|
|
display: flex;
|
|
font-size: 24px;
|
|
color: @color-darkish-blue;
|
|
.btn{
|
|
height: 48px;
|
|
width: 48px;
|
|
font-size: 24px;
|
|
margin: 0 -26px;
|
|
padding: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.card-maintenance-wizard{
|
|
width: 408px;
|
|
height: 64px;
|
|
border-radius: 2px;
|
|
background-color: @color-background-white;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
.card-maintenance-wizard-body{
|
|
height: 100%;
|
|
display: flex;
|
|
flex-flow: row;
|
|
align-items: center;
|
|
.card-maintenance-wizard-image{
|
|
margin-left: 20px;
|
|
img{
|
|
width: 28px !important;
|
|
height: 28px !important;
|
|
}
|
|
}
|
|
.card-maintenance-wizard-title{
|
|
height: 100%;
|
|
display: flex;
|
|
flex-flow: column;
|
|
justify-content: center;
|
|
div.wizard{
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
line-height: 1;
|
|
color: @color-cyan-blue;
|
|
margin-left: 20px;
|
|
}
|
|
div{
|
|
font-size: 14px;
|
|
line-height: 1.29;
|
|
color: @color-cyan-blue;
|
|
margin-left: 20px;
|
|
}
|
|
}
|
|
.card-maintenance-wizard-start{
|
|
margin-left: auto;
|
|
margin-right: 0;
|
|
button div{
|
|
font-size: 18px;
|
|
color: @color-cyan-blue;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.softkeys-prefered{
|
|
width: 480px;
|
|
min-height: 64px;
|
|
display: flex;
|
|
flex-flow: row;
|
|
align-items: center;
|
|
background-color: @color-white3;
|
|
position: relative;
|
|
cursor: pointer;
|
|
.star{
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 16px;
|
|
}
|
|
.title{
|
|
font-size: 14px;
|
|
line-height: 1.43;
|
|
color: @color-darkish-blue;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 14px;
|
|
}
|
|
.control{
|
|
height: 100%;
|
|
display: flex;
|
|
margin-right: 16px;
|
|
align-items: center;
|
|
margin-left: auto;
|
|
input,select{
|
|
width: 294px;
|
|
height: 48px;
|
|
font-size: 18px;
|
|
line-height: 1.11;
|
|
color: @color-greyish-brown;
|
|
padding: 0 5px;
|
|
box-sizing: border-box;
|
|
border: solid 1px #ccc;
|
|
|
|
&[type=number]{
|
|
text-align: right;
|
|
}
|
|
}
|
|
|
|
input:read-only{
|
|
border: solid 1px transparent;
|
|
}
|
|
select:disabled{
|
|
border: solid 1px transparent;
|
|
-webkit-appearance: menulist-text;
|
|
-moz-appearance: menulist-text;
|
|
}
|
|
.togglebutton{
|
|
label{
|
|
span.toggle{
|
|
width: 92px;
|
|
height: 31px;
|
|
line-height: 31px;
|
|
font-size: 13px;
|
|
}
|
|
}
|
|
}
|
|
.togglebutton label .toggle:after {
|
|
width: 29px;
|
|
height: 29px;
|
|
border-radius: 27px;
|
|
top: 1px;
|
|
}
|
|
.togglebutton label input[type=checkbox]:checked+.toggle:after {
|
|
left: 48px;
|
|
}
|
|
.togglebutton label input[type=checkbox]:checked + .toggle:after{
|
|
width: 29px;
|
|
height: 29px;
|
|
border-radius: 27px;
|
|
left: 62px;
|
|
}
|
|
.multiple{
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
border-left: 1px solid @color-label-grey;
|
|
width: 144px;
|
|
margin-top: -1px;
|
|
height: 46px;
|
|
overflow-x: visible;
|
|
cursor: pointer;
|
|
&:active {
|
|
background-color: @color-clear-blue;
|
|
color: @color-white;
|
|
}
|
|
&:active span {
|
|
background-color: @color-clear-blue;
|
|
color: @color-white;
|
|
}
|
|
span {
|
|
display: flex;
|
|
background: transparent;
|
|
color: @color-label-grey;
|
|
flex-grow: 1;
|
|
min-width: 48px;
|
|
min-height: 22px;
|
|
margin-top: -1px;
|
|
margin-left: -1px;
|
|
box-sizing: border-box;
|
|
border: 0.5px solid @color-label-grey;
|
|
align-items: center;
|
|
position: relative;
|
|
justify-content: center;
|
|
&.active {
|
|
background-color: #1791ff;
|
|
color: @color-white;
|
|
|
|
}
|
|
&.active:active {
|
|
background-color: #4e585e;
|
|
}
|
|
&.disabled::after {
|
|
content: " ";
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 100%;
|
|
width: 100%;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
}
|
|
}
|
|
}
|
|
.button{
|
|
.fa{
|
|
font-size: 32px;
|
|
color: @color-label-grey;
|
|
}
|
|
}
|
|
// .pushbutton{
|
|
// width: 144px;
|
|
// height: 48px;
|
|
|
|
// .key{
|
|
// display: flex;
|
|
// align-items: center;
|
|
// justify-content: center;
|
|
// visibility: visible;
|
|
// width: 42px;
|
|
// height: 22px;
|
|
// padding: 0;
|
|
// border: solid 1px @color-label-grey;
|
|
// cursor: pointer;
|
|
// }
|
|
// }
|
|
}
|
|
}
|
|
|
|
.card-axes-production{
|
|
height: 558px;
|
|
width: 232px;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
background-color: @color-background-white;
|
|
display: flex;
|
|
flex-flow: column;
|
|
.first-box-axes, .second-box-axes{
|
|
height: 264px;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: column;
|
|
overflow: auto;
|
|
.axes{
|
|
min-height: 32px;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-top: 8px;
|
|
.variable{
|
|
display: flex;
|
|
font-size: 48px;
|
|
line-height: 0.38;
|
|
font-weight: bold;
|
|
color: @color-greyish-brown;
|
|
}
|
|
.number{
|
|
width: 136px;
|
|
height: 32px;
|
|
border-radius: 2px;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
margin-right: 24px;
|
|
color: @color-greyish-brown;
|
|
padding-right: 8px;
|
|
}
|
|
}
|
|
.axes:nth-child(odd) .number{
|
|
background-color: @color-white4;
|
|
}
|
|
.axes:nth-child(even) .number{
|
|
background-color: @color-clear-blue-30;
|
|
}
|
|
.axes:first-child{
|
|
margin-top: 16px;
|
|
}
|
|
.axes:last-child{
|
|
margin-bottom: 16px;
|
|
}
|
|
}
|
|
.second-box-axes{
|
|
width: 100%;
|
|
height: 294px;
|
|
.tabs{
|
|
height: 30px;
|
|
width:100%;
|
|
background-color: @color-whitethree;
|
|
display: flex;
|
|
flex-direction: row;
|
|
button{
|
|
visibility: hidden;
|
|
border: none;
|
|
}
|
|
.tab{
|
|
visibility: visible;
|
|
width: 77px;
|
|
border-right: solid 1px @color-label-grey;
|
|
&.active{
|
|
background-color: @color-white;
|
|
border-top: solid 2px @color-clear-blue !important;
|
|
}
|
|
}
|
|
.tab:last-child{
|
|
border: none;
|
|
}
|
|
.content-box{
|
|
height: calc(~'100% - 30px');
|
|
background-color: red;
|
|
width: 100%;
|
|
display: flex;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.card-folder-path{
|
|
width: auto;
|
|
height: 64px;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-flow: row;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
background-color: @color-background-white;
|
|
margin: 4px 0 4px 5px;
|
|
.card-folder-path-icon{
|
|
margin-left: 16px;
|
|
}
|
|
.card-folder-path-name{
|
|
width: 100%;
|
|
margin-left: 21px;
|
|
}
|
|
.card-folder-path-arrow{
|
|
width: 100%;
|
|
display: flex;
|
|
margin-right: 21px;
|
|
justify-content: flex-end;
|
|
}
|
|
}
|
|
|
|
.card-element-queue{
|
|
width: 352px;
|
|
height: 64px;
|
|
display: flex;
|
|
flex-flow: row;
|
|
border-radius: 2px;
|
|
background-color: @color-background-white;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
.card-element-queue-name{
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
margin-left: 14px;
|
|
color: @color-darkish-blue;
|
|
}
|
|
.card-element-queue-right{
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
.square-number{
|
|
width: 48px;
|
|
height: 48px;
|
|
background-color: @color-duck-egg-blue;
|
|
text-align: center;
|
|
line-height: 48px;
|
|
margin-right: 8px;
|
|
label{
|
|
font-size: 18px;
|
|
color: @color-darkish-blue;
|
|
}
|
|
}
|
|
button.btn {
|
|
padding: 0 17px;
|
|
i.fa.fa-trash{
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.card-production-cms{
|
|
width: 1024px;
|
|
height: 768px;
|
|
display: flex;
|
|
background-color: @color-label-grey;
|
|
flex-flow: row;
|
|
.card-production-cms-queue{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
.card-production-cms-job{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
}
|
|
|
|
.card-queue-production{
|
|
width: 520px;
|
|
height: 768px;
|
|
background-color: @color-background-white;
|
|
display: flex;
|
|
flex-flow: column;
|
|
.card-queue-production-header{
|
|
height: 63px;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: row;
|
|
border-bottom: solid 2px @color-label-grey;
|
|
.title{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 24px;
|
|
font-size: 20px;
|
|
color: @color-darkish-blue;
|
|
justify-content: flex-start;
|
|
}
|
|
.group-button{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
i{
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
}
|
|
.card-queue-production-body{
|
|
height: 623px;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: column;
|
|
.queue-body{
|
|
height: calc(~'100% - 63px');
|
|
width: calc(~'100% - 16px');
|
|
display: flex;
|
|
flex-flow: column;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
margin: 16px 0 0 8px;
|
|
.element-queue{
|
|
display: flex;
|
|
flex-flow: row;
|
|
align-items: center;
|
|
margin-bottom: 16px;
|
|
width: 400px;
|
|
label.number{
|
|
display: flex;
|
|
height: 100%;
|
|
margin-right: 16px;
|
|
font-size: 20px;
|
|
color: @color-greyish-brown;
|
|
}
|
|
}
|
|
|
|
}
|
|
.queue-footer{
|
|
display: flex;
|
|
margin: 20px 0 0 8px;
|
|
border-top: solid 2px @color-whitethree;
|
|
height: 47px;
|
|
width: 97%;
|
|
label{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 24px;
|
|
font-size: 20px;
|
|
color: @color-darkish-blue;
|
|
justify-content: flex-start;
|
|
}
|
|
}
|
|
}
|
|
.card-queue-production-footer{
|
|
height: 62px;
|
|
width: 100%;
|
|
display: flex;
|
|
border-top: solid 2px @color-label-grey;
|
|
.add-item{
|
|
display: flex;
|
|
width: 100%;
|
|
height: 100%;
|
|
flex-flow: row;
|
|
align-items: center;
|
|
justify-content: center;
|
|
label{
|
|
font-size: 20px;
|
|
color: @color-darkish-blue;
|
|
}
|
|
i{
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.card-job-production{
|
|
width: 502px;
|
|
height: 768px;
|
|
background-color: @color-background-white;
|
|
.card-job-production-header{
|
|
height: 63px;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: row;
|
|
border-bottom: solid 2px @color-label-grey;
|
|
.title{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 24px;
|
|
font-size: 20px;
|
|
color: @color-darkish-blue;
|
|
justify-content: flex-start;
|
|
}
|
|
.box-right{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
margin-right: 8px;
|
|
.rectangle{
|
|
width: 152px;
|
|
height: 48px;
|
|
border-radius: 2px;
|
|
background-color: @color-whitethree;
|
|
label{
|
|
width: 100%;
|
|
height: 100%;
|
|
justify-content: center;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 20px;
|
|
color: @color-darkish-blue;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.card-job-production-body{
|
|
width: 100%;
|
|
height: calc(~'100% - 63px');
|
|
display: flex;
|
|
flex-flow: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
.card-job-production-body-top{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 366px;
|
|
height: 279px;
|
|
}
|
|
.card-job-production-body-bottom{
|
|
width: 464px;
|
|
height: 352px;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
display: flex;
|
|
flex-flow: column;
|
|
.tabs{
|
|
height: 64px;
|
|
width:100%;
|
|
background-color: @color-whitethree;
|
|
display: flex;
|
|
flex-direction: row;
|
|
button{
|
|
visibility: hidden;
|
|
border: none;
|
|
}
|
|
.tab{
|
|
color: @color-darkish-blue;
|
|
font-size: 20px;
|
|
visibility: visible;
|
|
width: 232px;
|
|
border-right: solid 1px @color-label-grey;
|
|
&.active{
|
|
color: @color-clear-blue;
|
|
background-color: @color-white;
|
|
border-top: solid 2px @color-clear-blue !important;
|
|
}
|
|
}
|
|
.tab:last-child{
|
|
border: none;
|
|
}
|
|
}
|
|
.content-box{
|
|
height: calc(~'100% - 64px');
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: column;
|
|
.row{
|
|
width: 464px;
|
|
height: 32px;
|
|
display: flex;
|
|
align-items: center;
|
|
color: @color-greyish-brown;
|
|
line-height: 1.78px;
|
|
text-align: justify;
|
|
label{
|
|
font-size: 18px;
|
|
margin-left: 36px;
|
|
}
|
|
}
|
|
.row:nth-child(odd){
|
|
background-color: @color-clear-blue-30;
|
|
}
|
|
.row:nth-child(even){
|
|
background-color: @color-white4;
|
|
}
|
|
.row:first-child{
|
|
margin-top: 16px;
|
|
}
|
|
.row.selected{
|
|
.triangle{
|
|
margin-left: 16px;
|
|
width: 0;
|
|
height: 0;
|
|
border-top: 6px solid transparent;
|
|
border-left: 8px solid @color-white;
|
|
border-bottom: 6px solid transparent;
|
|
}
|
|
background-color: @color-clear-blue-75;
|
|
color: @color-white;
|
|
label{
|
|
margin: 12px;
|
|
}
|
|
}
|
|
.card-production-section-file{
|
|
margin: 4px;
|
|
}
|
|
}
|
|
.content-box.scrollable{
|
|
width: 97%;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
|
|
.card-production-section-file{
|
|
width: 400px;
|
|
height: 48px;
|
|
background-color: @color-background-white;
|
|
border: solid 1px @color-white4;
|
|
display: flex;
|
|
flex-flow: row;
|
|
.section-file-header{
|
|
height: 100%;
|
|
width: 64px;
|
|
background-color: @color-white4;
|
|
color: @color-darkish-blue;
|
|
font-size: 20px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.section-file-body{
|
|
width: calc(~'100% - 72px');
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
.text{
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
font-size: 20px;
|
|
color: @color-darkish-blue;
|
|
margin-left: 8px;
|
|
label{
|
|
width: 260px;
|
|
}
|
|
}
|
|
.icon{
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
margin-right: 8px;
|
|
.fa{
|
|
width: 25px;
|
|
font-size: 25px;
|
|
}
|
|
.fa.fa-check{
|
|
color: @color-clear-blue;
|
|
}
|
|
.fa.fa-play{
|
|
color: @color-apple-green;
|
|
}
|
|
.fa.fa-hourglass-half{
|
|
color: @color-light-orange;
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
/* bordo green per card section file*/
|
|
.border-green{
|
|
border: solid 1px @color-apple-green;
|
|
}
|
|
|
|
|
|
/* larghezza quando gli assi in card axes in production sono maggiori di 5 dopo scrollbar*/
|
|
.first-box-axes.scrollable .axes{
|
|
.number.width-number{
|
|
overflow: visible;
|
|
width: 128px;
|
|
}
|
|
}
|
|
|
|
.menu-container {
|
|
width: 386px;
|
|
top: 80px;
|
|
position: absolute;
|
|
display: flex;
|
|
left: calc(~"50% - 193px");
|
|
justify-content: center;
|
|
z-index: 100;
|
|
transform: translateZ(0);
|
|
&.top {
|
|
top: -88px;
|
|
.menu::before {
|
|
content: "\f0d7";
|
|
color: @color-white3;
|
|
position: absolute;
|
|
left: calc(~"50% - 11px");
|
|
top: 60px;
|
|
font-family: 'fontawesome';
|
|
font-size: 38px;
|
|
}
|
|
}
|
|
&.left{
|
|
|
|
left: -2px;
|
|
justify-content: flex-start;
|
|
}
|
|
&.right{
|
|
left: -189px;
|
|
justify-content: flex-end;
|
|
}
|
|
&.bottom {
|
|
.menu::before {
|
|
content: "\f0d8";
|
|
color: @color-white3;
|
|
position: absolute;
|
|
left: calc(~"50% - 11px");
|
|
top: -26px;
|
|
font-family: 'fontawesome';
|
|
font-size: 38px;
|
|
}
|
|
}
|
|
.menu {
|
|
background-color: @color-white3;
|
|
position: relative;
|
|
padding: 7px;
|
|
box-shadow: 0 1px 2px 0 @color-black-40;
|
|
button {
|
|
background-image: linear-gradient(to bottom,@color-nice-blue,@color-darkish-blue);
|
|
width: 60px;
|
|
height: 60px;
|
|
margin: 1px;
|
|
font-size: 20px;
|
|
color: #fff;
|
|
border: none;
|
|
position: relative;
|
|
&.active {
|
|
background-image: none;
|
|
background-color: #1791ff;
|
|
}
|
|
&:active {
|
|
background-image: none;
|
|
background-color: #1791ff;;
|
|
}
|
|
&.active:active {
|
|
background-image: none;
|
|
background-color: #1791ff;;
|
|
}
|
|
&.disabled::after,
|
|
&:disabled::after {
|
|
content: " ";
|
|
position: absolute;
|
|
display: block;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.width-100{
|
|
width: 100% !important;
|
|
}
|
|
|
|
.width-body-bottom{
|
|
width: 1000px !important;
|
|
} |