🚨chore: Sync Sass
This commit is contained in:
minsik
parent
8d25b6176f
commit
7ddcc91d1f
File diff suppressed because it is too large
Load Diff
@ -787,7 +787,6 @@ $alert-color: #101010;
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
padding-bottom: 14px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.eaves-keraba-td {
|
||||
|
||||
@ -1,21 +1,18 @@
|
||||
* {
|
||||
-webkit-text-size-adjust: none;
|
||||
-moz-text-size-adjust: none;
|
||||
-ms-text-size-adjust: none;
|
||||
-webkit-text-size-adjust:none;
|
||||
-moz-text-size-adjust:none;
|
||||
-ms-text-size-adjust:none;
|
||||
text-size-adjust: none;
|
||||
box-sizing: content-box
|
||||
}
|
||||
|
||||
*, ::after, ::before {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body {
|
||||
html, body{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
@ -39,105 +36,86 @@ time, mark, audio, video {
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
font-smooth: never;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
body:first-of-type caption {
|
||||
display: none;
|
||||
}
|
||||
body:first-of-type caption { display:none;}
|
||||
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
border: 0 none;
|
||||
border-spacing:0;
|
||||
border:0 none;
|
||||
}
|
||||
|
||||
caption, th, td {
|
||||
text-align: left;
|
||||
text-align:left;
|
||||
font-weight: normal;
|
||||
border: 0;
|
||||
border:0;
|
||||
}
|
||||
|
||||
a {
|
||||
cursor: pointer;
|
||||
color: #000;
|
||||
cursor:pointer;
|
||||
color:#000;
|
||||
}
|
||||
|
||||
a, a:hover, a:active {
|
||||
text-decoration: none;
|
||||
text-decoration:none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
/*form_style*/
|
||||
input, select, textarea, button, a, label {
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-tap-highlight-color:rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
button, input[type=text], input[type=button] {
|
||||
button,input[type=text], input[type=button] {
|
||||
-webkit-appearance: none;
|
||||
-webkit-border-radius: 0;
|
||||
-webkit-appearance: none;
|
||||
-webkit-appearance:none;
|
||||
appearance: none;
|
||||
border-radius: 0
|
||||
}
|
||||
|
||||
input[type=checkbox], input[type=radio] {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
input, select, button {
|
||||
border: 0 none;
|
||||
outline: none;
|
||||
margin: 0;
|
||||
border:0 none;
|
||||
outline:none;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
select {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
select::-ms-expand {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
line-height: 1;
|
||||
font-weight: 300;
|
||||
font-size: 0.938rem;
|
||||
letter-spacing: -0.6px;
|
||||
color: #8b8b8b;
|
||||
line-height:1;
|
||||
font-weight:300;
|
||||
font-size:0.938rem;
|
||||
letter-spacing:-0.6px;
|
||||
color:#8b8b8b;
|
||||
}
|
||||
|
||||
.log-box ::-webkit-input-placeholder {
|
||||
color: #8b8b8b;
|
||||
.log-box ::-webkit-input-placeholder{
|
||||
color:#8b8b8b;
|
||||
}
|
||||
|
||||
button {
|
||||
button{
|
||||
background: transparent;
|
||||
font-family: 'Noto Sans JP', sans-serif;
|
||||
border: none;
|
||||
@ -148,76 +126,32 @@ button {
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pre {
|
||||
.pre{
|
||||
font-family: 'Pretendard', sans-serif !important;
|
||||
}
|
||||
|
||||
// margin
|
||||
.mt5 {
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
|
||||
.mt10 {
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
|
||||
.mt15 {
|
||||
margin-top: 15px !important;
|
||||
}
|
||||
|
||||
.mb5 {
|
||||
margin-bottom: 5px !important;
|
||||
}
|
||||
|
||||
.mb10 {
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
.mb15 {
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
|
||||
.mr5 {
|
||||
margin-right: 5px !important;
|
||||
}
|
||||
|
||||
.mr10 {
|
||||
margin-right: 10px !important;
|
||||
}
|
||||
|
||||
.mr15 {
|
||||
margin-right: 15px !important;
|
||||
}
|
||||
|
||||
.ml5 {
|
||||
margin-left: 5px !important;
|
||||
}
|
||||
|
||||
.ml10 {
|
||||
margin-left: 10px !important;
|
||||
}
|
||||
|
||||
.ml15 {
|
||||
margin-left: 15px !important;
|
||||
}
|
||||
.mt5{margin-top: 5px !important;}
|
||||
.mt10{margin-top: 10px !important;}
|
||||
.mt15{margin-top: 15px !important;}
|
||||
.mb5{margin-bottom: 5px !important;}
|
||||
.mb10{margin-bottom: 10px !important;}
|
||||
.mb15{margin-bottom: 15px !important;}
|
||||
.mr5{margin-right: 5px !important;}
|
||||
.mr10{margin-right: 10px !important;}
|
||||
.mr15{margin-right: 15px !important;}
|
||||
.ml5{margin-left: 5px !important;}
|
||||
.ml10{margin-left: 10px !important;}
|
||||
.ml15{margin-left: 15px !important;}
|
||||
|
||||
// align
|
||||
.l {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.r {
|
||||
text-align: right !important;
|
||||
}
|
||||
|
||||
.c {
|
||||
text-align: center !important;
|
||||
}
|
||||
.al-l{text-align: left !important;}
|
||||
.al-r{text-align: right !important;}
|
||||
.al-c{text-align: center !important;}
|
||||
|
||||
|
||||
// button
|
||||
.btn-frame {
|
||||
.btn-frame{
|
||||
display: inline-block;
|
||||
padding: 0 7px;
|
||||
height: 34px;
|
||||
@ -231,48 +165,41 @@ button {
|
||||
font-family: 'Pretendard', sans-serif;
|
||||
transition: all .17s ease-in-out;
|
||||
cursor: pointer;
|
||||
|
||||
&.block {
|
||||
&.block{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&.small {
|
||||
&.small{
|
||||
font-family: 'Noto Sans JP', sans-serif;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
&.deepgray {
|
||||
&.deepgray{
|
||||
background-color: #2C2C2C;
|
||||
border: 1px solid #484848;
|
||||
}
|
||||
|
||||
&.gray {
|
||||
&.gray{
|
||||
background-color: #3C3C3C;
|
||||
border: 1px solid #545454;
|
||||
}
|
||||
|
||||
&.dark {
|
||||
&.dark{
|
||||
background-color: #1C1C1C;
|
||||
border: 1px solid #484848;
|
||||
}
|
||||
|
||||
&.modal {
|
||||
&.modal{
|
||||
font-family: 'Noto Sans JP', sans-serif;
|
||||
background-color: #272727;
|
||||
border: 1px solid #484848;
|
||||
color: #aaa;
|
||||
|
||||
&:hover {
|
||||
&:hover{
|
||||
background-color: #1083E3;
|
||||
border: 1px solid #1083E3;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
&.sub-tab {
|
||||
&.sub-tab{
|
||||
height: 30px;
|
||||
padding: 0 10px;
|
||||
line-height: 28px;
|
||||
@ -280,45 +207,39 @@ button {
|
||||
background-color: #2D2D2D;
|
||||
border: 1px solid #393939;
|
||||
color: #aaa;
|
||||
|
||||
&.act,
|
||||
&:hover {
|
||||
&:hover{
|
||||
background-color: #414E6C;
|
||||
border: 1px solid #414E6C;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.act {
|
||||
&.act{
|
||||
background-color: #1083E3;
|
||||
border: 1px solid #1083E3;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&.block {
|
||||
&.block{
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&.ico-flx {
|
||||
&.ico-flx{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.ico {
|
||||
.ico{
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.act {
|
||||
&.act{
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-origin {
|
||||
.btn-origin{
|
||||
display: inline-block;
|
||||
height: 30px;
|
||||
padding: 0 14px;
|
||||
@ -328,26 +249,22 @@ button {
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
transition: all .15s ease-in-out;
|
||||
|
||||
&.navy {
|
||||
&.navy{
|
||||
background-color: #304961;
|
||||
|
||||
&:hover {
|
||||
&:hover{
|
||||
background-color: #1083E3;
|
||||
}
|
||||
}
|
||||
|
||||
&.grey {
|
||||
&.grey{
|
||||
background-color: #94A0AD;
|
||||
|
||||
&:hover {
|
||||
&:hover{
|
||||
background-color: #607F9A;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// select
|
||||
.sort-select {
|
||||
.sort-select{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
min-width: 100px;
|
||||
@ -360,18 +277,16 @@ button {
|
||||
border-top-left-radius: 2px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
|
||||
p {
|
||||
p{
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.select-item-wrap {
|
||||
.select-item-wrap{
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: -1px;
|
||||
clip-path: inset(0 0 100% 0);
|
||||
clip-path:inset(0 0 100% 0);
|
||||
width: calc(100% + 2px);
|
||||
padding: 8px 0;
|
||||
max-height: 100px;
|
||||
@ -382,42 +297,35 @@ button {
|
||||
transition: all 0.17s ease-in-out;
|
||||
visibility: hidden;
|
||||
z-index: 999;
|
||||
|
||||
.select-item {
|
||||
.select-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8px 20px;
|
||||
line-height: 1.4;
|
||||
transition: all .17s ease-in-out;
|
||||
|
||||
button {
|
||||
button{
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&:hover{
|
||||
background-color: #2C2C2C;
|
||||
}
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 2px;
|
||||
background-color: transparent;
|
||||
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #5a5a5a;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
&::after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@ -429,20 +337,18 @@ button {
|
||||
background-size: cover;
|
||||
transition: all .17s ease-in-out;
|
||||
}
|
||||
|
||||
&.active {
|
||||
.select-item-wrap {
|
||||
&.active{
|
||||
.select-item-wrap{
|
||||
clip-path: inset(0 0 0 0);
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
&:after {
|
||||
&:after{
|
||||
transform: translateY(-50%) rotate(-180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select-light {
|
||||
.select-light{
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
@ -455,19 +361,16 @@ button {
|
||||
color: #45576F;
|
||||
font-family: 'Noto Sans JP', sans-serif;
|
||||
cursor: pointer;
|
||||
|
||||
&:disabled {
|
||||
&:disabled{
|
||||
opacity: 1;
|
||||
background-color: #FAFAFA;
|
||||
color: #999;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&.black {
|
||||
&.black{
|
||||
color: #101010;
|
||||
}
|
||||
|
||||
&.dark {
|
||||
&.dark{
|
||||
background: #323234 url(../../public/static/images/common/select_dark_arr.svg) calc(100% - 11px) center no-repeat;
|
||||
color: #898989;
|
||||
font-size: 12px;
|
||||
@ -478,8 +381,8 @@ button {
|
||||
|
||||
|
||||
// input
|
||||
.form-input {
|
||||
label {
|
||||
.form-input{
|
||||
label{
|
||||
display: block;
|
||||
color: #aaa;
|
||||
font-size: 12px;
|
||||
@ -487,10 +390,9 @@ button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
input[type=number],
|
||||
input[type=text] {
|
||||
&.input-origin {
|
||||
input[type=text]{
|
||||
&.input-origin{
|
||||
display: inline-block;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
@ -503,29 +405,24 @@ input[type=text] {
|
||||
padding: 0 10px;
|
||||
letter-spacing: 0px;
|
||||
text-align: right;
|
||||
|
||||
&::placeholder {
|
||||
&::placeholder{
|
||||
opacity: 1;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0px;
|
||||
}
|
||||
|
||||
&.block {
|
||||
&.block{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&:read-only {
|
||||
&:read-only{
|
||||
color: #AAA;
|
||||
}
|
||||
|
||||
&.plane {
|
||||
&.plane{
|
||||
font-family: 'Noto Sans JP', sans-serif;
|
||||
border: 1px solid #525252;
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&.input-light {
|
||||
&.input-light{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
@ -539,8 +436,7 @@ input[type=text] {
|
||||
font-weight: normal;
|
||||
transition: border-color .17s ease-in-out;
|
||||
text-align: left;
|
||||
|
||||
&:read-only {
|
||||
&:read-only{
|
||||
background-color: #FAFAFA;
|
||||
color: #999999;
|
||||
}
|
||||
@ -548,45 +444,40 @@ input[type=text] {
|
||||
}
|
||||
|
||||
|
||||
|
||||
// check-btn
|
||||
.check-btn {
|
||||
.check-btn{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 30px;
|
||||
background-color: #3A3A3A;
|
||||
border-radius: 3px;
|
||||
transition: all .17s ease-in-out;
|
||||
|
||||
.check-area {
|
||||
.check-area{
|
||||
flex: none;
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
border-right: 1px solid #272727;
|
||||
background: url(../../public/static/images/canvas/check-grey.svg) no-repeat center;
|
||||
background: url(../../public/static/images/canvas/check-grey.svg)no-repeat center;
|
||||
background-size: 11px 9px;
|
||||
}
|
||||
|
||||
.title-area {
|
||||
.title-area{
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
color: #898989;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
&.block {
|
||||
&.block{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.act {
|
||||
&.act{
|
||||
background-color: #fff;
|
||||
|
||||
.check-area {
|
||||
.check-area{
|
||||
border-right: 1px solid #101010;
|
||||
background: url(../../public/static/images/canvas/check-black.svg) no-repeat center;
|
||||
background: url(../../public/static/images/canvas/check-black.svg)no-repeat center;
|
||||
}
|
||||
|
||||
.title-area {
|
||||
.title-area{
|
||||
color: #101010;
|
||||
font-weight: 600;
|
||||
}
|
||||
@ -594,7 +485,7 @@ input[type=text] {
|
||||
}
|
||||
|
||||
// arr-btn
|
||||
.arr-btn {
|
||||
.arr-btn{
|
||||
display: block;
|
||||
height: 30px;
|
||||
border-radius: 3px;
|
||||
@ -602,15 +493,13 @@ input[type=text] {
|
||||
padding: 0 11px;
|
||||
text-align: left;
|
||||
transition: all .17s ease-in-out;
|
||||
|
||||
span {
|
||||
span{
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
color: #898989;
|
||||
font-weight: 400;
|
||||
padding-right: 15px;
|
||||
|
||||
&:after {
|
||||
&:after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
@ -618,39 +507,32 @@ input[type=text] {
|
||||
transform: translateY(-50%);
|
||||
width: 5px;
|
||||
height: 8px;
|
||||
background: url(../../public/static/images/canvas/arr_btn_ico.svg) no-repeat center;
|
||||
background: url(../../public/static/images/canvas/arr_btn_ico.svg)no-repeat center;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.act {
|
||||
&.act{
|
||||
background-color: #fff;
|
||||
|
||||
span {
|
||||
span{
|
||||
color: #101010;
|
||||
font-weight: 500;
|
||||
|
||||
&:after {
|
||||
background: url(../../public/static/images/canvas/arr_btn_ico_black.svg) no-repeat center;
|
||||
&:after{
|
||||
background: url(../../public/static/images/canvas/arr_btn_ico_black.svg)no-repeat center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.dark {
|
||||
&.dark{
|
||||
text-align: center;
|
||||
background-color: #272727;
|
||||
border: 1px solid #484848;
|
||||
|
||||
span {
|
||||
span{
|
||||
color: #Fff;
|
||||
|
||||
&:after {
|
||||
background: url(../../public/static/images/canvas/arr_btn_ico_white.svg) no-repeat center;
|
||||
&:after{
|
||||
background: url(../../public/static/images/canvas/arr_btn_ico_white.svg)no-repeat center;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.act {
|
||||
&.act{
|
||||
background-color: #1083E3;
|
||||
border: 1px solid #1083E3;
|
||||
}
|
||||
@ -659,12 +541,11 @@ input[type=text] {
|
||||
|
||||
// radio
|
||||
.d-check-radio,
|
||||
.d-check-box {
|
||||
.d-check-box{
|
||||
line-height: 1.1;
|
||||
cursor: pointer;
|
||||
|
||||
input[type=checkbox],
|
||||
input[type=radio] {
|
||||
input[type=radio]{
|
||||
position: static;
|
||||
margin-left: 0;
|
||||
cursor: pointer;
|
||||
@ -672,8 +553,7 @@ input[type=text] {
|
||||
z-index: 1;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
label {
|
||||
label{
|
||||
position: relative;
|
||||
padding-left: 10px;
|
||||
margin-bottom: 0;
|
||||
@ -686,91 +566,82 @@ input[type=text] {
|
||||
font-weight: 400;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&.light {
|
||||
label {
|
||||
&.light{
|
||||
label{
|
||||
color: #45576F;
|
||||
}
|
||||
}
|
||||
|
||||
&.no-text {
|
||||
label {
|
||||
&.no-text{
|
||||
label{
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.d-check-radio {
|
||||
label {
|
||||
&::before {
|
||||
label{
|
||||
&::before{
|
||||
cursor: pointer;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
top: 2px;
|
||||
top:2px;
|
||||
left: 0;
|
||||
margin-left: -12px;
|
||||
border: 1px solid #999999;
|
||||
border-radius: 100%;
|
||||
background-color: transparent;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
text-align:center;
|
||||
font-size:13px;
|
||||
line-height:1.4;
|
||||
transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
&::after {
|
||||
&::after{
|
||||
cursor: pointer;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
top: 6px;
|
||||
top:6px;
|
||||
left: 4px;
|
||||
margin-left: -12px;
|
||||
border: none;
|
||||
border-radius: 100%;
|
||||
background-color: #fff;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
text-align:center;
|
||||
font-size:13px;
|
||||
line-height:1.4;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: opacity 0.15s ease-in-out, color 0.15s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
&.light {
|
||||
label {
|
||||
&:before {
|
||||
&.light{
|
||||
label{
|
||||
&:before{
|
||||
border-color: #D6D6D7;
|
||||
}
|
||||
|
||||
&:after {
|
||||
&:after{
|
||||
background-color: #697C8F;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input[type=radio]:checked + label::after {
|
||||
input[type=radio]:checked + label::after{
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
&.pop {
|
||||
label {
|
||||
&.pop{
|
||||
label{
|
||||
font-size: 12px;
|
||||
|
||||
&:before {
|
||||
&:before{
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
&:after {
|
||||
&:after{
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #fff;
|
||||
@ -780,9 +651,9 @@ input[type=text] {
|
||||
}
|
||||
|
||||
// check-box
|
||||
.d-check-box {
|
||||
label {
|
||||
&::before {
|
||||
.d-check-box{
|
||||
label{
|
||||
&::before{
|
||||
cursor: pointer;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
@ -796,22 +667,20 @@ input[type=text] {
|
||||
background-color: transparent;
|
||||
transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
&:after {
|
||||
&:after{
|
||||
cursor: pointer;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
top: 0;
|
||||
top:0;
|
||||
left: 0;
|
||||
margin-left: -.8rem;
|
||||
transition: border 0.05s ease-in-out, color 0.05s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
input[type=checkbox]:checked + label::after {
|
||||
input[type=checkbox]:checked + label::after{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
@ -822,28 +691,23 @@ input[type=text] {
|
||||
border: 2px solid #697C8F;
|
||||
border-left: none;
|
||||
border-top: none;
|
||||
transform: translate(7.75px, 4.5px) rotate(45deg);
|
||||
-ms-transform: translate(7.75px, 4.5px) rotate(45deg);
|
||||
transform: translate(7.75px,4.5px) rotate(45deg);
|
||||
-ms-transform: translate(7.75px,4.5px) rotate(45deg);
|
||||
}
|
||||
|
||||
&.pop {
|
||||
input[type=checkbox]:checked + label::after {
|
||||
&.pop{
|
||||
input[type=checkbox]:checked + label::after{
|
||||
border-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// date-picker
|
||||
.date-picker {
|
||||
svg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.react-datepicker-wrapper {
|
||||
.date-picker{
|
||||
svg{display: none;}
|
||||
.react-datepicker-wrapper{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input[type=text] {
|
||||
input[type=text]{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
|
||||
@ -1,145 +1,126 @@
|
||||
@mixin flexbox() {
|
||||
@mixin flexbox(){
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
table {
|
||||
.overflow-lab {
|
||||
table{
|
||||
.overflow-lab{
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.al-l {
|
||||
.al-l{
|
||||
text-align: left !important;
|
||||
}
|
||||
}
|
||||
|
||||
.common-table {
|
||||
table {
|
||||
.common-table{
|
||||
table{
|
||||
table-layout: fixed;
|
||||
border: 1px solid #ECF0F4;
|
||||
border-radius: 3px;
|
||||
border-collapse: collapse;
|
||||
|
||||
tbody {
|
||||
th {
|
||||
border-collapse:collapse;
|
||||
tbody{
|
||||
th{
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: #344356;
|
||||
padding: 14px 12px;
|
||||
border: 1px solid #ECF0F4;
|
||||
border: 1px solid #ECF0F4 ;
|
||||
background-color: #F7F9FA;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
td {
|
||||
td{
|
||||
padding: 9px;
|
||||
border: 1px solid #ECF0F4;
|
||||
border: 1px solid #ECF0F4 ;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
vertical-align: middle;
|
||||
|
||||
.radio-wrap {
|
||||
.radio-wrap{
|
||||
flex: none;
|
||||
@include flexbox;
|
||||
}
|
||||
|
||||
.form-flex-wrap {
|
||||
.form-flex-wrap{
|
||||
@include flexbox;
|
||||
}
|
||||
|
||||
.date-picker-wrap {
|
||||
.date-picker-wrap{
|
||||
width: 100%;
|
||||
@include flexbox;
|
||||
|
||||
span {
|
||||
span{
|
||||
margin: 0 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.bt-able {
|
||||
&.bt-able{
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.infomation-table {
|
||||
table {
|
||||
.infomation-table{
|
||||
table{
|
||||
border-top: 1px solid #DEE3EA;
|
||||
border-bottom: 1px solid #DEE3EA;
|
||||
border-collapse: collapse;
|
||||
|
||||
tbody {
|
||||
tr {
|
||||
th {
|
||||
border-collapse:collapse;
|
||||
tbody{
|
||||
tr{
|
||||
th{
|
||||
font-size: 13px;
|
||||
color: #344356;
|
||||
font-weight: 500;
|
||||
padding: 18px 0;
|
||||
border-bottom: 1px solid #F4F4F7;
|
||||
|
||||
.title {
|
||||
.title{
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
td{
|
||||
padding: 0 0 0 15px;
|
||||
border-bottom: 1px solid #F4F4F7;
|
||||
|
||||
.guide {
|
||||
.guide{
|
||||
font-size: 13px;
|
||||
color: #697C8F;
|
||||
font-weight: normal;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
span {
|
||||
span{
|
||||
font-size: 13px;
|
||||
color: #697C8F;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
th, td {
|
||||
border-bottom: none;
|
||||
&:last-child{
|
||||
th,td{border-bottom: none;}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.flx-box {
|
||||
.flx-box{
|
||||
@include flexbox;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltips {
|
||||
.tooltips{
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
display: inline-block;
|
||||
background: url(../../public/static/images/sub/tooltips.svg) no-repeat center;
|
||||
background: url(../../public/static/images/sub/tooltips.svg)no-repeat center;
|
||||
background-size: cover;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.module-table {
|
||||
table {
|
||||
.module-table{
|
||||
table{
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
|
||||
thead {
|
||||
thead{
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
|
||||
th {
|
||||
th{
|
||||
padding: 13px 0;
|
||||
font-size: 13px;
|
||||
color: #344356;
|
||||
@ -148,18 +129,15 @@ table {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
tbody{
|
||||
display: block;
|
||||
overflow-y: auto;
|
||||
|
||||
tr {
|
||||
tr{
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
border: 1px solid #ECF0F4;
|
||||
|
||||
td {
|
||||
td{
|
||||
padding: 10px 0px;
|
||||
font-size: 13px;
|
||||
color: #45576F;
|
||||
@ -167,39 +145,30 @@ table {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #C1CCD7;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&.small {
|
||||
tbody {
|
||||
height: 120px;
|
||||
&.small{
|
||||
tbody{height: 120px;}
|
||||
}
|
||||
}
|
||||
|
||||
&.big {
|
||||
&.big{
|
||||
td,
|
||||
th {
|
||||
&:nth-child(2) {
|
||||
th{
|
||||
&:nth-child(2){
|
||||
width: 121px;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
tbody{
|
||||
height: 160px;
|
||||
|
||||
td {
|
||||
td{
|
||||
padding: 10px 20px;
|
||||
}
|
||||
}
|
||||
@ -207,9 +176,30 @@ table {
|
||||
}
|
||||
}
|
||||
|
||||
.roof-module-table {
|
||||
table {
|
||||
table-layout: fixed;
|
||||
.roof-module-table{
|
||||
table{
|
||||
border-collapse: collapse;
|
||||
thead{
|
||||
th{
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
border: 1px solid #505050;
|
||||
vertical-align: middle;
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
text-align: center;
|
||||
word-break: keep-all;
|
||||
}
|
||||
}
|
||||
tbody{
|
||||
td{
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
border: 1px solid #505050;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user