diff --git a/public/assets/images/common/btn_arr_up.svg b/public/assets/images/common/btn_arr_up.svg deleted file mode 100644 index b90389f..0000000 --- a/public/assets/images/common/btn_arr_up.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/src/components/ui/common/Spinner.tsx b/src/components/ui/common/Spinner.tsx new file mode 100644 index 0000000..4a2aa38 --- /dev/null +++ b/src/components/ui/common/Spinner.tsx @@ -0,0 +1,7 @@ +export default function Spinner() { + return ( +
+ +
+ ) +} diff --git a/src/styles/base/_button.scss b/src/styles/base/_button.scss index b4d61a4..c6d11ad 100644 --- a/src/styles/base/_button.scss +++ b/src/styles/base/_button.scss @@ -49,14 +49,6 @@ background-size: cover; margin-left: 12px; } - .btn-arr-up{ - display: block; - width: 10px; - height: 6px; - background: url(/assets/images/common/btn_arr_up.svg)no-repeat center; - background-size: cover; - margin-left: 12px; - } .btn-edit{ display: block; width: 10px; diff --git a/src/styles/base/_check-radio.scss b/src/styles/base/_check-radio.scss index 47c50cb..f6ff573 100644 --- a/src/styles/base/_check-radio.scss +++ b/src/styles/base/_check-radio.scss @@ -201,7 +201,7 @@ } } input:checked + .slider { - background-color: #A8B6C7; + background-color: #0081b5; &:after { content: ''; left: 10px; diff --git a/src/styles/components/_index.scss b/src/styles/components/_index.scss index 4ebdd02..3ae03f1 100644 --- a/src/styles/components/_index.scss +++ b/src/styles/components/_index.scss @@ -1,4 +1,6 @@ @forward 'main'; @forward 'login'; @forward 'pop-contents'; -@forward 'sub'; \ No newline at end of file +@forward 'sub'; +@forward 'pdfview'; +@forward 'spinner'; \ No newline at end of file diff --git a/src/styles/components/_pdfview.scss b/src/styles/components/_pdfview.scss new file mode 100644 index 0000000..8db6cf7 --- /dev/null +++ b/src/styles/components/_pdfview.scss @@ -0,0 +1,57 @@ +@use "../abstracts" as *; + +.pdf-contents{ + padding: 0 20px; + border-top: 1px solid #ececec; +} +.pdf-cont-head{ + align-items: center; + padding: 24px 0 15px; + border-bottom: 2px solid $black-1010; + .pdf-cont-head-tit{ + @include defaultFont($font-s-16, $font-w-600, $black-1010); + margin-bottom: 10px; + } +} +.pdf-cont-head-data-wrap{ + @include flex(20px); + align-items: center; + .pdf-cont-head-data-tit{ + @include defaultFont($font-s-13, $font-w-500, $black-1010); + } + .pdf-cont-head-data{ + @include defaultFont($font-s-13, $font-w-400, #FF5656); + } +} +.pdf-cont-body{ + padding: 24px 0 0; +} +.pdf-data-tit{ + @include defaultFont($font-s-13, $font-w-500, $black-1010); + margin-bottom: 5px; +} +.pdf-table{ + margin-bottom: 24px; + table{ + width: 100%; + table-layout: fixed; + border-collapse: collapse; + th{ + padding: 9.5px; + @include defaultFont($font-s-11, $font-w-500, $black-1010); + border: 1px solid #2E3A59; + background-color: #F5F6FA; + } + td{ + padding: 9.5px; + @include defaultFont($font-s-11, $font-w-400, #FF5656); + border: 1px solid #2E3A59; + } + } +} +.pdf-textarea-data{ + padding: 10px; + @include defaultFont($font-s-11, $font-w-400, #FF5656); + border: 1px solid $black-1010; + min-height: 150px; +} \ No newline at end of file diff --git a/src/styles/components/_pop-contents.scss b/src/styles/components/_pop-contents.scss index f0f18d5..b598397 100644 --- a/src/styles/components/_pop-contents.scss +++ b/src/styles/components/_pop-contents.scss @@ -103,16 +103,12 @@ @include defaultFont($font-s-13, $font-w-400, $font-c); } .pop-data-table-footer{ - @include flex(0px); .pop-data-table-footer-unit{ - flex: 1; padding: 10px; @include defaultFont($font-s-13, $font-w-500, $font-c); - border-right: 1px solid #2E3A59; + border-bottom: 1px solid #2E3A59; } .pop-data-table-footer-data{ - flex: none; - width: 104px; padding: 10px; @include defaultFont($font-s-13, $font-w-400, $font-c); } diff --git a/src/styles/components/_spinner.scss b/src/styles/components/_spinner.scss new file mode 100644 index 0000000..f37f12d --- /dev/null +++ b/src/styles/components/_spinner.scss @@ -0,0 +1,37 @@ +.spinner-wrap{ + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + background-color: rgba($color: #101010, $alpha: 0.5); + z-index: 2000000; +} +.loader { + width: 16px; + height: 16px; + border-radius: 50%; + background-color: #fff; + box-shadow: 32px 0 #fff, -32px 0 #fff; + position: relative; + animation: flash 0.5s ease-out infinite alternate; +} + +@keyframes flash { + 0% { + background-color: #FFF2; + box-shadow: 32px 0 #FFF2, -32px 0 #FFF; + } + 50% { + background-color: #FFF; + box-shadow: 32px 0 #FFF2, -32px 0 #FFF2; + } + 100% { + background-color: #FFF2; + box-shadow: 32px 0 #FFF, -32px 0 #FFF2; + } +} + \ No newline at end of file