io.parrots
Version:
Parrots.io App
203 lines (197 loc) • 6.13 kB
text/less
.parrots-page-query {
display: flex;
position: absolute;
padding-top: 72pt;
width: 100%;
height: 100%;
>.wrapper-query-left {
display: block;
height: 100%;
width: 25%;
border-right: 1.7px solid extract(@CLR_1, 7);
background-color: extract(@CLR_1, 9);
overflow: auto;
>.wrapper-head-left {
display: block;
height: 24%;
width: 100%;
padding: 12% 24px 24px 12%;
border-bottom: 0.7px solid extract(@CLR_1, 7);
>.label-title-left {
font-size: 16pt;
font-weight: bold;
}
>.label-desccription-left {
font-size: 11pt;
color: extract(@CLR_1, 3);
margin-top: 10pt;
}
}
.wrapper-list-sql {
display: flex;
cursor: pointer;
width: 100%;
height: 40pt;
border-bottom: 0.7px solid extract(@CLR_1, 7);
align-items: center;
>.icon-right {
padding-left: 12px;
display: flex;
height: 100%;
justify-content: center;
align-items: center;
&:before {
cursor: pointer;
content: "E";
font-family: 'PhloxGlyphicons';
font-size: 10pt;
}
}
>.icon-down {
padding-left: 12px;
display: flex;
height: 100%;
justify-content: center;
align-items: center;
color: @CLR_BRAND;
&:before {
cursor: pointer;
content: "K";
font-family: 'PhloxGlyphicons';
font-size: 10pt;
}
}
>.label-value-sql {
margin-left: 5%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
>.parent-sql {
width: 80%;
}
>.children-sql {
width: 200%;
}
}
.selected {
background-color: extract(@CLR_1, 8);
}
.wrapper-list-sql:hover {
background-color: extract(@CLR_1, 8);
}
}
>.wrapper-query-right {
display: block;
height: 100%;
width: 75%;
>.wrapper-text-query {
padding: 12px 12px 12px 12px;
background-color: extract(@CLR_1, 9);
display: flex;
height: 24%;
width: 100%;
border-bottom: 0.7px solid extract(@CLR_1, 7);
>.wrapper-text-query-item{
width: 100%;
overflow: auto;
>.col-md-12{
height: 40pt;
display: flex;
align-items: center;
material-text-area{
margin-top: 8pt;
>.material-input{
margin-top: 0;
}
}
}
}
}
>.wrapper-head-right {
display: flex;
height: 32pt;
padding-left: 24px;
align-items: center;
font-weight: bold;
>.btn-run {
position: absolute;
right: 0px;
cursor: pointer;
background: green;
height: 32pt;
padding-left: 20px;
padding-right: 20px;
display: flex;
align-items: center;
color: #FFF;
}
}
>.wrapper-result-type {
display: flex;
>.wrapper-result-type-item{
width: 20%;
height: 32pt;
display: flex;
align-items: center;
justify-content: center;
background-color: #FFF;
padding: 4px 4px 4px 4px;
cursor: pointer;
border: 0.7px solid #ededed;
}
>.selected{
cursor: default;
border-width: 0;
}
}
>.wrapper-result {
padding: 24px 24px 24px 24px;
position: relative;
overflow: auto;
width: 100%;
-ms-flex-align: center;
align-items: center;
border-bottom: 0.7px solid #ededed;
background-color: #ffffff;
phx-table {
position: relative;
background-color: #ffffff;
top: 0;
bottom: 0;
.column-head {
height: 30pt;
font-size: 12pt;
border: 1px solid extract(@CLR_0, 5);
font-weight: bold;
.phx-string-data-view{
padding-left: 12px;
padding-right: 12px;
}
}
.column-body {
font-size: 10pt;
border: 1px solid extract(@CLR_0, 5);
.phx-string-data-view{
padding-left: 12px;
padding-right: 12px;
}
}
}
>.label-space {
height: 100%;
width: 4%;
border-right: 0.7px solid extract(@CLR_1, 7);
}
>.label-column-result {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 15%;
border-right: 0.7px solid extract(@CLR_1, 7);
font-weight: bold;
}
}
}
}