디자인 수정 커밋밋

This commit is contained in:
2025-10-17 16:26:45 +09:00
parent 7a57faa87b
commit 2aaf24348e
4 changed files with 273 additions and 68 deletions

View File

@@ -767,24 +767,133 @@ input[type="button"] {cursor:pointer !important;}
/* 寃€?됱〈 怨듯넻 ?뚯뒪 */
#plmSearchZon {width:99.2% !important; padding: 5px 5px 5px 5px; font-size: 13px; min-height: 45px;/* background-image: -ms-linear-gradient(top, #fff, #e6e9ed); */
/* background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e6e9ed)); */ border-bottom: 1px solid #d4d4d4;}
#plmSearchZon label {font-size:13px !important;}
#plmSearchZon table {table-layout: fixed;max-width:100%;} /*width:100%;*/
#plmSearchZon .table100 {table-layout: fixed;max-width:100%;width:100%;} /*width:100%;*/
#plmSearchZon table td span {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#plmSearchZon table td:nth-child(odd) {padding-right:3px;}
#plmSearchZon table td:nth-child(even) {padding-right: 15px;}
#plmSearchZon .short_search td:nth-child(even) {padding-right: 15px;}
#plmSearchZon label {background: url(../images/orangeLabel.png) left center no-repeat; padding-left: 10px; font-weight: 500;white-space: nowrap;}
/*
#plmSearchZon input[type="text"] {width:98%; min-width:50px;max-width:170px;border: 1px solid #ccc; background: #fff; height:20px; line-height:20px; border-radius: 2px;}
#plmSearchZon select {border: 1px solid #ccc; background: #fff; width:98%; min-width:60px;max-width:170px;height:20px; line-height:20px; border-radius: 4px;}
*/
#plmSearchZon input[type="text"] {width:150px; border: 1px solid #ccc; background: #fff; height:20px; line-height:20px; border-radius: 2px;}
#plmSearchZon select {border: 1px solid #ccc; background: #fff; width:150px; height:20px; line-height:20px; border-radius: 4px;}
#plmSearchZon {
width: 99.2% !important;
padding: 12px 16px;
font-size: 13px;
min-height: 40px;
background: linear-gradient(to bottom, #ffffff 0%, #fafbfc 100%);
border-bottom: 2px solid #e1e4e8;
border-radius: 0;
position: relative;
overflow: visible !important;
z-index: 10;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
#plmSearchZon p {border: 1px solid #ccc; background: #fff; width:150px; height:20px; line-height:20px; border-radius: 2px;}
#plmSearchZon label {
font-size: 12px !important;
font-weight: 500;
color: #5f6368;
white-space: nowrap;
padding-left: 0;
background: none;
}
#plmSearchZon table {
table-layout: fixed;
max-width: 100%;
border-spacing: 0 4px;
overflow: visible !important;
}
#plmSearchZon td {
position: relative;
overflow: visible !important;
}
#plmSearchZon tr {
overflow: visible !important;
}
#plmSearchZon .table100 {
table-layout: fixed;
max-width: 100%;
width: 100%;
}
#plmSearchZon table td span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#plmSearchZon table td:nth-child(odd) {
padding-right: 8px;
}
#plmSearchZon table td:nth-child(even) {
padding-right: 15px;
}
#plmSearchZon .short_search td:nth-child(even) {
padding-right: 15px;
}
#plmSearchZon input[type="text"] {
width: 150px;
height: 22px !important;
padding: 0 8px !important;
border: 1px solid #dadce0;
background: #ffffff;
border-radius: 4px;
font-size: 12px !important;
color: #202124;
transition: all 0.15s ease;
box-sizing: border-box;
line-height: 20px !important;
vertical-align: middle;
}
#plmSearchZon input[type="text"]:focus {
outline: none;
border-color: #1a73e8;
box-shadow: 0 0 0 1px rgba(26, 115, 232, 0.1);
}
#plmSearchZon input[type="text"].date_icon {
padding-right: 28px !important;
background-position: right 6px center;
background-size: 14px;
}
#plmSearchZon select {
width: 150px;
height: 22px !important;
padding: 0 22px 0 8px !important;
border: 1px solid #dadce0;
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%2364748b' d='M4 6L0 2h8z'/%3E%3C/svg%3E") no-repeat right 6px center;
background-size: 7px;
border-radius: 4px;
font-size: 12px !important;
color: #202124;
transition: all 0.15s ease;
box-sizing: border-box;
line-height: 20px !important;
vertical-align: middle;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
}
#plmSearchZon select:focus {
outline: none;
border-color: #1a73e8;
box-shadow: 0 0 0 1px rgba(26, 115, 232, 0.1);
}
#plmSearchZon p {
width: 150px;
height: 22px !important;
padding: 0 8px !important;
border: 1px solid #dadce0;
background: #fff;
line-height: 20px !important;
border-radius: 4px;
box-sizing: border-box;
vertical-align: middle;
}
.totalCntArea {float:left; width:100px; height:8px;line-height:25px; margin-bottom:-5px;font-size:13px}
@@ -2421,10 +2530,28 @@ button{cursor:pointer;}
/* tabulator 洹몃━???꾩슜 */
.tabulator-col{
background: #6f7477 !important;
color:#fff !important;
background: linear-gradient(to bottom, #e8eaed 0%, #dfe1e5 100%) !important;
color: #202124 !important;
font-size: 12px !important;
font-weight: 600 !important;
font-family: 'Noto Sans KR', sans-serif !important;
border-right: 1px solid #c0c3c7 !important;
border-bottom: 2px solid #b0b3b8 !important;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
/* tabulator 행 hover 효과 */
.tabulator-row:hover {
background-color: #e8f0fe !important;
cursor: pointer;
}
.tabulator-row.tabulator-selected {
background-color: #d2e3fc !important;
}
.tabulator-row.tabulator-selected:hover {
background-color: #c5d9f7 !important;
}

View File

@@ -31,9 +31,9 @@
position: relative;
box-sizing: border-box;
width: 100%;
border-bottom: 2px solid #1a73e8;
background-color: #f8f9fa;
color: #202124;
border-bottom: 2px solid #e0e0e0 !important;
background-color: #f5f5f5 !important;
color: #333333 !important;
font-weight: 600;
font-size: 12px;
white-space: nowrap;
@@ -64,8 +64,8 @@
box-sizing: border-box;
flex-direction: column;
justify-content: flex-start;
border-right: 1px solid #dadce0;
background: #f8f9fa;
border-right: 1px solid rgba(255, 255, 255, 0.15);
background: transparent;
text-align: center;
vertical-align: middle;
overflow: hidden
@@ -81,7 +81,7 @@
.tabulator .tabulator-header .tabulator-col .tabulator-col-content {
box-sizing: border-box;
position: relative;
padding: 6px 8px
padding: 5px 8px
}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-popup-button
@@ -146,7 +146,7 @@
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 6px solid #bbb
border-bottom: 6px solid #666666
}
.tabulator .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols
@@ -190,59 +190,59 @@
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover
{
cursor: pointer;
background-color: #e8f0fe
background-color: rgba(255, 255, 255, 0.1)
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter
{
color: #bbb
color: #666666
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover
{
cursor: pointer;
border-bottom: 6px solid #555
border-bottom: 6px solid #333333
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow
{
border-top: none;
border-bottom: 6px solid #bbb
border-bottom: 6px solid #666666
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter
{
color: #666
color: #333333
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover
{
cursor: pointer;
border-bottom: 6px solid #555
border-bottom: 6px solid #000000
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow
{
border-top: none;
border-bottom: 6px solid #666
border-bottom: 6px solid #333333
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter
{
color: #666
color: #333333
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover
{
cursor: pointer;
border-top: 6px solid #555
border-top: 6px solid #000000
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow
{
border-bottom: none;
border-top: 6px solid #666;
color: #666
border-top: 6px solid #333333;
color: #333333
}
.tabulator .tabulator-header .tabulator-col.tabulator-col-vertical .tabulator-col-content .tabulator-col-title
@@ -486,7 +486,7 @@
.tabulator .tabulator-footer .tabulator-page:not(.disabled):hover {
cursor: pointer;
background: #e8f0fe;
background: #f0f7ff;
border-color: #1a73e8;
color: #1a73e8
}
@@ -548,25 +548,25 @@
.tabulator-row {
position: relative;
box-sizing: border-box;
min-height: 28px;
min-height: 24px;
background-color: #fff
}
.tabulator-row.tabulator-row-even {
background-color: #fafbfc
background-color: #fafafa
}
.tabulator-row.tabulator-selectable:hover {
background-color: #e8f0fe;
background-color: #f0f7ff;
cursor: pointer
}
.tabulator-row.tabulator-selected {
background-color: #d2e3fc
background-color: #e3f2fd
}
.tabulator-row.tabulator-selected:hover {
background-color: #aecbfa;
background-color: #d1e9ff;
cursor: pointer
}
@@ -628,15 +628,16 @@
display: inline-block;
position: relative;
box-sizing: border-box;
padding: 4px 8px;
padding: 3px 8px;
border-right: 1px solid #dadce0;
vertical-align: middle;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: 28px;
height: 24px;
font-size: 12px;
color: #202124;
line-height: 18px;
}
.tabulator-row .tabulator-cell.tabulator-frozen {
@@ -829,7 +830,7 @@
border-bottom: 1px solid #dadce0;
border-right: 1px solid #dadce0;
border-top: 1px solid #dadce0;
padding: 6px 8px 6px 12px;
padding: 4px 8px 4px 12px;
background: #f8f9fa;
font-weight: 600;
font-size: 12px;
@@ -838,7 +839,7 @@
.tabulator-row.tabulator-group:hover {
cursor: pointer;
background-color: #e8f0fe
background-color: #f0f7ff
}
.tabulator-row.tabulator-group.tabulator-group-visible .tabulator-arrow