io.parrots
Version:
Parrots.io App
205 lines (204 loc) • 5.74 kB
text/less
.parrots-page-paper-size {
display: block;
width: 100%;
height: 100%;
position: absolute;
>.menu-paper-size-add-right {
display: flex;
position: absolute;
right: 0;
z-index: 2;
width: 220px;
height: 72pt;
cursor: pointer;
justify-content: center;
align-items: center;
&:before {
content: "a";
font-family: 'PhloxGlyphicons';
font-size: 12pt;
}
}
.selected {
color: @CLR_BRAND;
}
.SET_CENTER(@width){
display: flex;
align-items: center;
width: @width;
height: 100%;
}
>.blur-nav {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
opacity: 0.5;
background-color: #f5f5f5;
}
>.wrapper-head-paper-size {
.no-select;
.wrapper-under-line(52pt, extract(@CLR_1, 8)) ;
position: absolute;
top: 72pt;
cursor: unset;
font-weight: bold;
>.label-header-number {
.SET_CENTER(5%);
justify-content: center;
margin-right: 2%;
}
>.label-header-type {
.SET_CENTER(6%);
cursor: pointer;
margin-right: 6%;
}
>.label-header-name-width-height {
.SET_CENTER(4%);
cursor: pointer;
margin-right: 6%;
}
>.label-header-width-height {
.SET_CENTER(16%);
}
>.label-header-description {
.SET_CENTER(10%);
cursor: pointer;
}
}
>.wrapper-body-paper-size {
display: block;
padding-top: 122pt;
height: 100%;
width: 100%;
>.wrapper-list-paper-size {
.wrapper-under-line();
cursor: unset;
&:hover {
background-color: extract(@CLR_1, 8);
}
>.label-body-number {
.SET_CENTER(5%);
justify-content: center;
margin-right: 2%;
}
>.label-body-type {
.SET_CENTER(12%);
}
>.label-body-name-width-height {
.SET_CENTER(10%);
}
>.label-body-width-height {
.SET_CENTER(16%);
padding-left: 38px;
}
>.label-body-description {
.SET_CENTER(30%);
}
>.label-body-icon-edit {
.SET_CENTER(5%);
cursor: pointer;
&:before {
content: "w";
font-family: 'PhloxGlyphicons';
font-size: 23pt;
}
}
>.icon-edit {
.SET_CENTER(5%);
cursor: pointer;
&:before {
content: "w";
font-family: 'PhloxGlyphicons';
font-size: 23pt;
}
}
}
}
>.nav-paper-size {
.nav-bar-side(365px);
>.wrapper-label-head-nav-paper-size {
display: flex;
margin-left: 11%;
margin-top: 10%;
align-items: center;
>.icon-plus-nav {
display: flex;
&:before {
content: "a";
font-family: 'PhloxGlyphicons';
font-size: 15pt;
}
}
>.label-head-paper-size {
margin-left: 4%;
font-size: 18pt;
font-weight: bold;
}
}
>.label-description-nav-paper-size {
display: flex;
width: 76%;
margin-left: 10.5%;
margin-top: 2%;
font-size: 9pt;
color: extract(@CLR_1, 3);
}
>.wrapper-body-nav {
display: block;
width: 96%;
height: 50%;
>.wrapper-material {
display: flex;
width: 80%;
margin-left: 10%;
margin-top: 4%;
material-text-box {
width: 100%;
}
material-text-area {
width: 100%;
}
}
}
>.label-below-description-nav-paper-size {
display: flex;
margin-left: 10.5%;
width: 72%;
bottom: 110pt;
font-size: 9pt;
position: absolute;
color: extract(@CLR_1, 3);
}
>.btn-back-nav-paper-size {
.btn-box(25%, 30pt, extract(@CLR_0, 7), extract(@CLR_1, 8));
display: flex;
right: 55%;
bottom: 50pt;
font-size: 8pt;
position: absolute;
color: extract(@CLR_0, 7);
background-color: extract(@CLR_1, 8);
.icon-back {
display: flex;
&:before {
content: "B";
font-family: 'PhloxGlyphicons';
font-size: 7pt;
}
}
}
>.btn-submit-nav-paper-size {
.btn-box(44%, 30pt, extract(@CLR_1, 9), @CLR_BRAND);
display: flex;
right: 5%;
bottom: 50pt;
font-size: 8pt;
position: absolute;
}
>.btn-submit-none {
color: extract(@CLR_0, 9);
background-color: extract(@CLR_1, 8);
}
}
}