diff --git a/assets/scss/common.scss b/assets/scss/common.scss index bebf21a..59ccc23 100644 --- a/assets/scss/common.scss +++ b/assets/scss/common.scss @@ -434,7 +434,7 @@ a { .v-application.#{$theme}-mode { min-width: 1000px; - .head-logo{ + .head-logo { gap: 8px; } @@ -485,6 +485,7 @@ a { .container--fluid { background-color: map-deep-get($config, #{$theme}, "container-fluid"); + .menu-container { height:calc(100vh - 60px); overflow-y: auto; @@ -951,15 +952,24 @@ a { "v-calendar-weekday-backgroundColor" ); border-right: 1px solid map-deep-get($config, #{$theme}, "v-calendar-weekday-border-color"); + border-bottom: 1px solid map-deep-get($config, #{$theme}, "v-calendar-weekday-border-color"); + border-top: 1px solid map-deep-get($config, #{$theme}, "v-calendar-weekday-border-color"); color: map-deep-get($config, #{$theme}, "v-calendar-weekday-color"); &:nth-of-type(1) { - color: map-deep-get($color, "week", "sun"); + // color: map-deep-get($config, + // #{$theme}, + // "v-calendar-is-sun" + // ); + border-left: 1px solid map-deep-get($config, #{$theme}, "v-calendar-weekday-border-color"); } - &:nth-of-type(7) { - color: map-deep-get($color, "week", "sat"); - } + // &:nth-of-type(7) { + // color: map-deep-get($config, + // #{$theme}, + // "v-calendar-is-sat" + // ); + // } } >.vc-day { @@ -968,22 +978,33 @@ a { .day-hldyNm, .day-label.is-holiday { - color: map-deep-get($color, "week", "sun"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sun" + ); } &.weekday-1 { .day-label, .day-hldyNm { - color: map-deep-get($color, "week", "sun"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sun" + ); } + + border-left: 1px solid map-deep-get($config, #{$theme}, "v-calendar-weekday-border-color"); } &.weekday-7 { .day-label, .day-hldyNm { - color: map-deep-get($color, "week", "sat"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sat" + ); } } @@ -1185,11 +1206,17 @@ a { } th.tui-sun { - color: map-deep-get($color, "week", "sun"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sun" + ); } th.tui-sat { - color: map-deep-get($color, "week", "sat"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sat" + ); } } @@ -1205,11 +1232,17 @@ a { } td.tui-calendar-sun { - color: map-deep-get($color, "week", "sun"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sun" + ); } td.tui-calendar-sat { - color: map-deep-get($color, "week", "sat"); + color: map-deep-get($config, + #{$theme}, + "v-calendar-is-sat" + ); } } } @@ -1323,11 +1356,12 @@ a { color: #46c0ff; } } + .v-btn { background-color: transparent !important; color: map-deep-get($config, #{$theme}, "btn-header-select-color") !important; } - + } [hover-tooltip] { diff --git a/assets/scss/common/grid.scss b/assets/scss/common/grid.scss index 6abcb48..7679f58 100644 --- a/assets/scss/common/grid.scss +++ b/assets/scss/common/grid.scss @@ -109,6 +109,15 @@ ); } + .grid-toggle-section{ + .tui-grid-rside-area{ + .tui-grid-body-area { + height: auto !important; + + } + } + } + .tui-grid { &-table { border: 1px solid; @@ -134,11 +143,11 @@ } &-body-container{ - border-right: 1px solid; - border-right-color: map-deep-get($config, - #{$theme}, - "tui-grid-cell-borderColor" - ); + border-right: 0; + // border-right-color: map-deep-get($config, + // #{$theme}, + // "tui-grid-cell-borderColor" + // ); width: auto !important; } @@ -151,24 +160,27 @@ width: $scrollbar-width !important; height: $scrollbar-width !important; -webkit-appearance: initial; - background-color: map-deep-get($config, - #{$theme}, - "scrollbar-track" - ) !important; + // background-color: map-deep-get($config, + // #{$theme}, + // "tui-grid-cell-borderColor" + // ) !important; + background-color: rgba(0, 0, 0, 0) !important; border-radius: 3px !important; } & ::-webkit-scrollbar-track { - background-color: map-deep-get($config, - #{$theme}, - "scrollbar-track" - ) !important; + // background-color: map-deep-get($config, + // #{$theme}, + // "tui-grid-cell-borderColor" + // ) !important; + background-color: rgba(0, 0, 0, 0) !important; } & ::-webkit-scrollbar-thumb { width: 50px !important; height: 50px !important; background-color: map-deep-get($config, #{$theme}, "scrollbar-thumb"); + // background-color: rgba(0, 0, 0, 0); border-radius: 3px; } @@ -195,6 +207,7 @@ &-scrollbar-right-top { background-color: rgba(0, 0, 0, 0); border: none; + display: none; // background-color: map-deep-get( // $config, // #{$theme}, @@ -221,12 +234,13 @@ width: $scrollbar-width !important; height: $scrollbar-width !important; // display: none !important; - border-color: map-deep-get($config, #{$theme}, "scrollbar-track"); - background-color: map-deep-get($config, #{$theme}, "scrollbar-track"); + border-color: map-deep-get($config, #{$theme}, "cardBackground"); + background-color: map-deep-get($config, #{$theme}, "cardBackground"); // border: none !important; // bottom: -1px; // right: -2px; box-sizing: border-box; + // display: none; } &-scrollbar-frozen-border, @@ -236,13 +250,9 @@ border-color: transparent !important; } - // &-body-area { - // overflow: auto !important; - // } - + &-body-area, &-container, &-layer-state, - &-body-area, &-summary-area, &-cell { background-color: map-deep-get($config, @@ -277,8 +287,8 @@ top: 50%; left: 50%; transform: translate(-50%, -50%); - height: 11px; - width: 11px; + height: 8px; + width: 8px; border-radius: 50%; background-color: map-deep-get($config, #{$theme}, @@ -315,8 +325,8 @@ &-header-area, &-cell-header { // font-family: inherit; + // font-style: Semi Bold; font-weight: 600; - font-style: Semi Bold; background-color: map-deep-get($config, #{$theme}, "tui-grid-header-backgroundColor" @@ -333,8 +343,13 @@ } &-header-area { - background-color: none; + // background-color: none; border: none; + margin-right: 0 !important; + background-color: map-deep-get($config, + #{$theme}, + "tui-grid-cell-backgroundColor" + ); } &-row-odd, diff --git a/assets/scss/common/input.scss b/assets/scss/common/input.scss index 659effe..0dd59ab 100644 --- a/assets/scss/common/input.scss +++ b/assets/scss/common/input.scss @@ -171,8 +171,8 @@ align-items: center; cursor: pointer; position: relative; - padding-left: 28px; - margin: 10px; + padding-left: 0; + margin: 5px; font-size: 16px; } .custom-radio input[type="radio"] { @@ -183,13 +183,13 @@ /* Custom radio appearance */ .radio-mark { position: absolute; - left: 0; + left: -8px; top: 50%; transform: translateY(-50%); - height: 18px; - width: 18px; + height: 14px; + width: 14px; // background-color: white; - border: 2px solid #ccc; + border: 1px solid #ccc; border-radius: 50%; transition: all 0.2s ease; } diff --git a/assets/scss/var.scss b/assets/scss/var.scss index 6181b26..8357c06 100644 --- a/assets/scss/var.scss +++ b/assets/scss/var.scss @@ -32,8 +32,8 @@ $color: ( "black": ("0": #000, "1": #111), "white": ("0": #fff), - "week": ("sun": #fb5a83, - "sat": #2d8cf6) + "week": ("sun": #FF4D4F, + "sat": #597EF7) ); $config: ( @@ -96,17 +96,19 @@ $config: ( v-input-disabled-backgroundColor:rgba(255, 255, 255, 0.08), v-input-disabled-color: rgba(255, 255, 255, 0.5), v-select-label-color: rgba(255, 255, 255, 0.85), - v-calendar-weekday-backgroundColor: #383f5d, - v-calendar-weekday-color: #fff, - v-calendar-weekday-border-color: rgba(255, 255, 255, 0.1), - v-calendar-day-color: #fff, - v-calendar-day-in-not-month-color: rgba(255, 255, 255, 0.05), - v-calendar-is-today-background-color: #2d4571, + v-calendar-weekday-backgroundColor: #FFFFFF0A, + v-calendar-weekday-color: #FFFFFFD9, + v-calendar-weekday-border-color: #FFFFFF0F, + v-calendar-day-color: #FFFFFFD9, + v-calendar-day-in-not-month-color: #FFFFFF14, + v-calendar-is-today-background-color: #0A224F, + v-calendar-is-sat: #263EA0, + v-calendar-is-sun:#A61D24, tui-grid-title-color: #FFFFFFD9, tui-grid-header-backgroundColor: #2a2b2d, tui-grid-header-color: #FFFFFFD9, tui-grid-border-horziontal-color: #212224, - tui-grid-border-vertical-color: #212224, + tui-grid-border-vertical-color: #FFFFFF0F, tui-grid-cell-backgroundColor: #212224, tui-grid-cell-color: #fff, tui-grid-cell-insert-color: #13636c, @@ -236,12 +238,14 @@ $config: ( v-input-disabled-backgroundColor: rgba(0, 0, 0, 0.04), v-input-disabled-color: rgba(0, 0, 0, 0.25), v-select-label-color: rgba(0, 0, 0, 0.88), - v-calendar-weekday-backgroundColor: #e0e0e0, - v-calendar-weekday-color: #111, - v-calendar-weekday-border-color: #d4d4d4, - v-calendar-day-color: #111, - v-calendar-day-in-not-month-color: #f8f8f8, - v-calendar-is-today-background-color: #e3eaf3, + v-calendar-weekday-backgroundColor: #00000005, + v-calendar-weekday-color: #000000E0, + v-calendar-weekday-border-color: #0000000F, + v-calendar-day-color: #000000E0, + v-calendar-day-in-not-month-color: #0000000A, + v-calendar-is-today-background-color: #E6F4FF, + v-calendar-is-sat: #597EF7, + v-calendar-is-sun:#FF4D4F, tui-grid-title-color: #000000E0, tui-grid-header-backgroundColor: #fafafa, //#e0e0e0, tui-grid-header-color: rgba(0, 0, 0, 0.88), diff --git a/components/common/Calendar.vue b/components/common/Calendar.vue index 9c0f096..00681b4 100644 --- a/components/common/Calendar.vue +++ b/components/common/Calendar.vue @@ -3,45 +3,28 @@
+
{{ attr.customData.planTitle }}