Nicola Carminati
130 lines
4.0 KiB
Plaintext
130 lines
4.0 KiB
Plaintext
// out: false, sourceMap: false, main: ../style.less
|
|
@import "colors.less";
|
|
@footer-height: 80px;
|
|
@footer-button-size: 63px;
|
|
@footer-button-big-size: 82px;
|
|
@footer-button-ball-size: 10px;
|
|
@footer-button-halfball-size: @footer-button-ball-size / 2;
|
|
@footer-button-margin: 19px;
|
|
@footer-padding: 0 0 9px 8px;
|
|
@footer-machine-area-size: 300px;
|
|
footer {
|
|
position: absolute;
|
|
z-index: 300;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
.machine-area {
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 0;
|
|
width: @footer-machine-area-size;
|
|
height: @footer-height;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.container {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: flex-end;
|
|
background-image: @color-footer-background-image;
|
|
box-shadow: @color-footer-box-shadow;
|
|
right: @footer-machine-area-size;
|
|
margin: 0;
|
|
border-top-right-radius: @footer-height / 2;
|
|
border-bottom-right-radius: @footer-height /2;
|
|
line-height: @footer-height;
|
|
padding: @footer-padding;
|
|
height: @footer-height;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
box-sizing: border-box;
|
|
.swipeup{
|
|
width: 100%;
|
|
}
|
|
button {
|
|
cursor: pointer;
|
|
display: flex;
|
|
margin-left: @footer-button-margin;
|
|
margin-right: @footer-button-margin;
|
|
border: none;
|
|
min-width: @footer-button-size;
|
|
min-height: @footer-button-size;
|
|
border-radius: @footer-button-size /2;
|
|
background-image: @color-button-oval-background-image;
|
|
box-shadow: @color-button-oval-box-shadow;
|
|
}
|
|
button.main-production {
|
|
background-image: url(../icons/png/produzione-BIG.png);
|
|
background-size: cover;
|
|
}
|
|
button.tools-manager {
|
|
background-image: url(../icons/png/attrezzaggio-BIG.png);
|
|
background-size: cover;
|
|
}
|
|
button.report-manager{
|
|
background-image: url(../icons/png/report-BIG.png);
|
|
background-size: cover;
|
|
}
|
|
button.alarms-manager{
|
|
background-image: url(../icons/png/allarmi-BIG.png);
|
|
background-size: cover;
|
|
}
|
|
button.maintenance-manager{
|
|
background-image: url(../icons/png/manutenzione-BIG.png);
|
|
background-size: cover;
|
|
}
|
|
button.utilities{
|
|
background-image: url(../icons/png/Utilities-big.png);
|
|
background-size: cover;
|
|
}
|
|
button.scada{
|
|
background-image: url(../icons/png/SCADA-big.png);
|
|
background-size: cover;
|
|
}
|
|
|
|
button:active{
|
|
box-shadow: 0px 0px 1px 1px #FFF;
|
|
}
|
|
button[disabled] {
|
|
filter: grayscale(100%);
|
|
}
|
|
// button:hover,
|
|
button.big {
|
|
position: relative;
|
|
min-height: @footer-button-big-size;
|
|
min-width: @footer-button-big-size;
|
|
border-radius: @footer-button-big-size /2;
|
|
|
|
// &:after {
|
|
// content: " ";
|
|
// background-color: white;
|
|
// width: @footer-button-ball-size;
|
|
// height: @footer-button-ball-size;
|
|
// display: block;
|
|
// border-radius: 50%;
|
|
// -webkit-animation: fa-spin 2s infinite linear;
|
|
// animation: fa-spin 2s infinite linear;
|
|
// position: absolute;
|
|
// left: -@footer-button-halfball-size;
|
|
// top: calc(~'50% - @{footer-button-halfball-size}');
|
|
// transform-origin: (@footer-button-big-size /2 + @footer-button-halfball-size) @footer-button-halfball-size;
|
|
// }
|
|
|
|
&:before {
|
|
content: " ";
|
|
background-color: white;
|
|
width: 16px;
|
|
height: 4px;
|
|
display: block;
|
|
position: absolute;
|
|
bottom: -8px;
|
|
left: calc(50% - 8px);
|
|
border-radius: 13px;
|
|
}
|
|
}
|
|
}
|
|
}
|