diff --git a/src/App.vue b/src/App.vue index 7e633f0..fd8aa41 100644 --- a/src/App.vue +++ b/src/App.vue @@ -8,5 +8,4 @@ diff --git a/src/assets/css/color.scss b/src/assets/css/color.scss deleted file mode 100644 index d14a1ce..0000000 --- a/src/assets/css/color.scss +++ /dev/null @@ -1,16 +0,0 @@ -$theme-primary: #764CF6; -$theme-darker: #C1B2E5; -$theme-dark: #DFD7F2; -$basic-white: #FFFFFF; -$basic-black: #000000; - -$text-disabled: #C3C3C3; -$text-basic: #939393; -$text-theme: #6D5C9C; - -$border-theme: #C1B2E5; - -$input-bg: #777777; - -$btn-primary: #774FF6; -$btn-basic: #EEEAF7; \ No newline at end of file diff --git a/src/assets/css/common.scss b/src/assets/css/common.scss deleted file mode 100644 index 29d6974..0000000 --- a/src/assets/css/common.scss +++ /dev/null @@ -1,46 +0,0 @@ -@import "color.scss"; - -.ant-btn:active, -.ant-btn:hover, -.ant-btn:focus { - border-color: $theme-primary; -} - -.btnt { - text-align: center; - line-height: 30px; - padding: 0; - margin: 0 10px; - border-radius: 20px; -} -.basic-btn { - background: $btn-basic; - color: $btn-primary; - @extend .btnt; -} -.primary-btn { - background: $btn-primary; - color: $basic-white; - @extend .btnt; -} - -.border-btm { - border-bottom: 1px solid #707070; -} -.border-707070 { - border: 1px solid #707070; -} -.border-btm-dark { - border-bottom: 1px solid #dfd7f2; -} - -.theme-color { - color: $theme-primary; -} -.border-btm-darker { - border-bottom: 1px solid $theme-darker; -} - -.theme-color { - color: $theme-primary; -} diff --git a/src/assets/css/coverantdv.css b/src/assets/css/coverantdv.css deleted file mode 100644 index 7fd3c54..0000000 --- a/src/assets/css/coverantdv.css +++ /dev/null @@ -1,122 +0,0 @@ -/* 重写antdv组件样式 */ -/* 尽量在自定义class下覆盖原组件样式,避免影响其他人定义的样式 */ -.bg-grey .ant-input { - background: #777777 !important; - color: #fff -} - -.ant-btn-primary { - /* background: #5665D8 !important; */ - background: #764CF6 !important; - border: none !important; -} - -.ant-btn-origin { - color: #fff !important; - background: #f0933c !important; -} - -.ant-btn-grey { - background: #777777 !important; - color: #fff !important; -} - -/* 自动 */ -.ant-btn-370D9B { - background: #370D9B !important; - color: #fff !important; -} - -/* 上架 */ -.ant-btn-764CF6 { - background: #764CF6 !important; - color: #fff !important; -} - -/* 下架 */ -.ant-btn-FF5C62 { - background: #FF5C62 !important; - color: #fff !important; -} - -/* 已下架 */ -.ant-btn-646364 { - background: #646364 !important; - color: #fff !important; -} - -/* 取消 */ -.ant-btn-C1B2E5 { - background: #C1B2E5 !important; - color: #fff !important; -} - -.fl-table .ant-table-thead .ant-table-cell { - background-color: #DFD7F2 !important; -} - -.fl-table { - box-shadow: 3px 3px 3px #DFD7F2; - border-radius: 20px; - overflow: hidden; - color: #000000; -} - -/* .fl-table td, -.fl-table th { - border-right: none !important -} */ - -/* .ant-layout { - min-width: 800px -} */ - -/* .ant-layout-content { - margin: 0px 0px 0px 20px !important; -} */ -.ant-layout-content { - min-width: 1366px !important; -} - -.fl-modal-artwork .ant-modal-content { - background: none !important; - box-shadow: none !important -} - -.fl-sf-modal .ant-modal-content { - border-radius: 20px; -} - -.fl-sf-modal .ant-modal-body { - padding: 0; -} - -.resize-textarea textarea { - resize: none -} - -.resize-textarea { - resize: none -} - -.sf-full-modal .ant-modal { - max-width: 100%; - top: 0; - padding-bottom: 0; - margin: 0; - width: 100% !important -} - -.sf-full-modal .ant-modal-content { - display: flex; - flex-direction: column; - height: 100vh; -} - -.sf-full-modal .ant-modal-body { - flex: 1; -} - -.ant-input-disabled { - color: rgba(0, 0, 0) !important; -} \ No newline at end of file diff --git a/src/assets/css/icon.css b/src/assets/css/icon.css deleted file mode 100644 index 3877b2e..0000000 --- a/src/assets/css/icon.css +++ /dev/null @@ -1,23 +0,0 @@ -/* fallback */ -@font-face { - font-family: 'Material Icons'; - font-style: normal; - font-weight: 400; - src: url(https://fonts.gstatic.com/s/materialicons/v135/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2'); -} - -.material-icons { - font-family: 'Material Icons'; - font-weight: normal; - font-style: normal; - font-size: 24px; - line-height: 1; - letter-spacing: normal; - text-transform: none; - display: inline-block; - white-space: nowrap; - word-wrap: normal; - direction: ltr; - -webkit-font-feature-settings: 'liga'; - -webkit-font-smoothing: antialiased; -} \ No newline at end of file diff --git a/src/assets/css/main.css b/src/assets/css/main.css deleted file mode 100644 index 093dadd..0000000 --- a/src/assets/css/main.css +++ /dev/null @@ -1,40 +0,0 @@ -* { - margin: 0; - padding: 0; -} - -html, -body { - width: 100%; - height: 100%; - overflow: inherit; -} - -#app { - font-family: '苹方-简'; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - /* text-align: center; */ - color: #2c3e50; - font-size: 14px; - font-weight: Regular; -} - -.content { - width: auto; - height: 100%; - padding: 10px; - overflow-y: scroll; - box-sizing: border-box; -} - -@import "./sfcommon.css"; -@import "./sfform.css"; -@import "./sftable.css"; -@import "./sfstatus.css"; -@import "./sffont.css"; -@import "./sfstatic.css"; -@import "./coverantdv.css"; -@import "./sfanimate.css"; -@import "./icon.css"; -@import "./sfcard.css"; diff --git a/src/assets/css/modal.scss b/src/assets/css/modal.scss deleted file mode 100644 index 8553f3a..0000000 --- a/src/assets/css/modal.scss +++ /dev/null @@ -1,20 +0,0 @@ -.my-modal { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - width: 100%; - height: 100%; - z-index: 10; - background: rgba(0, 0, 0, 0.6); - padding: 10px 105px 32px 67px; - .modal-dialog { - height: 908px; - } -} -.artwork-modal-content { - max-height: 650px; - min-height: 600px; - overflow: auto; -} diff --git a/src/assets/css/sfanimate.css b/src/assets/css/sfanimate.css deleted file mode 100644 index b5d6bb9..0000000 --- a/src/assets/css/sfanimate.css +++ /dev/null @@ -1,116 +0,0 @@ -.stack--slamet .stack__item--reject { - -webkit-animation: slametReject 0.5s forwards; - animation: slametReject 0.5s forwards; -} - -@-webkit-keyframes slametReject { - to { - opacity: 0; - -webkit-transform: translate3d(0, 200px, 0); - transform: translate3d(0, 200px, 0); - } -} - -@keyframes slametReject { - to { - opacity: 0; - -webkit-transform: translate3d(0, 200px, 0); - transform: translate3d(0, 200px, 0); - } -} - -.stack--slamet .stack__item--accept { - -webkit-animation: slametAccept 0.6s forwards; - animation: slametAccept 0.6s forwards; - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; -} - -@-webkit-keyframes slametAccept { - 40% { - -webkit-animation-timing-function: cubic-bezier(0.4, 1, 0.3, 1); - animation-timing-function: cubic-bezier(0.4, 1, 0.3, 1); - -webkit-transform: translate3d(0, 20%, 0) scale3d(1.1, 1.1, 1); - transform: translate3d(0, 20%, 0) scale3d(1.1, 1.1, 1); - } - 80% { - opacity: 1; - -webkit-transform: translate3d(0, -280px, 0) scale3d(0.1, 0.1, 1); - transform: translate3d(0, -280px, 0) scale3d(0.1, 0.1, 1); - } - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -250px, 0) scale3d(0.05, 0.05, 1); - transform: translate3d(0, -250px, 0) scale3d(0.05, 0.05, 1); - } -} - -@keyframes slametAccept { - 40% { - -webkit-animation-timing-function: cubic-bezier(0.4, 1, 0.3, 1); - animation-timing-function: cubic-bezier(0.4, 1, 0.3, 1); - -webkit-transform: translate3d(0, 20%, 0) scale3d(1.1, 1.1, 1); - transform: translate3d(0, 20%, 0) scale3d(1.1, 1.1, 1); - } - 80% { - opacity: 1; - -webkit-transform: translate3d(0, -280px, 0) scale3d(0.1, 0.1, 1); - transform: translate3d(0, -280px, 0) scale3d(0.1, 0.1, 1); - } - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -250px, 0) scale3d(0.05, 0.05, 1); - transform: translate3d(0, -250px, 0) scale3d(0.05, 0.05, 1); - } -} - -.stack--slamet .stack__item--last { - -webkit-animation: slametLast 0.5s forwards; - animation: slametLast 0.5s forwards; - -webkit-transform-origin: 0% 100%; - transform-origin: 0% 100%; -} - -@-webkit-keyframes slametLast { - to { - -webkit-transform: translate3d(-150px, 0, 0) scale3d(0.7, 0.7, 1) - rotate3d(0, 1, 1, -90deg); - transform: translate3d(-150px, 0, 0) scale3d(1, 0.7, 0.7) - rotate3d(0, 1, 0, -90deg); - } -} - -@keyframes slametLast { - to { - -webkit-transform: translate3d(-150px, 0, 0) scale3d(0.7, 0.7, 1) - rotate3d(0, 1, 1, -90deg); - transform: translate3d(-150px, 0, 0) scale3d(0.8, 0.8, 0.8) - rotate3d(0, 1, 0, -90deg); - } -} -.stack--slamet .stack__item--next { - -webkit-animation: slametNext 0.5s forwards; - animation: slametNext 0.5s forwards; - -webkit-transform-origin: 100% 50%; - transform-origin: 100% 50%; -} - -@-webkit-keyframes slametNext { - to { - opacity: 0; - -webkit-transform: translate3d(150px, 0, 0) scale3d(0.7, 0.7, 1) - rotate3d(0, 1, 0, 90deg); - transform: translate3d(150px, 0, 0) scale3d(0.7, 0.7, 1) - rotate3d(0, 1, 0, 90deg); - } -} - -@keyframes slametNext { - to { - opacity: 0; - -webkit-transform: translate3d(150px, 0, 0) scale3d(0.7, 0.7, 1) - rotate3d(0, 1, 0, 90deg); - transform: translate3d(150px, 0, 0) scale3d(0.7, 0.7, 1) - rotate3d(0, 1, 0, 90deg); - } -} diff --git a/src/assets/css/sfcard.css b/src/assets/css/sfcard.css deleted file mode 100644 index a56d8d3..0000000 --- a/src/assets/css/sfcard.css +++ /dev/null @@ -1,7 +0,0 @@ -.fl-card { - border-radius: 16px; - background-color: #fff; - padding: 16px; - box-shadow: 0 1px 2px -2px rgb(0 0 0 / 20%), - 0 2px 2px 0px rgb(0 0 0 / 14%), 0 1px 0px 1px rgb(0 0 0 / 12%); -} \ No newline at end of file diff --git a/src/assets/css/sfcommon.css b/src/assets/css/sfcommon.css deleted file mode 100644 index 46721af..0000000 --- a/src/assets/css/sfcommon.css +++ /dev/null @@ -1,504 +0,0 @@ -.cursor { - cursor: pointer; -} - -.fl-page-width { - max-width: 1200px; - margin: auto; -} - -.flex { - display: flex; -} - -.align-center { - align-items: center; -} - -.flex-wrap { - flex-wrap: wrap; -} - -.column { - flex-direction: column; -} - -.items-start { - align-items: flex-start !important; -} - -.items-center { - align-items: center; -} - -.content-start { - align-content: flex-start !important; -} - -.content-center { - align-items: center; -} - -.justify-between { - justify-content: space-between; -} - -.justify-around { - justify-content: space-around; -} - -.justify-end { - justify-content: flex-end; -} - -.justify-center { - justify-content: center; -} - -.relative { - position: relative; -} - -.absolute { - position: absolute; -} - -.text-center { - text-align: center !important; -} - -.text-right { - text-align: right !important; -} - -.text-left { - text-align: left !important; -} - -.no-link { - text-decoration: none; -} - -.sf-link { - color: #409eff; - cursor: pointer; - text-decoration: none; -} - -.title { - font-size: 16px; - /* font-weight: bold; */ - color: #b8bac9; - margin: 10px 0; -} - -.sf-text-ellipsis { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.overflow-auto { - overflow: auto; -} - -.overflow-hidden { - overflow: hidden; -} - -.width-100 { - width: 100%; -} - -.height-100 { - height: 100%; -} - -.maxH-100 { - max-height: 100%; -} - -.display-none { - display: none; -} - -.fl-pa-sm { - padding: 8px !important; -} - -.fl-pb-xs { - padding-bottom: 4px !important; -} - -.fl-pa-xs { - padding: 4px !important; -} - -.fl-py-xs { - padding-top: 4px !important; - padding-bottom: 4px !important; -} - -.m-auto { - margin: auto -} - -.fl-mx-xs { - margin-left: 4px !important; - margin-right: 4px !important; -} - -.fl-my-xs { - margin-top: 4px !important; - margin-bottom: 4px !important; -} - -.fl-ml-xs { - margin-left: 4px !important; -} - -.fl-mt-xs { - margin-top: 4px !important; -} - -.fl-pt-xs { - padding-top: 4px !important; -} - -.fl-pl-xs { - padding-left: 4px !important; -} - -.fl-pl-sm { - padding-left: 8px !important; -} - -.fl-pr-sm { - padding-right: 8px !important; -} - -.fl-pt-sm { - padding-top: 8px !important; -} - -.fl-pb-sm { - padding-bottom: 8px !important; -} - -.fl-px-sm { - padding-left: 8px !important; - padding-right: 8px !important; -} - -.fl-px-xs { - padding-left: 4px !important; - padding-right: 4px !important; -} - -.fl-py-sm { - padding-top: 8px !important; - padding-bottom: 8px !important; -} - -.fl-pa-md { - padding: 16px !important; -} - -.fl-pl-md { - padding-left: 16px !important; -} - -.fl-pr-md { - padding-right: 16px !important; -} - -.fl-pt-md { - padding-top: 16px !important; -} - -.fl-pb-md { - padding-bottom: 16px !important; -} - -.fl-px-md { - padding-left: 16px !important; - padding-right: 16px !important; -} - -.fl-py-md { - padding-top: 16px !important; - padding-bottom: 16px !important; -} - -.fl-pa-lg { - padding: 24px !important; -} - -.fl-pl-lg { - padding-left: 24px !important; -} - -.fl-pr-lg { - padding-right: 24px !important; -} - -.fl-pt-lg { - padding-top: 24px !important; -} - -.fl-pb-lg { - padding-bottom: 24px !important; -} - -.fl-px-lg { - padding-left: 24px !important; - padding-right: 24px !important; -} - -.fl-py-lg { - padding-top: 24px !important; - padding-bottom: 24px !important; -} - -.fl-ma-sm { - margin: 8px !important; -} - -.fl-ma-xs { - margin: 4px !important; -} - -.fl-ml-sm { - margin-left: 8px !important; -} - -.fl-mr-sm { - margin-right: 8px !important; -} - -.fl-mt-sm { - margin-top: 8px !important; -} - -.fl-mb-xs { - margin-bottom: 4px !important; -} - -.fl-mb-sm { - margin-bottom: 8px !important; -} - -.fl-mx-sm { - margin-left: 8px !important; - margin-right: 8px !important; -} - -.fl-my-sm { - margin-top: 8px !important; - margin-bottom: 8px !important; -} - -.fl-ma-md { - margin: 16px !important; -} - -.fl-ml-md { - margin-left: 16px !important; -} - -.fl-mr-md { - margin-right: 16px !important; -} - -.fl-mt-md { - margin-top: 16px !important; -} - - -.fl-mb-md { - margin-bottom: 16px !important; -} - -.fl-mx-md { - margin-left: 16px !important; - margin-right: 16px !important; -} - -.fl-my-md { - margin-top: 16px !important; - margin-bottom: 16px !important; -} - -.fl-ma-lg { - margin: 24px !important; -} - -.fl-ml-lg { - margin-left: 24px !important; -} - -.fl-mr-lg { - margin-right: 24px !important; -} - -.fl-mt-lg { - margin-top: 24px !important; -} - -.fl-mb-lg { - margin-bottom: 24px !important; -} - -.fl-mx-lg { - margin-left: 24px !important; - margin-right: 24px !important; -} - -.fl-my-lg { - margin-top: 24px !important; - margin-bottom: 24px !important; -} - -.border-box { - box-sizing: border-box; -} - -.border-dashed { - border: 2px dashed rgba(145, 148, 99, 0.6); - border-radius: 5px -} - -.box-content { - box-sizing: content-box; -} - -.box-border { - box-sizing: border-box; -} - -* ::-webkit-scrollbar { - width: 10px; - height: 10px; -} - -* ::-webkit-scrollbar-track { - border-radius: 3px; - background: rgba(0, 0, 0, 0.06); - -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.08); -} - -* ::-webkit-scrollbar-thumb { - border-radius: 3px; - background: rgba(0, 0, 0, 0.12); - -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2); -} - -.link-area { - display: flex; - align-items: center; - color: #409eff; -} - -.bg-white { - background: #ffffff !important; -} - -.bg-grey { - background: #777777 !important; -} - -.bg-grey-1 { - background: #b4b0b0 !important; -} - -.bg-black { - background: #000 !important; -} - -.bg-764CF6 { - background: #764CF6 !important; -} - -.bg-370D9B { - background: #370D9B !important; -} - -.bg-b2b2c6 { - background: #b2b2c6 -} - -.bg-fff { - background-color: #fff !important; -} - -.bg-primary { - /* background-color: #3aace8 !important; */ - background-color: #764CF6 !important; -} - -.bg-danger { - background-color: #ef136e -} - -.color-white { - color: #fff !important; -} - -.color-danger { - color: #ef136e !important; -} - -.color-primary { - color: #3aace8 !important; -} - -.color-764CF6 { - color: #764CF6 !important; -} - -.color-info { - color: #4ed80e !important; -} - -.color-draft { - color: #b0bce0 !important; -} - -.color-yellow { - color: orange !important; -} - -.color-black { - color: #000 !important; -} - -.color-grey { - color: rgb(163, 156, 156) !important; -} - -.index-container { - padding: 20px 30px 0 30px; - background: #fff; - border-radius: 5px; -} - -.no-radius { - border-radius: none; -} - -.no-shadow { - box-shadow: none; -} - -.no-margin { - margin: none; -} - -.no-padding { - padding: none; -} - -.border-1 { - /* border: 1px solid rgb(65, 62, 62) */ - border: 1px solid #E3DFEA; -} \ No newline at end of file diff --git a/src/assets/css/sffont.css b/src/assets/css/sffont.css deleted file mode 100644 index 6f25686..0000000 --- a/src/assets/css/sffont.css +++ /dev/null @@ -1,39 +0,0 @@ -.title-h1 { - font-size: 20px; - font-weight: bolder; - line-height: 1.19; - letter-spacing: 0.02em; -} - -.subtitle-14 { - font-size: 14px; - line-height: 20px; - color: #999; - letter-spacing: 0.02em; -} - -.line-height-20 { - line-height: 20px; -} - -.font-14 { - font-size: 14px; -} - -.font-12 { - font-size: 12px; -} - -.font-16 { - font-size: 16px; -} - -.font-18 { - font-size: 18px; -} - -.fl-text-ellipsis { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} \ No newline at end of file diff --git a/src/assets/css/sfform.css b/src/assets/css/sfform.css deleted file mode 100644 index 2e9286f..0000000 --- a/src/assets/css/sfform.css +++ /dev/null @@ -1,1218 +0,0 @@ -.container { - padding: 30px; - background: #fff; - border: 1px solid #ddd; - border-radius: 5px; -} - -.border-radius-4 { - border-radius: 4px !important -} - -.border-radius-8 { - border-radius: 8px !important -} - -.border-radius-16 { - border-radius: 16px !important -} - -.flex, -.row { - display: flex; - flex-wrap: wrap; -} - -@media (min-width: 0) { - - .flex>.col, - .flex>.col-0, - .flex>.col-1, - .flex>.col-2, - .flex>.col-3, - .flex>.col-4, - .flex>.col-5, - .flex>.col-6, - .flex>.col-7, - .flex>.col-8, - .flex>.col-9, - .flex>.col-10, - .flex>.col-11, - .flex>.col-12, - .flex>.col-auto, - .flex>.col-grow, - .flex>.col-shrink, - .flex>.col-xs, - .flex>.col-xs-0, - .flex>.col-xs-1, - .flex>.col-xs-2, - .flex>.col-xs-3, - .flex>.col-xs-4, - .flex>.col-xs-5, - .flex>.col-xs-6, - .flex>.col-xs-7, - .flex>.col-xs-8, - .flex>.col-xs-9, - .flex>.col-xs-10, - .flex>.col-xs-11, - .flex>.col-xs-12, - .flex>.col-xs-auto, - .flex>.col-xs-grow, - .flex>.col-xs-shrink, - .row>.col, - .row>.col-0, - .row>.col-1, - .row>.col-2, - .row>.col-3, - .row>.col-4, - .row>.col-5, - .row>.col-6, - .row>.col-7, - .row>.col-8, - .row>.col-9, - .row>.col-10, - .row>.col-11, - .row>.col-12, - .row>.col-auto, - .row>.col-grow, - .row>.col-shrink, - .row>.col-xs, - .row>.col-xs-0, - .row>.col-xs-1, - .row>.col-xs-2, - .row>.col-xs-3, - .row>.col-xs-4, - .row>.col-xs-5, - .row>.col-xs-6, - .row>.col-xs-7, - .row>.col-xs-8, - .row>.col-xs-9, - .row>.col-xs-10, - .row>.col-xs-11, - .row>.col-xs-12, - .row>.col-xs-auto, - .row>.col-xs-grow, - .row>.col-xs-shrink { - width: auto; - min-width: 0; - max-width: 100%; - } - - .flex>.col, - .flex>.col-0, - .flex>.col-1, - .flex>.col-2, - .flex>.col-3, - .flex>.col-4, - .flex>.col-5, - .flex>.col-6, - .flex>.col-7, - .flex>.col-8, - .flex>.col-9, - .flex>.col-10, - .flex>.col-11, - .flex>.col-12, - .flex>.col-auto, - .flex>.col-grow, - .flex>.col-shrink, - .flex>.col-xs, - .flex>.col-xs-0, - .flex>.col-xs-1, - .flex>.col-xs-2, - .flex>.col-xs-3, - .flex>.col-xs-4, - .flex>.col-xs-5, - .flex>.col-xs-6, - .flex>.col-xs-7, - .flex>.col-xs-8, - .flex>.col-xs-9, - .flex>.col-xs-10, - .flex>.col-xs-11, - .flex>.col-xs-12, - .flex>.col-xs-auto, - .flex>.col-xs-grow, - .flex>.col-xs-shrink { - height: auto; - min-height: 0; - max-height: 100%; - } - - .col, - .col-xs { - flex: 10000 1 0%; - } - - .col-0, - .col-1, - .col-2, - .col-3, - .col-4, - .col-5, - .col-6, - .col-7, - .col-8, - .col-9, - .col-10, - .col-11, - .col-12, - .col-auto, - .col-xs-0, - .col-xs-1, - .col-xs-2, - .col-xs-3, - .col-xs-4, - .col-xs-5, - .col-xs-6, - .col-xs-7, - .col-xs-8, - .col-xs-9, - .col-xs-10, - .col-xs-11, - .col-xs-12, - .col-xs-auto { - flex: 0 0 auto; - } - - .col-grow, - .col-xs-grow { - flex: 1 0 auto; - } - - .col-shrink, - .col-xs-shrink { - flex: 0 1 auto; - } - - .row>.col-0, - .row>.col-xs-0 { - height: auto; - width: 0%; - } - - .row>.offset-0, - .row>.offset-xs-0 { - margin-left: 0%; - } - - .row>.col-1, - .row>.col-xs-1 { - height: auto; - width: 8.3333%; - } - - .row>.offset-1, - .row>.offset-xs-1 { - margin-left: 8.3333%; - } - - .row>.col-2, - .row>.col-xs-2 { - height: auto; - width: 16.6667%; - } - - .row>.offset-2, - .row>.offset-xs-2 { - margin-left: 16.6667%; - } - - .row>.col-3, - .row>.col-xs-3 { - height: auto; - width: 25% !important; - } - - .row>.offset-3, - .row>.offset-xs-3 { - margin-left: 25%; - } - - .row>.col-4, - .row>.col-xs-4 { - height: auto; - width: 33.3333%; - } - - .row>.offset-4, - .row>.offset-xs-4 { - margin-left: 33.3333%; - } - - .row>.col-5, - .row>.col-xs-5 { - height: auto; - width: 41.6667%; - } - - .row>.offset-5, - .row>.offset-xs-5 { - margin-left: 41.6667%; - } - - .row>.col-6, - .row>.col-xs-6 { - height: auto; - width: 50%; - } - - .row>.offset-6, - .row>.offset-xs-6 { - margin-left: 50%; - } - - .row>.col-7, - .row>.col-xs-7 { - height: auto; - width: 58.3333%; - } - - .row>.offset-7, - .row>.offset-xs-7 { - margin-left: 58.3333%; - } - - .row>.col-8, - .row>.col-xs-8 { - height: auto; - width: 66.6667%; - } - - .row>.offset-8, - .row>.offset-xs-8 { - margin-left: 66.6667%; - } - - .row>.col-9, - .row>.col-xs-9 { - height: auto; - width: 75%; - } - - .row>.offset-9, - .row>.offset-xs-9 { - margin-left: 75%; - } - - .row>.col-10, - .row>.col-xs-10 { - height: auto; - width: 83.3333%; - } - - .row>.offset-10, - .row>.offset-xs-10 { - margin-left: 83.3333%; - } - - .row>.col-11, - .row>.col-xs-11 { - height: auto; - width: 91.6667%; - } - - .row>.offset-11, - .row>.offset-xs-11 { - margin-left: 91.6667%; - } - - .row>.col-12, - .row>.col-xs-12 { - height: auto; - width: 100%; - } - - .row>.offset-12, - .row>.offset-xs-12 { - margin-left: 100%; - } - - .row>.col-all { - height: auto; - flex: 0 0 100%; - } -} - -@media (min-width: 600px) { - - .flex>.col-sm, - .flex>.col-sm-0, - .flex>.col-sm-1, - .flex>.col-sm-2, - .flex>.col-sm-3, - .flex>.col-sm-4, - .flex>.col-sm-5, - .flex>.col-sm-6, - .flex>.col-sm-7, - .flex>.col-sm-8, - .flex>.col-sm-9, - .flex>.col-sm-10, - .flex>.col-sm-11, - .flex>.col-sm-12, - .flex>.col-sm-auto, - .flex>.col-sm-grow, - .flex>.col-sm-shrink, - .row>.col-sm, - .row>.col-sm-0, - .row>.col-sm-1, - .row>.col-sm-2, - .row>.col-sm-3, - .row>.col-sm-4, - .row>.col-sm-5, - .row>.col-sm-6, - .row>.col-sm-7, - .row>.col-sm-8, - .row>.col-sm-9, - .row>.col-sm-10, - .row>.col-sm-11, - .row>.col-sm-12, - .row>.col-sm-auto, - .row>.col-sm-grow, - .row>.col-sm-shrink { - width: auto; - min-width: 0; - max-width: 100%; - } - - .flex>.col-sm, - .flex>.col-sm-0, - .flex>.col-sm-1, - .flex>.col-sm-2, - .flex>.col-sm-3, - .flex>.col-sm-4, - .flex>.col-sm-5, - .flex>.col-sm-6, - .flex>.col-sm-7, - .flex>.col-sm-8, - .flex>.col-sm-9, - .flex>.col-sm-10, - .flex>.col-sm-11, - .flex>.col-sm-12, - .flex>.col-sm-auto, - .flex>.col-sm-grow, - .flex>.col-sm-shrink { - height: auto; - min-height: 0; - max-height: 100%; - } - - .col-sm { - flex: 10000 1 0%; - } - - .col-sm-0, - .col-sm-1, - .col-sm-2, - .col-sm-3, - .col-sm-4, - .col-sm-5, - .col-sm-6, - .col-sm-7, - .col-sm-8, - .col-sm-9, - .col-sm-10, - .col-sm-11, - .col-sm-12, - .col-sm-auto { - flex: 0 0 auto; - } - - .col-sm-grow { - flex: 1 0 auto; - } - - .col-sm-shrink { - flex: 0 1 auto; - } - - .row>.col-sm-0 { - height: auto; - width: 0%; - } - - .row>.offset-sm-0 { - margin-left: 0%; - } - - .row>.col-sm-1 { - height: auto; - width: 8.3333%; - } - - .row>.offset-sm-1 { - margin-left: 8.3333%; - } - - .row>.col-sm-2 { - height: auto; - width: 16.6667%; - } - - .row>.offset-sm-2 { - margin-left: 16.6667%; - } - - .row>.col-sm-3 { - height: auto; - width: 25%; - } - - .row>.offset-sm-3 { - margin-left: 25%; - } - - .row>.col-sm-4 { - height: auto; - width: 33.3333%; - } - - .row>.offset-sm-4 { - margin-left: 33.3333%; - } - - .row>.col-sm-5 { - height: auto; - width: 41.6667%; - } - - .row>.offset-sm-5 { - margin-left: 41.6667%; - } - - .row>.col-sm-6 { - height: auto; - width: 50%; - } - - .row>.offset-sm-6 { - margin-left: 50%; - } - - .row>.col-sm-7 { - height: auto; - width: 58.3333%; - } - - .row>.offset-sm-7 { - margin-left: 58.3333%; - } - - .row>.col-sm-8 { - height: auto; - width: 66.6667% !important; - } - - .row>.offset-sm-8 { - margin-left: 66.6667%; - } - - .row>.col-sm-9 { - height: auto; - width: 75%; - } - - .row>.offset-sm-9 { - margin-left: 75%; - } - - .row>.col-sm-10 { - height: auto; - width: 83.3333%; - } - - .row>.offset-sm-10 { - margin-left: 83.3333%; - } - - .row>.col-sm-11 { - height: auto; - width: 91.6667%; - } - - .row>.offset-sm-11 { - margin-left: 91.6667%; - } - - .row>.col-sm-12 { - height: auto; - width: 100%; - } - - .row>.offset-sm-12 { - margin-left: 100%; - } -} - -@media (min-width: 1024px) { - - .flex>.col-md, - .flex>.col-md-0, - .flex>.col-md-1, - .flex>.col-md-2, - .flex>.col-md-3, - .flex>.col-md-4, - .flex>.col-md-5, - .flex>.col-md-6, - .flex>.col-md-7, - .flex>.col-md-8, - .flex>.col-md-9, - .flex>.col-md-10, - .flex>.col-md-11, - .flex>.col-md-12, - .flex>.col-md-auto, - .flex>.col-md-grow, - .flex>.col-md-shrink, - .row>.col-md, - .row>.col-md-0, - .row>.col-md-1, - .row>.col-md-2, - .row>.col-md-3, - .row>.col-md-4, - .row>.col-md-5, - .row>.col-md-6, - .row>.col-md-7, - .row>.col-md-8, - .row>.col-md-9, - .row>.col-md-10, - .row>.col-md-11, - .row>.col-md-12, - .row>.col-md-auto, - .row>.col-md-grow, - .row>.col-md-shrink { - width: auto; - min-width: 0; - max-width: 100%; - } - - .flex>.col-md, - .flex>.col-md-0, - .flex>.col-md-1, - .flex>.col-md-2, - .flex>.col-md-3, - .flex>.col-md-4, - .flex>.col-md-5, - .flex>.col-md-6, - .flex>.col-md-7, - .flex>.col-md-8, - .flex>.col-md-9, - .flex>.col-md-10, - .flex>.col-md-11, - .flex>.col-md-12, - .flex>.col-md-auto, - .flex>.col-md-grow, - .flex>.col-md-shrink { - height: auto; - min-height: 0; - max-height: 100%; - } - - .col-md { - flex: 10000 1 0%; - } - - .col-md-0, - .col-md-1, - .col-md-2, - .col-md-3, - .col-md-4, - .col-md-5, - .col-md-6, - .col-md-7, - .col-md-8, - .col-md-9, - .col-md-10, - .col-md-11, - .col-md-12, - .col-md-auto { - flex: 0 0 auto; - } - - .col-md-grow { - flex: 1 0 auto; - } - - .col-md-shrink { - flex: 0 1 auto; - } - - .row>.col-md-0 { - height: auto; - width: 0%; - } - - .row>.offset-md-0 { - margin-left: 0%; - } - - .row>.col-md-1 { - height: auto; - width: 8.3333%; - } - - .row>.offset-md-1 { - margin-left: 8.3333%; - } - - .row>.col-md-2 { - height: auto; - width: 16.6667%; - } - - .row>.offset-md-2 { - margin-left: 16.6667%; - } - - .row>.col-md-3 { - height: auto; - width: 25%; - } - - .row>.offset-md-3 { - margin-left: 25%; - } - - .row>.col-md-4 { - height: auto; - width: 33.3333%; - } - - .row>.offset-md-4 { - margin-left: 33.3333%; - } - - .row>.col-md-5 { - height: auto; - width: 41.6667%; - } - - .row>.offset-md-5 { - margin-left: 41.6667%; - } - - .row>.col-md-6 { - height: auto; - width: 50%; - } - - .row>.offset-md-6 { - margin-left: 50%; - } - - .row>.col-md-7 { - height: auto; - width: 58.3333%; - } - - .row>.offset-md-7 { - margin-left: 58.3333%; - } - - .row>.col-md-8 { - height: auto; - width: 66.6667%; - } - - .row>.offset-md-8 { - margin-left: 66.6667%; - } - - .row>.col-md-9 { - height: auto; - width: 75%; - } - - .row>.offset-md-9 { - margin-left: 75%; - } - - .row>.col-md-10 { - height: auto; - width: 83.3333%; - } - - .row>.offset-md-10 { - margin-left: 83.3333%; - } - - .row>.col-md-11 { - height: auto; - width: 91.6667%; - } - - .row>.offset-md-11 { - margin-left: 91.6667%; - } - - .row>.col-md-12 { - height: auto; - width: 100%; - } - - .row>.offset-md-12 { - margin-left: 100%; - } -} - -@media (min-width: 1440px) { - - .flex>.col-lg, - .flex>.col-lg-0, - .flex>.col-lg-1, - .flex>.col-lg-2, - .flex>.col-lg-3, - .flex>.col-lg-4, - .flex>.col-lg-5, - .flex>.col-lg-6, - .flex>.col-lg-7, - .flex>.col-lg-8, - .flex>.col-lg-9, - .flex>.col-lg-10, - .flex>.col-lg-11, - .flex>.col-lg-12, - .flex>.col-lg-auto, - .flex>.col-lg-grow, - .flex>.col-lg-shrink, - .row>.col-lg, - .row>.col-lg-0, - .row>.col-lg-1, - .row>.col-lg-2, - .row>.col-lg-3, - .row>.col-lg-4, - .row>.col-lg-5, - .row>.col-lg-6, - .row>.col-lg-7, - .row>.col-lg-8, - .row>.col-lg-9, - .row>.col-lg-10, - .row>.col-lg-11, - .row>.col-lg-12, - .row>.col-lg-auto, - .row>.col-lg-grow, - .row>.col-lg-shrink { - width: auto; - min-width: 0; - max-width: 100%; - } - - .flex>.col-lg, - .flex>.col-lg-0, - .flex>.col-lg-1, - .flex>.col-lg-2, - .flex>.col-lg-3, - .flex>.col-lg-4, - .flex>.col-lg-5, - .flex>.col-lg-6, - .flex>.col-lg-7, - .flex>.col-lg-8, - .flex>.col-lg-9, - .flex>.col-lg-10, - .flex>.col-lg-11, - .flex>.col-lg-12, - .flex>.col-lg-auto, - .flex>.col-lg-grow, - .flex>.col-lg-shrink { - height: auto; - min-height: 0; - max-height: 100%; - } - - .col-lg { - flex: 10000 1 0%; - } - - .col-lg-0, - .col-lg-1, - .col-lg-2, - .col-lg-3, - .col-lg-4, - .col-lg-5, - .col-lg-6, - .col-lg-7, - .col-lg-8, - .col-lg-9, - .col-lg-10, - .col-lg-11, - .col-lg-12, - .col-lg-auto { - flex: 0 0 auto; - } - - .col-lg-grow { - flex: 1 0 auto; - } - - .col-lg-shrink { - flex: 0 1 auto; - } - - .row>.col-lg-0 { - height: auto; - width: 0%; - } - - .row>.offset-lg-0 { - margin-left: 0%; - } - - .row>.col-lg-1 { - height: auto; - width: 8.3333%; - } - - .row>.offset-lg-1 { - margin-left: 8.3333%; - } - - .row>.col-lg-2 { - height: auto; - width: 16.6667%; - } - - .row>.offset-lg-2 { - margin-left: 16.6667%; - } - - .row>.col-lg-3 { - height: auto; - width: 25%; - } - - .row>.offset-lg-3 { - margin-left: 25%; - } - - .row>.col-lg-4 { - height: auto; - width: 33.3333%; - } - - .row>.offset-lg-4 { - margin-left: 33.3333%; - } - - .row>.col-lg-5 { - height: auto; - width: 41.6667%; - } - - .row>.offset-lg-5 { - margin-left: 41.6667%; - } - - .row>.col-lg-6 { - height: auto; - width: 50%; - } - - .row>.offset-lg-6 { - margin-left: 50%; - } - - .row>.col-lg-7 { - height: auto; - width: 58.3333%; - } - - .row>.offset-lg-7 { - margin-left: 58.3333%; - } - - .row>.col-lg-8 { - height: auto; - width: 66.6667%; - } - - .row>.offset-lg-8 { - margin-left: 66.6667%; - } - - .row>.col-lg-9 { - height: auto; - width: 75%; - } - - .row>.offset-lg-9 { - margin-left: 75%; - } - - .row>.col-lg-10 { - height: auto; - width: 83.3333%; - } - - .row>.offset-lg-10 { - margin-left: 83.3333%; - } - - .row>.col-lg-11 { - height: auto; - width: 91.6667%; - } - - .row>.offset-lg-11 { - margin-left: 91.6667%; - } - - .row>.col-lg-12 { - height: auto; - width: 100%; - } - - .row>.offset-lg-12 { - margin-left: 100%; - } -} - -@media (min-width: 1920px) { - - .flex>.col-xl, - .flex>.col-xl-0, - .flex>.col-xl-1, - .flex>.col-xl-2, - .flex>.col-xl-3, - .flex>.col-xl-4, - .flex>.col-xl-5, - .flex>.col-xl-6, - .flex>.col-xl-7, - .flex>.col-xl-8, - .flex>.col-xl-9, - .flex>.col-xl-10, - .flex>.col-xl-11, - .flex>.col-xl-12, - .flex>.col-xl-auto, - .flex>.col-xl-grow, - .flex>.col-xl-shrink, - .row>.col-xl, - .row>.col-xl-0, - .row>.col-xl-1, - .row>.col-xl-2, - .row>.col-xl-3, - .row>.col-xl-4, - .row>.col-xl-5, - .row>.col-xl-6, - .row>.col-xl-7, - .row>.col-xl-8, - .row>.col-xl-9, - .row>.col-xl-10, - .row>.col-xl-11, - .row>.col-xl-12, - .row>.col-xl-auto, - .row>.col-xl-grow, - .row>.col-xl-shrink { - width: auto; - min-width: 0; - max-width: 100%; - } - - .flex>.col-xl, - .flex>.col-xl-0, - .flex>.col-xl-1, - .flex>.col-xl-2, - .flex>.col-xl-3, - .flex>.col-xl-4, - .flex>.col-xl-5, - .flex>.col-xl-6, - .flex>.col-xl-7, - .flex>.col-xl-8, - .flex>.col-xl-9, - .flex>.col-xl-10, - .flex>.col-xl-11, - .flex>.col-xl-12, - .flex>.col-xl-auto, - .flex>.col-xl-grow, - .flex>.col-xl-shrink { - height: auto; - min-height: 0; - max-height: 100%; - } - - .col-xl { - flex: 10000 1 0%; - } - - .col-xl-0, - .col-xl-1, - .col-xl-2, - .col-xl-3, - .col-xl-4, - .col-xl-5, - .col-xl-6, - .col-xl-7, - .col-xl-8, - .col-xl-9, - .col-xl-10, - .col-xl-11, - .col-xl-12, - .col-xl-auto { - flex: 0 0 auto; - } - - .col-xl-grow { - flex: 1 0 auto; - } - - .col-xl-shrink { - flex: 0 1 auto; - } - - .row>.col-xl-0 { - height: auto; - width: 0%; - } - - .row>.offset-xl-0 { - margin-left: 0%; - } - - .row>.col-xl-1 { - height: auto; - width: 8.3333%; - } - - .row>.offset-xl-1 { - margin-left: 8.3333%; - } - - .row>.col-xl-2 { - height: auto; - width: 16.6667%; - } - - .row>.offset-xl-2 { - margin-left: 16.6667%; - } - - .row>.col-xl-3 { - height: auto; - width: 25%; - } - - .row>.offset-xl-3 { - margin-left: 25%; - } - - .row>.col-xl-4 { - height: auto; - width: 33.3333%; - } - - .row>.offset-xl-4 { - margin-left: 33.3333%; - } - - .row>.col-xl-5 { - height: auto; - width: 41.6667%; - } - - .row>.offset-xl-5 { - margin-left: 41.6667%; - } - - .row>.col-xl-6 { - height: auto; - width: 50%; - } - - .row>.offset-xl-6 { - margin-left: 50%; - } - - .row>.col-xl-7 { - height: auto; - width: 58.3333%; - } - - .row>.offset-xl-7 { - margin-left: 58.3333%; - } - - .row>.col-xl-8 { - height: auto; - width: 66.6667%; - } - - .row>.offset-xl-8 { - margin-left: 66.6667%; - } - - .row>.col-xl-9 { - height: auto; - width: 75%; - } - - .row>.offset-xl-9 { - margin-left: 75%; - } - - .row>.col-xl-10 { - height: auto; - width: 83.3333%; - } - - .row>.offset-xl-10 { - margin-left: 83.3333%; - } - - .row>.col-xl-11 { - height: auto; - width: 91.6667%; - } - - .row>.offset-xl-11 { - margin-left: 91.6667%; - } - - .row>.col-xl-12 { - height: auto; - width: 100%; - } - - .row>.offset-xl-12 { - margin-left: 100%; - } -} - -.form-label { - font-size: 12px; - padding: 0 4px; - text-align: center; - box-sizing: border-box; -} - -.label-required::before { - content: "*"; - color: red; - margin-right: 4px; -} - -.fl-title { - font-size: 18px; - font-weight: bolder; - display: flex; - align-items: center; -} - -.form-title { - font-size: 18px; - font-weight: bold; - display: flex; - align-items: center; - color: #6D5C9C; - margin: 10px 0; -} - -.form-title::before { - content: '|'; - width: 10px; - height: 31px; -} - -.htmleditor>p { - margin: 0.63em 0 1.8em 0; - font-size: 16px; - line-height: 30px; -} - -.htmleditor img { - max-width: 100%; -} \ No newline at end of file diff --git a/src/assets/css/sfstatic.css b/src/assets/css/sfstatic.css deleted file mode 100644 index d81bc0f..0000000 --- a/src/assets/css/sfstatic.css +++ /dev/null @@ -1,11 +0,0 @@ - -.fonchain-logo { - background-image: url(../image/fonchain.png); - cursor: pointer; - background-size: cover; -} -.clear-icon { - background-image: url(../image/clear-icon.jpg); - cursor: pointer; - background-size:cover; -} diff --git a/src/assets/css/sfstatus.css b/src/assets/css/sfstatus.css deleted file mode 100644 index 57dfc35..0000000 --- a/src/assets/css/sfstatus.css +++ /dev/null @@ -1,64 +0,0 @@ -.status-info { - color: #fff !important; - background-color: #4ed80e !important; -} - -.status-primary { - color: #fff !important; - background-color: #3b82c9 !important; -} - -.status-draft { - color: #fff !important; - background-color: #b0bce0 !important; -} - -.status-danger { - color: #fff !important; - background-color: #d44545 !important; -} - -.border-yell { - border: 1px #e992bd solid; - color: #409eff; - border-radius: 10px; - padding: 1px 4px; - margin: 1px 4px; -} - -.border-draft { - border: 1px #9c989a solid; - color: #9c989a; - border-radius: 10%; - padding: 1px 4px; - margin: 1px 4px; -} - -.border-info { - border: 1px #69dd9d solid; - color: #69dd9d; - border-radius: 10%; - padding: 1px 4px; - margin: 1px 4px; -} - -.border-primary { - border: 1px #027be3 solid; - color: #027be3; - border-radius: 10%; - padding: 1px 4px; - margin: 1px 4px; -} - -.border-danger { - border: 1px #ef136e solid; - color: #ef136e; - border-radius: 10%; - padding: 1px 4px; - margin: 1px 4px; -} - -.sf-status-label { - padding: 3px 6px; - border-radius: 4px; -} \ No newline at end of file diff --git a/src/assets/css/sftable.css b/src/assets/css/sftable.css deleted file mode 100644 index cfbddd1..0000000 --- a/src/assets/css/sftable.css +++ /dev/null @@ -1,63 +0,0 @@ -.commontable { - padding-left: 10px; - padding-right: 10px; - background: #fff; - border-radius: 5px; -} - -.commontable .table-td-thumb { - display: block; - margin: auto; - width: 40px; - height: 40px; -} - -.commontable-border { - position: relative; - margin: auto; - border-radius: 10px; - transition: all 0.3s; - cursor: pointer; -} - -.commontable-border:hover { - filter: contrast(1.1); -} - -.commontable-border:active { - filter: contrast(0.9); -} - -.commontable-border::before, -.commontable-border::after { - content: ""; - position: absolute; - top: -10px; - left: -10px; - right: -10px; - bottom: -10px; - border: 2px solid gold; - transition: all 0.5s; - animation: clippath 3s infinite linear; - border-radius: 10px; -} - -.commontable-border::after { - animation: clippath 3s infinite -1.5s linear; -} - -@keyframes clippath { - 0%, - 100% { - clip-path: inset(0 0 98% 0); - } - 25% { - clip-path: inset(0 98% 0 0); - } - 50% { - clip-path: inset(98% 0 0 0); - } - 75% { - clip-path: inset(0 0 0 98%); - } -} diff --git a/src/assets/image/icon-header-btn-bg.png b/src/assets/image/icon-header-btn-bg.png new file mode 100644 index 0000000..0908016 Binary files /dev/null and b/src/assets/image/icon-header-btn-bg.png differ diff --git a/src/assets/image/icon-header-btn.png b/src/assets/image/icon-header-btn.png new file mode 100644 index 0000000..cd4e571 Binary files /dev/null and b/src/assets/image/icon-header-btn.png differ diff --git a/src/assets/image/icon-title.png b/src/assets/image/icon-title.png new file mode 100644 index 0000000..3396e94 Binary files /dev/null and b/src/assets/image/icon-title.png differ diff --git a/src/main.js b/src/main.js index a345753..74a4f4e 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,6 @@ import { createApp } from 'vue' import './style.css' + import App from './App.vue' import 'normalize.css'; import router from './router'; diff --git a/src/router/index.js b/src/router/index.js index b1e69ec..7b67f44 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -3,11 +3,11 @@ import { createRouter, createWebHistory } from 'vue-router'; const routes = [ { path: '/', - redirect: 'home' + redirect: 'navigation' }, { - path: '/home', - name: 'home', + path: '/navigation', + name: 'navigation', component: () => import('@/views/layout.vue'), children: [ { diff --git a/src/style.css b/src/style.css index bb131d6..2777f99 100644 --- a/src/style.css +++ b/src/style.css @@ -18,6 +18,7 @@ a { color: #646cff; text-decoration: inherit; } + a:hover { color: #535bf2; } @@ -46,9 +47,11 @@ button { cursor: pointer; transition: border-color 0.25s; } + button:hover { border-color: #646cff; } + button:focus, button:focus-visible { outline: 4px auto -webkit-focus-ring-color; @@ -60,8 +63,8 @@ button:focus-visible { #app { max-width: 1280px; + width: 100vw; margin: 0 auto; - padding: 2rem; text-align: center; } @@ -70,10 +73,1738 @@ button:focus-visible { color: #213547; background-color: #ffffff; } + a:hover { color: #747bff; } + button { background-color: #f9f9f9; } } + +.cursor { + cursor: pointer; +} + +.fl-page-width { + max-width: 1200px; + margin: auto; +} + +.flex { + display: flex; +} + +.align-center { + align-items: center; +} + +.flex-wrap { + flex-wrap: wrap; +} + +.column { + flex-direction: column; +} + +.items-start { + align-items: flex-start !important; +} + +.items-center { + align-items: center; +} + +.content-start { + align-content: flex-start !important; +} + +.content-center { + align-items: center; +} + +.justify-between { + justify-content: space-between; +} + +.justify-around { + justify-content: space-around; +} + +.justify-end { + justify-content: flex-end; +} + +.justify-center { + justify-content: center; +} + +.relative { + position: relative; +} + +.absolute { + position: absolute; +} + +.text-center { + text-align: center !important; +} + +.text-right { + text-align: right !important; +} + +.text-left { + text-align: left !important; +} + +.no-link { + text-decoration: none; +} + +.sf-link { + color: #409eff; + cursor: pointer; + text-decoration: none; +} + +.title { + font-size: 16px; + /* font-weight: bold; */ + color: #b8bac9; + margin: 10px 0; +} + +.sf-text-ellipsis { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.overflow-auto { + overflow: auto; +} + +.overflow-hidden { + overflow: hidden; +} + +.width-100 { + width: 100%; +} + +.height-100 { + height: 100%; +} + +.maxH-100 { + max-height: 100%; +} + +.display-none { + display: none; +} + +.fl-pa-sm { + padding: 8px !important; +} + +.fl-pb-xs { + padding-bottom: 4px !important; +} + +.fl-pa-xs { + padding: 4px !important; +} + +.fl-py-xs { + padding-top: 4px !important; + padding-bottom: 4px !important; +} + +.m-auto { + margin: auto +} + +.fl-mx-xs { + margin-left: 4px !important; + margin-right: 4px !important; +} + +.fl-my-xs { + margin-top: 4px !important; + margin-bottom: 4px !important; +} + +.fl-ml-xs { + margin-left: 4px !important; +} + +.fl-mt-xs { + margin-top: 4px !important; +} + +.fl-pt-xs { + padding-top: 4px !important; +} + +.fl-pl-xs { + padding-left: 4px !important; +} + +.fl-pl-sm { + padding-left: 8px !important; +} + +.fl-pr-sm { + padding-right: 8px !important; +} + +.fl-pt-sm { + padding-top: 8px !important; +} + +.fl-pb-sm { + padding-bottom: 8px !important; +} + +.fl-px-sm { + padding-left: 8px !important; + padding-right: 8px !important; +} + +.fl-px-xs { + padding-left: 4px !important; + padding-right: 4px !important; +} + +.fl-py-sm { + padding-top: 8px !important; + padding-bottom: 8px !important; +} + +.fl-pa-md { + padding: 16px !important; +} + +.fl-pl-md { + padding-left: 16px !important; +} + +.fl-pr-md { + padding-right: 16px !important; +} + +.fl-pt-md { + padding-top: 16px !important; +} + +.fl-pb-md { + padding-bottom: 16px !important; +} + +.fl-px-md { + padding-left: 16px !important; + padding-right: 16px !important; +} + +.fl-py-md { + padding-top: 16px !important; + padding-bottom: 16px !important; +} + +.fl-pa-lg { + padding: 24px !important; +} + +.fl-pl-lg { + padding-left: 24px !important; +} + +.fl-pr-lg { + padding-right: 24px !important; +} + +.fl-pt-lg { + padding-top: 24px !important; +} + +.fl-pb-lg { + padding-bottom: 24px !important; +} + +.fl-px-lg { + padding-left: 24px !important; + padding-right: 24px !important; +} + +.fl-py-lg { + padding-top: 24px !important; + padding-bottom: 24px !important; +} + +.fl-ma-sm { + margin: 8px !important; +} + +.fl-ma-xs { + margin: 4px !important; +} + +.fl-ml-sm { + margin-left: 8px !important; +} + +.fl-mr-sm { + margin-right: 8px !important; +} + +.fl-mt-sm { + margin-top: 8px !important; +} + +.fl-mb-xs { + margin-bottom: 4px !important; +} + +.fl-mb-sm { + margin-bottom: 8px !important; +} + +.fl-mx-sm { + margin-left: 8px !important; + margin-right: 8px !important; +} + +.fl-my-sm { + margin-top: 8px !important; + margin-bottom: 8px !important; +} + +.fl-ma-md { + margin: 16px !important; +} + +.fl-ml-md { + margin-left: 16px !important; +} + +.fl-mr-md { + margin-right: 16px !important; +} + +.fl-mt-md { + margin-top: 16px !important; +} + + +.fl-mb-md { + margin-bottom: 16px !important; +} + +.fl-mx-md { + margin-left: 16px !important; + margin-right: 16px !important; +} + +.fl-my-md { + margin-top: 16px !important; + margin-bottom: 16px !important; +} + +.fl-ma-lg { + margin: 24px !important; +} + +.fl-ml-lg { + margin-left: 24px !important; +} + +.fl-mr-lg { + margin-right: 24px !important; +} + +.fl-mt-lg { + margin-top: 24px !important; +} + +.fl-mb-lg { + margin-bottom: 24px !important; +} + +.fl-mx-lg { + margin-left: 24px !important; + margin-right: 24px !important; +} + +.fl-my-lg { + margin-top: 24px !important; + margin-bottom: 24px !important; +} + +.border-box { + box-sizing: border-box; +} + +.border-dashed { + border: 2px dashed rgba(145, 148, 99, 0.6); + border-radius: 5px +} + +.box-content { + box-sizing: content-box; +} + +.box-border { + box-sizing: border-box; +} + +* ::-webkit-scrollbar { + width: 10px; + height: 10px; +} + +* ::-webkit-scrollbar-track { + border-radius: 3px; + background: rgba(0, 0, 0, 0.06); + -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.08); +} + +* ::-webkit-scrollbar-thumb { + border-radius: 3px; + background: rgba(0, 0, 0, 0.12); + -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2); +} + +.link-area { + display: flex; + align-items: center; + color: #409eff; +} + +.bg-white { + background: #ffffff !important; +} + +.bg-grey { + background: #777777 !important; +} + +.bg-grey-1 { + background: #b4b0b0 !important; +} + +.bg-black { + background: #000 !important; +} + +.bg-764CF6 { + background: #764CF6 !important; +} + +.bg-370D9B { + background: #370D9B !important; +} + +.bg-b2b2c6 { + background: #b2b2c6 +} + +.bg-fff { + background-color: #fff !important; +} + +.bg-primary { + /* background-color: #3aace8 !important; */ + background-color: #764CF6 !important; +} + +.bg-danger { + background-color: #ef136e +} + +.color-white { + color: #fff !important; +} + +.color-danger { + color: #ef136e !important; +} + +.color-primary { + color: #3aace8 !important; +} + +.color-764CF6 { + color: #764CF6 !important; +} + +.color-info { + color: #4ed80e !important; +} + +.color-draft { + color: #b0bce0 !important; +} + +.color-yellow { + color: orange !important; +} + +.color-black { + color: #000 !important; +} + +.color-grey { + color: rgb(163, 156, 156) !important; +} + +.index-container { + padding: 20px 30px 0 30px; + background: #fff; + border-radius: 5px; +} + +.no-radius { + border-radius: none; +} + +.no-shadow { + box-shadow: none; +} + +.no-margin { + margin: none; +} + +.no-padding { + padding: none; +} + +.border-1 { + /* border: 1px solid rgb(65, 62, 62) */ + border: 1px solid #E3DFEA; +} + +.container { + padding: 30px; + background: #fff; + border: 1px solid #ddd; + border-radius: 5px; +} + +.border-radius-4 { + border-radius: 4px !important +} + +.border-radius-8 { + border-radius: 8px !important +} + +.border-radius-16 { + border-radius: 16px !important +} + +.flex, +.row { + display: flex; + flex-wrap: wrap; +} + +@media (min-width: 0) { + + .flex>.col, + .flex>.col-0, + .flex>.col-1, + .flex>.col-2, + .flex>.col-3, + .flex>.col-4, + .flex>.col-5, + .flex>.col-6, + .flex>.col-7, + .flex>.col-8, + .flex>.col-9, + .flex>.col-10, + .flex>.col-11, + .flex>.col-12, + .flex>.col-auto, + .flex>.col-grow, + .flex>.col-shrink, + .flex>.col-xs, + .flex>.col-xs-0, + .flex>.col-xs-1, + .flex>.col-xs-2, + .flex>.col-xs-3, + .flex>.col-xs-4, + .flex>.col-xs-5, + .flex>.col-xs-6, + .flex>.col-xs-7, + .flex>.col-xs-8, + .flex>.col-xs-9, + .flex>.col-xs-10, + .flex>.col-xs-11, + .flex>.col-xs-12, + .flex>.col-xs-auto, + .flex>.col-xs-grow, + .flex>.col-xs-shrink, + .row>.col, + .row>.col-0, + .row>.col-1, + .row>.col-2, + .row>.col-3, + .row>.col-4, + .row>.col-5, + .row>.col-6, + .row>.col-7, + .row>.col-8, + .row>.col-9, + .row>.col-10, + .row>.col-11, + .row>.col-12, + .row>.col-auto, + .row>.col-grow, + .row>.col-shrink, + .row>.col-xs, + .row>.col-xs-0, + .row>.col-xs-1, + .row>.col-xs-2, + .row>.col-xs-3, + .row>.col-xs-4, + .row>.col-xs-5, + .row>.col-xs-6, + .row>.col-xs-7, + .row>.col-xs-8, + .row>.col-xs-9, + .row>.col-xs-10, + .row>.col-xs-11, + .row>.col-xs-12, + .row>.col-xs-auto, + .row>.col-xs-grow, + .row>.col-xs-shrink { + width: auto; + min-width: 0; + max-width: 100%; + } + + .flex>.col, + .flex>.col-0, + .flex>.col-1, + .flex>.col-2, + .flex>.col-3, + .flex>.col-4, + .flex>.col-5, + .flex>.col-6, + .flex>.col-7, + .flex>.col-8, + .flex>.col-9, + .flex>.col-10, + .flex>.col-11, + .flex>.col-12, + .flex>.col-auto, + .flex>.col-grow, + .flex>.col-shrink, + .flex>.col-xs, + .flex>.col-xs-0, + .flex>.col-xs-1, + .flex>.col-xs-2, + .flex>.col-xs-3, + .flex>.col-xs-4, + .flex>.col-xs-5, + .flex>.col-xs-6, + .flex>.col-xs-7, + .flex>.col-xs-8, + .flex>.col-xs-9, + .flex>.col-xs-10, + .flex>.col-xs-11, + .flex>.col-xs-12, + .flex>.col-xs-auto, + .flex>.col-xs-grow, + .flex>.col-xs-shrink { + height: auto; + min-height: 0; + max-height: 100%; + } + + .col, + .col-xs { + flex: 10000 1 0%; + } + + .col-0, + .col-1, + .col-2, + .col-3, + .col-4, + .col-5, + .col-6, + .col-7, + .col-8, + .col-9, + .col-10, + .col-11, + .col-12, + .col-auto, + .col-xs-0, + .col-xs-1, + .col-xs-2, + .col-xs-3, + .col-xs-4, + .col-xs-5, + .col-xs-6, + .col-xs-7, + .col-xs-8, + .col-xs-9, + .col-xs-10, + .col-xs-11, + .col-xs-12, + .col-xs-auto { + flex: 0 0 auto; + } + + .col-grow, + .col-xs-grow { + flex: 1 0 auto; + } + + .col-shrink, + .col-xs-shrink { + flex: 0 1 auto; + } + + .row>.col-0, + .row>.col-xs-0 { + height: auto; + width: 0%; + } + + .row>.offset-0, + .row>.offset-xs-0 { + margin-left: 0%; + } + + .row>.col-1, + .row>.col-xs-1 { + height: auto; + width: 8.3333%; + } + + .row>.offset-1, + .row>.offset-xs-1 { + margin-left: 8.3333%; + } + + .row>.col-2, + .row>.col-xs-2 { + height: auto; + width: 16.6667%; + } + + .row>.offset-2, + .row>.offset-xs-2 { + margin-left: 16.6667%; + } + + .row>.col-3, + .row>.col-xs-3 { + height: auto; + width: 25% !important; + } + + .row>.offset-3, + .row>.offset-xs-3 { + margin-left: 25%; + } + + .row>.col-4, + .row>.col-xs-4 { + height: auto; + width: 33.3333%; + } + + .row>.offset-4, + .row>.offset-xs-4 { + margin-left: 33.3333%; + } + + .row>.col-5, + .row>.col-xs-5 { + height: auto; + width: 41.6667%; + } + + .row>.offset-5, + .row>.offset-xs-5 { + margin-left: 41.6667%; + } + + .row>.col-6, + .row>.col-xs-6 { + height: auto; + width: 50%; + } + + .row>.offset-6, + .row>.offset-xs-6 { + margin-left: 50%; + } + + .row>.col-7, + .row>.col-xs-7 { + height: auto; + width: 58.3333%; + } + + .row>.offset-7, + .row>.offset-xs-7 { + margin-left: 58.3333%; + } + + .row>.col-8, + .row>.col-xs-8 { + height: auto; + width: 66.6667%; + } + + .row>.offset-8, + .row>.offset-xs-8 { + margin-left: 66.6667%; + } + + .row>.col-9, + .row>.col-xs-9 { + height: auto; + width: 75%; + } + + .row>.offset-9, + .row>.offset-xs-9 { + margin-left: 75%; + } + + .row>.col-10, + .row>.col-xs-10 { + height: auto; + width: 83.3333%; + } + + .row>.offset-10, + .row>.offset-xs-10 { + margin-left: 83.3333%; + } + + .row>.col-11, + .row>.col-xs-11 { + height: auto; + width: 91.6667%; + } + + .row>.offset-11, + .row>.offset-xs-11 { + margin-left: 91.6667%; + } + + .row>.col-12, + .row>.col-xs-12 { + height: auto; + width: 100%; + } + + .row>.offset-12, + .row>.offset-xs-12 { + margin-left: 100%; + } + + .row>.col-all { + height: auto; + flex: 0 0 100%; + } +} + +@media (min-width: 600px) { + + .flex>.col-sm, + .flex>.col-sm-0, + .flex>.col-sm-1, + .flex>.col-sm-2, + .flex>.col-sm-3, + .flex>.col-sm-4, + .flex>.col-sm-5, + .flex>.col-sm-6, + .flex>.col-sm-7, + .flex>.col-sm-8, + .flex>.col-sm-9, + .flex>.col-sm-10, + .flex>.col-sm-11, + .flex>.col-sm-12, + .flex>.col-sm-auto, + .flex>.col-sm-grow, + .flex>.col-sm-shrink, + .row>.col-sm, + .row>.col-sm-0, + .row>.col-sm-1, + .row>.col-sm-2, + .row>.col-sm-3, + .row>.col-sm-4, + .row>.col-sm-5, + .row>.col-sm-6, + .row>.col-sm-7, + .row>.col-sm-8, + .row>.col-sm-9, + .row>.col-sm-10, + .row>.col-sm-11, + .row>.col-sm-12, + .row>.col-sm-auto, + .row>.col-sm-grow, + .row>.col-sm-shrink { + width: auto; + min-width: 0; + max-width: 100%; + } + + .flex>.col-sm, + .flex>.col-sm-0, + .flex>.col-sm-1, + .flex>.col-sm-2, + .flex>.col-sm-3, + .flex>.col-sm-4, + .flex>.col-sm-5, + .flex>.col-sm-6, + .flex>.col-sm-7, + .flex>.col-sm-8, + .flex>.col-sm-9, + .flex>.col-sm-10, + .flex>.col-sm-11, + .flex>.col-sm-12, + .flex>.col-sm-auto, + .flex>.col-sm-grow, + .flex>.col-sm-shrink { + height: auto; + min-height: 0; + max-height: 100%; + } + + .col-sm { + flex: 10000 1 0%; + } + + .col-sm-0, + .col-sm-1, + .col-sm-2, + .col-sm-3, + .col-sm-4, + .col-sm-5, + .col-sm-6, + .col-sm-7, + .col-sm-8, + .col-sm-9, + .col-sm-10, + .col-sm-11, + .col-sm-12, + .col-sm-auto { + flex: 0 0 auto; + } + + .col-sm-grow { + flex: 1 0 auto; + } + + .col-sm-shrink { + flex: 0 1 auto; + } + + .row>.col-sm-0 { + height: auto; + width: 0%; + } + + .row>.offset-sm-0 { + margin-left: 0%; + } + + .row>.col-sm-1 { + height: auto; + width: 8.3333%; + } + + .row>.offset-sm-1 { + margin-left: 8.3333%; + } + + .row>.col-sm-2 { + height: auto; + width: 16.6667%; + } + + .row>.offset-sm-2 { + margin-left: 16.6667%; + } + + .row>.col-sm-3 { + height: auto; + width: 25%; + } + + .row>.offset-sm-3 { + margin-left: 25%; + } + + .row>.col-sm-4 { + height: auto; + width: 33.3333%; + } + + .row>.offset-sm-4 { + margin-left: 33.3333%; + } + + .row>.col-sm-5 { + height: auto; + width: 41.6667%; + } + + .row>.offset-sm-5 { + margin-left: 41.6667%; + } + + .row>.col-sm-6 { + height: auto; + width: 50%; + } + + .row>.offset-sm-6 { + margin-left: 50%; + } + + .row>.col-sm-7 { + height: auto; + width: 58.3333%; + } + + .row>.offset-sm-7 { + margin-left: 58.3333%; + } + + .row>.col-sm-8 { + height: auto; + width: 66.6667% !important; + } + + .row>.offset-sm-8 { + margin-left: 66.6667%; + } + + .row>.col-sm-9 { + height: auto; + width: 75%; + } + + .row>.offset-sm-9 { + margin-left: 75%; + } + + .row>.col-sm-10 { + height: auto; + width: 83.3333%; + } + + .row>.offset-sm-10 { + margin-left: 83.3333%; + } + + .row>.col-sm-11 { + height: auto; + width: 91.6667%; + } + + .row>.offset-sm-11 { + margin-left: 91.6667%; + } + + .row>.col-sm-12 { + height: auto; + width: 100%; + } + + .row>.offset-sm-12 { + margin-left: 100%; + } +} + +@media (min-width: 1024px) { + + .flex>.col-md, + .flex>.col-md-0, + .flex>.col-md-1, + .flex>.col-md-2, + .flex>.col-md-3, + .flex>.col-md-4, + .flex>.col-md-5, + .flex>.col-md-6, + .flex>.col-md-7, + .flex>.col-md-8, + .flex>.col-md-9, + .flex>.col-md-10, + .flex>.col-md-11, + .flex>.col-md-12, + .flex>.col-md-auto, + .flex>.col-md-grow, + .flex>.col-md-shrink, + .row>.col-md, + .row>.col-md-0, + .row>.col-md-1, + .row>.col-md-2, + .row>.col-md-3, + .row>.col-md-4, + .row>.col-md-5, + .row>.col-md-6, + .row>.col-md-7, + .row>.col-md-8, + .row>.col-md-9, + .row>.col-md-10, + .row>.col-md-11, + .row>.col-md-12, + .row>.col-md-auto, + .row>.col-md-grow, + .row>.col-md-shrink { + width: auto; + min-width: 0; + max-width: 100%; + } + + .flex>.col-md, + .flex>.col-md-0, + .flex>.col-md-1, + .flex>.col-md-2, + .flex>.col-md-3, + .flex>.col-md-4, + .flex>.col-md-5, + .flex>.col-md-6, + .flex>.col-md-7, + .flex>.col-md-8, + .flex>.col-md-9, + .flex>.col-md-10, + .flex>.col-md-11, + .flex>.col-md-12, + .flex>.col-md-auto, + .flex>.col-md-grow, + .flex>.col-md-shrink { + height: auto; + min-height: 0; + max-height: 100%; + } + + .col-md { + flex: 10000 1 0%; + } + + .col-md-0, + .col-md-1, + .col-md-2, + .col-md-3, + .col-md-4, + .col-md-5, + .col-md-6, + .col-md-7, + .col-md-8, + .col-md-9, + .col-md-10, + .col-md-11, + .col-md-12, + .col-md-auto { + flex: 0 0 auto; + } + + .col-md-grow { + flex: 1 0 auto; + } + + .col-md-shrink { + flex: 0 1 auto; + } + + .row>.col-md-0 { + height: auto; + width: 0%; + } + + .row>.offset-md-0 { + margin-left: 0%; + } + + .row>.col-md-1 { + height: auto; + width: 8.3333%; + } + + .row>.offset-md-1 { + margin-left: 8.3333%; + } + + .row>.col-md-2 { + height: auto; + width: 16.6667%; + } + + .row>.offset-md-2 { + margin-left: 16.6667%; + } + + .row>.col-md-3 { + height: auto; + width: 25%; + } + + .row>.offset-md-3 { + margin-left: 25%; + } + + .row>.col-md-4 { + height: auto; + width: 33.3333%; + } + + .row>.offset-md-4 { + margin-left: 33.3333%; + } + + .row>.col-md-5 { + height: auto; + width: 41.6667%; + } + + .row>.offset-md-5 { + margin-left: 41.6667%; + } + + .row>.col-md-6 { + height: auto; + width: 50%; + } + + .row>.offset-md-6 { + margin-left: 50%; + } + + .row>.col-md-7 { + height: auto; + width: 58.3333%; + } + + .row>.offset-md-7 { + margin-left: 58.3333%; + } + + .row>.col-md-8 { + height: auto; + width: 66.6667%; + } + + .row>.offset-md-8 { + margin-left: 66.6667%; + } + + .row>.col-md-9 { + height: auto; + width: 75%; + } + + .row>.offset-md-9 { + margin-left: 75%; + } + + .row>.col-md-10 { + height: auto; + width: 83.3333%; + } + + .row>.offset-md-10 { + margin-left: 83.3333%; + } + + .row>.col-md-11 { + height: auto; + width: 91.6667%; + } + + .row>.offset-md-11 { + margin-left: 91.6667%; + } + + .row>.col-md-12 { + height: auto; + width: 100%; + } + + .row>.offset-md-12 { + margin-left: 100%; + } +} + +@media (min-width: 1440px) { + + .flex>.col-lg, + .flex>.col-lg-0, + .flex>.col-lg-1, + .flex>.col-lg-2, + .flex>.col-lg-3, + .flex>.col-lg-4, + .flex>.col-lg-5, + .flex>.col-lg-6, + .flex>.col-lg-7, + .flex>.col-lg-8, + .flex>.col-lg-9, + .flex>.col-lg-10, + .flex>.col-lg-11, + .flex>.col-lg-12, + .flex>.col-lg-auto, + .flex>.col-lg-grow, + .flex>.col-lg-shrink, + .row>.col-lg, + .row>.col-lg-0, + .row>.col-lg-1, + .row>.col-lg-2, + .row>.col-lg-3, + .row>.col-lg-4, + .row>.col-lg-5, + .row>.col-lg-6, + .row>.col-lg-7, + .row>.col-lg-8, + .row>.col-lg-9, + .row>.col-lg-10, + .row>.col-lg-11, + .row>.col-lg-12, + .row>.col-lg-auto, + .row>.col-lg-grow, + .row>.col-lg-shrink { + width: auto; + min-width: 0; + max-width: 100%; + } + + .flex>.col-lg, + .flex>.col-lg-0, + .flex>.col-lg-1, + .flex>.col-lg-2, + .flex>.col-lg-3, + .flex>.col-lg-4, + .flex>.col-lg-5, + .flex>.col-lg-6, + .flex>.col-lg-7, + .flex>.col-lg-8, + .flex>.col-lg-9, + .flex>.col-lg-10, + .flex>.col-lg-11, + .flex>.col-lg-12, + .flex>.col-lg-auto, + .flex>.col-lg-grow, + .flex>.col-lg-shrink { + height: auto; + min-height: 0; + max-height: 100%; + } + + .col-lg { + flex: 10000 1 0%; + } + + .col-lg-0, + .col-lg-1, + .col-lg-2, + .col-lg-3, + .col-lg-4, + .col-lg-5, + .col-lg-6, + .col-lg-7, + .col-lg-8, + .col-lg-9, + .col-lg-10, + .col-lg-11, + .col-lg-12, + .col-lg-auto { + flex: 0 0 auto; + } + + .col-lg-grow { + flex: 1 0 auto; + } + + .col-lg-shrink { + flex: 0 1 auto; + } + + .row>.col-lg-0 { + height: auto; + width: 0%; + } + + .row>.offset-lg-0 { + margin-left: 0%; + } + + .row>.col-lg-1 { + height: auto; + width: 8.3333%; + } + + .row>.offset-lg-1 { + margin-left: 8.3333%; + } + + .row>.col-lg-2 { + height: auto; + width: 16.6667%; + } + + .row>.offset-lg-2 { + margin-left: 16.6667%; + } + + .row>.col-lg-3 { + height: auto; + width: 25%; + } + + .row>.offset-lg-3 { + margin-left: 25%; + } + + .row>.col-lg-4 { + height: auto; + width: 33.3333%; + } + + .row>.offset-lg-4 { + margin-left: 33.3333%; + } + + .row>.col-lg-5 { + height: auto; + width: 41.6667%; + } + + .row>.offset-lg-5 { + margin-left: 41.6667%; + } + + .row>.col-lg-6 { + height: auto; + width: 50%; + } + + .row>.offset-lg-6 { + margin-left: 50%; + } + + .row>.col-lg-7 { + height: auto; + width: 58.3333%; + } + + .row>.offset-lg-7 { + margin-left: 58.3333%; + } + + .row>.col-lg-8 { + height: auto; + width: 66.6667%; + } + + .row>.offset-lg-8 { + margin-left: 66.6667%; + } + + .row>.col-lg-9 { + height: auto; + width: 75%; + } + + .row>.offset-lg-9 { + margin-left: 75%; + } + + .row>.col-lg-10 { + height: auto; + width: 83.3333%; + } + + .row>.offset-lg-10 { + margin-left: 83.3333%; + } + + .row>.col-lg-11 { + height: auto; + width: 91.6667%; + } + + .row>.offset-lg-11 { + margin-left: 91.6667%; + } + + .row>.col-lg-12 { + height: auto; + width: 100%; + } + + .row>.offset-lg-12 { + margin-left: 100%; + } +} + +@media (min-width: 1920px) { + + .flex>.col-xl, + .flex>.col-xl-0, + .flex>.col-xl-1, + .flex>.col-xl-2, + .flex>.col-xl-3, + .flex>.col-xl-4, + .flex>.col-xl-5, + .flex>.col-xl-6, + .flex>.col-xl-7, + .flex>.col-xl-8, + .flex>.col-xl-9, + .flex>.col-xl-10, + .flex>.col-xl-11, + .flex>.col-xl-12, + .flex>.col-xl-auto, + .flex>.col-xl-grow, + .flex>.col-xl-shrink, + .row>.col-xl, + .row>.col-xl-0, + .row>.col-xl-1, + .row>.col-xl-2, + .row>.col-xl-3, + .row>.col-xl-4, + .row>.col-xl-5, + .row>.col-xl-6, + .row>.col-xl-7, + .row>.col-xl-8, + .row>.col-xl-9, + .row>.col-xl-10, + .row>.col-xl-11, + .row>.col-xl-12, + .row>.col-xl-auto, + .row>.col-xl-grow, + .row>.col-xl-shrink { + width: auto; + min-width: 0; + max-width: 100%; + } + + .flex>.col-xl, + .flex>.col-xl-0, + .flex>.col-xl-1, + .flex>.col-xl-2, + .flex>.col-xl-3, + .flex>.col-xl-4, + .flex>.col-xl-5, + .flex>.col-xl-6, + .flex>.col-xl-7, + .flex>.col-xl-8, + .flex>.col-xl-9, + .flex>.col-xl-10, + .flex>.col-xl-11, + .flex>.col-xl-12, + .flex>.col-xl-auto, + .flex>.col-xl-grow, + .flex>.col-xl-shrink { + height: auto; + min-height: 0; + max-height: 100%; + } + + .col-xl { + flex: 10000 1 0%; + } + + .col-xl-0, + .col-xl-1, + .col-xl-2, + .col-xl-3, + .col-xl-4, + .col-xl-5, + .col-xl-6, + .col-xl-7, + .col-xl-8, + .col-xl-9, + .col-xl-10, + .col-xl-11, + .col-xl-12, + .col-xl-auto { + flex: 0 0 auto; + } + + .col-xl-grow { + flex: 1 0 auto; + } + + .col-xl-shrink { + flex: 0 1 auto; + } + + .row>.col-xl-0 { + height: auto; + width: 0%; + } + + .row>.offset-xl-0 { + margin-left: 0%; + } + + .row>.col-xl-1 { + height: auto; + width: 8.3333%; + } + + .row>.offset-xl-1 { + margin-left: 8.3333%; + } + + .row>.col-xl-2 { + height: auto; + width: 16.6667%; + } + + .row>.offset-xl-2 { + margin-left: 16.6667%; + } + + .row>.col-xl-3 { + height: auto; + width: 25%; + } + + .row>.offset-xl-3 { + margin-left: 25%; + } + + .row>.col-xl-4 { + height: auto; + width: 33.3333%; + } + + .row>.offset-xl-4 { + margin-left: 33.3333%; + } + + .row>.col-xl-5 { + height: auto; + width: 41.6667%; + } + + .row>.offset-xl-5 { + margin-left: 41.6667%; + } + + .row>.col-xl-6 { + height: auto; + width: 50%; + } + + .row>.offset-xl-6 { + margin-left: 50%; + } + + .row>.col-xl-7 { + height: auto; + width: 58.3333%; + } + + .row>.offset-xl-7 { + margin-left: 58.3333%; + } + + .row>.col-xl-8 { + height: auto; + width: 66.6667%; + } + + .row>.offset-xl-8 { + margin-left: 66.6667%; + } + + .row>.col-xl-9 { + height: auto; + width: 75%; + } + + .row>.offset-xl-9 { + margin-left: 75%; + } + + .row>.col-xl-10 { + height: auto; + width: 83.3333%; + } + + .row>.offset-xl-10 { + margin-left: 83.3333%; + } + + .row>.col-xl-11 { + height: auto; + width: 91.6667%; + } + + .row>.offset-xl-11 { + margin-left: 91.6667%; + } + + .row>.col-xl-12 { + height: auto; + width: 100%; + } + + .row>.offset-xl-12 { + margin-left: 100%; + } +} + +.form-label { + font-size: 12px; + padding: 0 4px; + text-align: center; + box-sizing: border-box; +} + +.label-required::before { + content: "*"; + color: red; + margin-right: 4px; +} + +.fl-title { + font-size: 18px; + font-weight: bolder; + display: flex; + align-items: center; +} + +.form-title { + font-size: 18px; + font-weight: bold; + display: flex; + align-items: center; + color: #6D5C9C; + margin: 10px 0; +} + +.form-title::before { + content: '|'; + width: 10px; + height: 31px; +} + +.htmleditor>p { + margin: 0.63em 0 1.8em 0; + font-size: 16px; + line-height: 30px; +} + +.htmleditor img { + max-width: 100%; +} + +@import "./assets/css/sfcommon.css"; \ No newline at end of file diff --git a/src/views/about/index.vue b/src/views/about/index.vue index da2a9fc..cb75a57 100644 --- a/src/views/about/index.vue +++ b/src/views/about/index.vue @@ -1,2 +1,2 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/views/home/index.vue b/src/views/home/index.vue deleted file mode 100644 index 6b24445..0000000 --- a/src/views/home/index.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - - - diff --git a/src/views/layout.vue b/src/views/layout.vue index d679dd9..2dd5647 100644 --- a/src/views/layout.vue +++ b/src/views/layout.vue @@ -1,20 +1,52 @@ - +