Merge remote-tracking branch 'z-eactive/jenkins_with_weblogic' into jenkins_with_weblogic
# Conflicts: # src/main/resources/static/css/main.css # src/main/resources/static/sass/base/_kjb-font.scss
This commit is contained in:
@@ -572,40 +572,40 @@ hr {
|
|||||||
@font-face {
|
@font-face {
|
||||||
font-family: "Spoqa Han Sans Neo";
|
font-family: "Spoqa Han Sans Neo";
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
src: local("Spoqa Han Sans Neo Bold"), url("/font/kjb/font/kjb/SpoqaHanSansNeo-Bold.woff2") format("woff2"), url("/font/kjb/font/kjb/SpoqaHanSansNeo-Bold.woff") format("woff"), url("/font/kjb/font/kjb/SpoqaHanSansNeo-Bold.ttf") format("truetype");
|
src: local("Spoqa Han Sans Neo Bold"), url("/font/kjb/SpoqaHanSansNeo-Bold.woff2") format("woff2"), url("/font/kjb/SpoqaHanSansNeo-Bold.woff") format("woff"), url("/font/kjb/SpoqaHanSansNeo-Bold.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "Spoqa Han Sans Neo";
|
font-family: "Spoqa Han Sans Neo";
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: local("Spoqa Han Sans Neo Regular"), url("/font/kjb/font/kjb/SpoqaHanSansNeo-Regular.woff2") format("woff2"), url("/font/kjb/font/kjb/SpoqaHanSansNeo-Regular.woff") format("woff"), url("/font/kjb/font/kjb/SpoqaHanSansNeo-Regular.ttf") format("truetype");
|
src: local("Spoqa Han Sans Neo Regular"), url("/font/kjb/SpoqaHanSansNeo-Regular.woff2") format("woff2"), url("/font/kjb/SpoqaHanSansNeo-Regular.woff") format("woff"), url("/font/kjb/SpoqaHanSansNeo-Regular.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
@font-face {}
|
@font-face {}
|
||||||
/* SpoqaHanSans */
|
/* SpoqaHanSans */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "SpoqaHanSans";
|
font-family: "SpoqaHanSans";
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: url("/font/kjb/font/kjb/SpoqaHanSansRegular.woff") format("woff"), url("/font/kjb/font/kjb/SpoqaHanSansRegular.woff2") format("woff2"), url("/font/kjb/font/kjb/SpoqaHanSansRegular.ttf") format("truetype");
|
src: url("/font/kjb/SpoqaHanSansRegular.woff") format("woff"), url("/font/kjb/SpoqaHanSansRegular.woff2") format("woff2"), url("/font/kjb/SpoqaHanSansRegular.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "SpoqaHanSansBold";
|
font-family: "SpoqaHanSansBold";
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
src: url("/font/kjb/font/kjb/SpoqaHanSansBold.woff") format("woff"), url("/font/kjb/font/kjb/SpoqaHanSansBold.woff2") format("woff2"), url("/font/kjb/font/kjb/SpoqaHanSansBold.ttf") format("truetype");
|
src: url("/font/kjb/SpoqaHanSansBold.woff") format("woff"), url("/font/kjb/SpoqaHanSansBold.woff2") format("woff2"), url("/font/kjb/SpoqaHanSansBold.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
/* HGGGothicssi */
|
/* HGGGothicssi */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "HGGGothicssi";
|
font-family: "HGGGothicssi";
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
src: url("/font/kjb/font/kjb/HGGGothicssi40g.woff") format("woff"), url("/font/kjb/font/kjb/HGGGothicssi40g.woff2") format("woff2"), url("/font/kjb/font/kjb/HGGGothicssi40g.ttf") format("truetype");
|
src: url("/font/kjb/HGGGothicssi40g.woff") format("woff"), url("/font/kjb/HGGGothicssi40g.woff2") format("woff2"), url("/font/kjb/HGGGothicssi40g.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "HGGGothicssi";
|
font-family: "HGGGothicssi";
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: url("/font/kjb/font/kjb/HGGGothicssi60g.woff") format("woff"), url("/font/kjb/font/kjb/HGGGothicssi60g.woff2") format("woff2"), url("/font/kjb/font/kjb/HGGGothicssi60g.ttf") format("truetype");
|
src: url("/font/kjb/HGGGothicssi60g.woff") format("woff"), url("/font/kjb/HGGGothicssi60g.woff2") format("woff2"), url("/font/kjb/HGGGothicssi60g.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "HGGGothicssi";
|
font-family: "HGGGothicssi";
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
src: url("/font/kjb/font/kjb/HGGGothicssi80g.woff") format("woff"), url("/font/kjb/font/kjb/HGGGothicssi80g.woff2") format("woff2"), url("/font/kjb/font/kjb/HGGGothicssi80g.ttf") format("truetype");
|
src: url("/font/kjb/HGGGothicssi80g.woff") format("woff"), url("/font/kjb/HGGGothicssi80g.woff2") format("woff2"), url("/font/kjb/HGGGothicssi80g.ttf") format("truetype");
|
||||||
}
|
}
|
||||||
:root {
|
:root {
|
||||||
--primary-blue: #4B9BFF;
|
--primary-blue: #4B9BFF;
|
||||||
@@ -4440,6 +4440,11 @@ select.form-control {
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.modal-dialog {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.modal-header {
|
.modal-header {
|
||||||
padding: 30px 50px 20px;
|
padding: 30px 50px 20px;
|
||||||
@@ -4505,11 +4510,14 @@ select.form-control {
|
|||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.modal-footer {
|
.modal-footer {
|
||||||
padding: 16px 24px 24px;
|
padding: 16px 24px 24px;
|
||||||
flex-direction: column;
|
flex-direction: row;
|
||||||
|
gap: 10px;
|
||||||
}
|
}
|
||||||
|
.modal-footer .btn,
|
||||||
.modal-footer .btn-modal-cancel,
|
.modal-footer .btn-modal-cancel,
|
||||||
.modal-footer .btn-modal-confirm {
|
.modal-footer .btn-modal-confirm {
|
||||||
width: 100%;
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
height: 46px;
|
height: 46px;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
}
|
}
|
||||||
@@ -15290,6 +15298,7 @@ input[type=checkbox]:checked + .custom-checkbox {
|
|||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
min-width: 116px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-empty-state {
|
.user-empty-state {
|
||||||
@@ -15540,6 +15549,200 @@ input[type=checkbox]:checked + .custom-checkbox {
|
|||||||
margin-top: 40px;
|
margin-top: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.user-management-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 24px;
|
||||||
|
padding: 24px 16px;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
.user-management-container .table-controls {
|
||||||
|
display: contents;
|
||||||
|
}
|
||||||
|
.user-management-container .table-controls .total-count {
|
||||||
|
order: 1;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #000000;
|
||||||
|
padding-bottom: 6px;
|
||||||
|
border-bottom: 1.5px solid #212529;
|
||||||
|
}
|
||||||
|
.user-management-container .table-controls .total-count strong {
|
||||||
|
color: #0049b4;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.user-management-container .table-controls .search-box {
|
||||||
|
order: 4;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.user-management-container .table-controls .search-box .btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table {
|
||||||
|
order: 2;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 8px;
|
||||||
|
background: #3BA4ED;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #FFFFFF;
|
||||||
|
padding: 0 4px;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell:nth-child(1) {
|
||||||
|
width: 26px !important;
|
||||||
|
min-width: 26px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell:nth-child(2) {
|
||||||
|
width: 60px !important;
|
||||||
|
min-width: 60px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell:nth-child(3) {
|
||||||
|
flex: 1 !important;
|
||||||
|
min-width: 100px;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell:nth-child(4) {
|
||||||
|
width: 39px !important;
|
||||||
|
min-width: 39px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell:nth-child(5) {
|
||||||
|
width: 61px !important;
|
||||||
|
min-width: 61px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-header .header-cell:nth-child(6) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 8px;
|
||||||
|
gap: 0;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row:nth-child(even) {
|
||||||
|
background-color: #EDF5FD;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row:nth-child(odd) {
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row:hover {
|
||||||
|
background-color: rgba(0, 73, 180, 0.08);
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #212529;
|
||||||
|
padding: 0 4px;
|
||||||
|
justify-content: center;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(1) {
|
||||||
|
width: 26px !important;
|
||||||
|
min-width: 26px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(2) {
|
||||||
|
width: 60px !important;
|
||||||
|
min-width: 60px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(2) a {
|
||||||
|
color: #212529;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(3) {
|
||||||
|
flex: 1 !important;
|
||||||
|
min-width: 100px;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(4) {
|
||||||
|
width: 39px !important;
|
||||||
|
min-width: 39px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(5) {
|
||||||
|
width: 61px !important;
|
||||||
|
min-width: 61px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-cell:nth-child(6), .user-management-container .list-table .list-table-row .row-cell.row-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.user-management-container .list-table .list-table-row .row-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.user-management-container .user-empty-state {
|
||||||
|
padding: 48px 16px;
|
||||||
|
}
|
||||||
|
.user-management-container .user-empty-state .empty-icon {
|
||||||
|
font-size: 60px;
|
||||||
|
}
|
||||||
|
.user-management-container .user-empty-state h3 {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.user-management-container .user-empty-state p {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.user-management-container .pagination {
|
||||||
|
order: 3;
|
||||||
|
gap: 13px;
|
||||||
|
padding: 24px 0;
|
||||||
|
}
|
||||||
|
.user-management-container .pagination .pagination-btn {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
.user-management-container .pagination .pagination-btn i, .user-management-container .pagination .pagination-btn svg {
|
||||||
|
font-size: 14px;
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
}
|
||||||
|
.user-management-container .pagination .pagination-numbers {
|
||||||
|
gap: 13px;
|
||||||
|
}
|
||||||
|
.user-management-container .pagination .pagination-number {
|
||||||
|
min-width: 10px;
|
||||||
|
height: 21px;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #5f666c;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
.user-management-container .pagination .pagination-number.active {
|
||||||
|
font-weight: 700;
|
||||||
|
color: #212529;
|
||||||
|
}
|
||||||
|
}
|
||||||
.commission-container {
|
.commission-container {
|
||||||
max-width: 1400px;
|
max-width: 1400px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@@ -2,9 +2,9 @@
|
|||||||
font-family: 'Spoqa Han Sans Neo';
|
font-family: 'Spoqa Han Sans Neo';
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
src: local('Spoqa Han Sans Neo Bold'),
|
src: local('Spoqa Han Sans Neo Bold'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansNeo-Bold.woff2') format('woff2'),
|
url('/font/kjb/SpoqaHanSansNeo-Bold.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansNeo-Bold.woff') format('woff'),
|
url('/font/kjb/SpoqaHanSansNeo-Bold.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansNeo-Bold.ttf') format('truetype')
|
url('/font/kjb/SpoqaHanSansNeo-Bold.ttf') format('truetype')
|
||||||
;
|
;
|
||||||
//unicode-range: U+AC00-D7AF, U+0000-0040, U+005B-0060, U+007B-007F
|
//unicode-range: U+AC00-D7AF, U+0000-0040, U+005B-0060, U+007B-007F
|
||||||
}
|
}
|
||||||
@@ -13,9 +13,9 @@
|
|||||||
font-family: 'Spoqa Han Sans Neo';
|
font-family: 'Spoqa Han Sans Neo';
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: local('Spoqa Han Sans Neo Regular'),
|
src: local('Spoqa Han Sans Neo Regular'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansNeo-Regular.woff2') format('woff2'),
|
url('/font/kjb/SpoqaHanSansNeo-Regular.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansNeo-Regular.woff') format('woff'),
|
url('/font/kjb/SpoqaHanSansNeo-Regular.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansNeo-Regular.ttf') format('truetype')
|
url('/font/kjb/SpoqaHanSansNeo-Regular.ttf') format('truetype')
|
||||||
;
|
;
|
||||||
//unicode-range: U+AC00-D7AF, U+0000-0040, U+005B-0060, U+007B-007F
|
//unicode-range: U+AC00-D7AF, U+0000-0040, U+005B-0060, U+007B-007F
|
||||||
}
|
}
|
||||||
@@ -30,37 +30,37 @@
|
|||||||
@font-face {
|
@font-face {
|
||||||
font-family:'SpoqaHanSans';
|
font-family:'SpoqaHanSans';
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src:url('/font/kjb/font/kjb/SpoqaHanSansRegular.woff') format('woff'),
|
src:url('/font/kjb/SpoqaHanSansRegular.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansRegular.woff2') format('woff2'),
|
url('/font/kjb/SpoqaHanSansRegular.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansRegular.ttf') format('truetype');
|
url('/font/kjb/SpoqaHanSansRegular.ttf') format('truetype');
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family:'SpoqaHanSansBold';
|
font-family:'SpoqaHanSansBold';
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
src:url('/font/kjb/font/kjb/SpoqaHanSansBold.woff') format('woff'),
|
src:url('/font/kjb/SpoqaHanSansBold.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansBold.woff2') format('woff2'),
|
url('/font/kjb/SpoqaHanSansBold.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/SpoqaHanSansBold.ttf') format('truetype');
|
url('/font/kjb/SpoqaHanSansBold.ttf') format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
/* HGGGothicssi */
|
/* HGGGothicssi */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family:'HGGGothicssi';
|
font-family:'HGGGothicssi';
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
src:url('/font/kjb/font/kjb/HGGGothicssi40g.woff') format('woff'),
|
src:url('/font/kjb/HGGGothicssi40g.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/HGGGothicssi40g.woff2') format('woff2'),
|
url('/font/kjb/HGGGothicssi40g.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/HGGGothicssi40g.ttf') format('truetype');
|
url('/font/kjb/HGGGothicssi40g.ttf') format('truetype');
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family:'HGGGothicssi';
|
font-family:'HGGGothicssi';
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src:url('/font/kjb/font/kjb/HGGGothicssi60g.woff') format('woff'),
|
src:url('/font/kjb/HGGGothicssi60g.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/HGGGothicssi60g.woff2') format('woff2'),
|
url('/font/kjb/HGGGothicssi60g.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/HGGGothicssi60g.ttf') format('truetype');
|
url('/font/kjb/HGGGothicssi60g.ttf') format('truetype');
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family:'HGGGothicssi';
|
font-family:'HGGGothicssi';
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
src:url('/font/kjb/font/kjb/HGGGothicssi80g.woff') format('woff'),
|
src:url('/font/kjb/HGGGothicssi80g.woff') format('woff'),
|
||||||
url('/font/kjb/font/kjb/HGGGothicssi80g.woff2') format('woff2'),
|
url('/font/kjb/HGGGothicssi80g.woff2') format('woff2'),
|
||||||
url('/font/kjb/font/kjb/HGGGothicssi80g.ttf') format('truetype');
|
url('/font/kjb/HGGGothicssi80g.ttf') format('truetype');
|
||||||
}
|
}
|
||||||
@@ -151,6 +151,10 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: $breakpoint-sm) {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Modal header with gradient background
|
// Modal header with gradient background
|
||||||
@@ -226,11 +230,14 @@
|
|||||||
|
|
||||||
@media (max-width: $breakpoint-sm) {
|
@media (max-width: $breakpoint-sm) {
|
||||||
padding: 16px 24px 24px;
|
padding: 16px 24px 24px;
|
||||||
flex-direction: column;
|
flex-direction: row;
|
||||||
|
gap: 10px;
|
||||||
|
|
||||||
|
.btn,
|
||||||
.btn-modal-cancel,
|
.btn-modal-cancel,
|
||||||
.btn-modal-confirm {
|
.btn-modal-confirm {
|
||||||
width: 100%;
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
height: 46px;
|
height: 46px;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -106,6 +106,7 @@
|
|||||||
border-radius: $border-radius-sm;
|
border-radius: $border-radius-sm;
|
||||||
font-size: $font-size-sm;
|
font-size: $font-size-sm;
|
||||||
font-weight: $font-weight-medium;
|
font-weight: $font-weight-medium;
|
||||||
|
min-width: 116px;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Empty State
|
// Empty State
|
||||||
@@ -382,3 +383,265 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-top: $spacing-2xl;
|
margin-top: $spacing-2xl;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// -----------------------------------------------------------------------------
|
||||||
|
// User Management Mobile Styles - Figma Design (node 1161-10519)
|
||||||
|
// 사용자 관리 모바일 디자인
|
||||||
|
// -----------------------------------------------------------------------------
|
||||||
|
@media (max-width: $breakpoint-sm) {
|
||||||
|
.user-management-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: $spacing-lg;
|
||||||
|
padding: $spacing-lg $spacing-md;
|
||||||
|
margin-bottom: 0;
|
||||||
|
|
||||||
|
// Table Controls - 모바일 레이아웃 (display: contents로 자식들이 container flex에 참여)
|
||||||
|
.table-controls {
|
||||||
|
display: contents;
|
||||||
|
|
||||||
|
.total-count {
|
||||||
|
order: 1;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 16px;
|
||||||
|
color: $black;
|
||||||
|
padding-bottom: 6px;
|
||||||
|
border-bottom: 1.5px solid #212529;
|
||||||
|
|
||||||
|
strong {
|
||||||
|
color: #0049b4;
|
||||||
|
font-weight: $font-weight-bold;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 이용자 추가 버튼 - 테이블 아래로 이동
|
||||||
|
.search-box {
|
||||||
|
order: 4;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// List Table - 모바일 디자인 (코너 라운드 적용)
|
||||||
|
.list-table {
|
||||||
|
order: 2;
|
||||||
|
background: $white;
|
||||||
|
border-radius: $border-radius-lg;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
// Header - 모바일에서 표시 (Figma: 40px 높이, #3BA4ED 배경)
|
||||||
|
.list-table-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 8px;
|
||||||
|
background: #3BA4ED;
|
||||||
|
border-radius: $border-radius-md $border-radius-md 0 0;
|
||||||
|
|
||||||
|
.header-cell {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: $font-weight-bold;
|
||||||
|
color: $white;
|
||||||
|
padding: 0 4px;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
// NO 컬럼 - 26px
|
||||||
|
&:nth-child(1) {
|
||||||
|
width: 26px !important;
|
||||||
|
min-width: 26px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 성명 컬럼 - 60px
|
||||||
|
&:nth-child(2) {
|
||||||
|
width: 60px !important;
|
||||||
|
min-width: 60px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 이메일 아이디 컬럼 - flex 1
|
||||||
|
&:nth-child(3) {
|
||||||
|
flex: 1 !important;
|
||||||
|
min-width: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 권한 컬럼 - 39px
|
||||||
|
&:nth-child(4) {
|
||||||
|
width: 39px !important;
|
||||||
|
min-width: 39px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 계정상태 컬럼 - 61px
|
||||||
|
&:nth-child(5) {
|
||||||
|
width: 61px !important;
|
||||||
|
min-width: 61px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 설정 컬럼 - 모바일에서 숨김
|
||||||
|
&:nth-child(6) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Body
|
||||||
|
.list-table-body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Row - 모바일 디자인 (Figma: 40px 높이)
|
||||||
|
.list-table-row {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 8px;
|
||||||
|
gap: 0;
|
||||||
|
|
||||||
|
// 짝수/홀수 배경색
|
||||||
|
&:nth-child(even) {
|
||||||
|
background-color: #EDF5FD;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(odd) {
|
||||||
|
background-color: $white;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: rgba($primary-blue, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-cell {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: $font-weight-regular;
|
||||||
|
color: #212529;
|
||||||
|
padding: 0 4px;
|
||||||
|
justify-content: center;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
|
// data-label 숨김
|
||||||
|
&::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// NO 컬럼 - 26px
|
||||||
|
&:nth-child(1) {
|
||||||
|
width: 26px !important;
|
||||||
|
min-width: 26px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 성명 컬럼 - 60px
|
||||||
|
&:nth-child(2) {
|
||||||
|
width: 60px !important;
|
||||||
|
min-width: 60px;
|
||||||
|
flex: none;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #212529;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 이메일 아이디 컬럼 - flex 1
|
||||||
|
&:nth-child(3) {
|
||||||
|
flex: 1 !important;
|
||||||
|
min-width: 100px;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 권한 컬럼 - 39px
|
||||||
|
&:nth-child(4) {
|
||||||
|
width: 39px !important;
|
||||||
|
min-width: 39px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 계정상태 컬럼 - 61px
|
||||||
|
&:nth-child(5) {
|
||||||
|
width: 61px !important;
|
||||||
|
min-width: 61px;
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 설정 컬럼 (row-actions) - 모바일에서 숨김
|
||||||
|
&:nth-child(6),
|
||||||
|
&.row-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// row-actions 클래스 직접 숨김
|
||||||
|
.row-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Empty State - 모바일 조정
|
||||||
|
.user-empty-state {
|
||||||
|
padding: $spacing-3xl $spacing-md;
|
||||||
|
|
||||||
|
.empty-icon {
|
||||||
|
font-size: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: $font-size-lg;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: $font-size-sm;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pagination - 모바일 디자인 (테이블 다음, 버튼 이전)
|
||||||
|
.pagination {
|
||||||
|
order: 3;
|
||||||
|
gap: 13px;
|
||||||
|
padding: $spacing-lg 0;
|
||||||
|
|
||||||
|
.pagination-btn {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
|
||||||
|
i, svg {
|
||||||
|
font-size: 14px;
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-numbers {
|
||||||
|
gap: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-number {
|
||||||
|
min-width: 10px;
|
||||||
|
height: 21px;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #5f666c;
|
||||||
|
font-weight: $font-weight-regular;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
font-weight: $font-weight-bold;
|
||||||
|
color: #212529;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user