diff --git a/package.json b/package.json index 4db01ca33..c119749ff 100644 --- a/package.json +++ b/package.json @@ -54,6 +54,7 @@ "path": "^0.12.7", "path-to-regexp": "^6.2.0", "pinia": "^2.0.0-rc.14", + "remixicon": "^2.5.0", "resize-observer-polyfill": "^1.5.1", "responsive-storage": "^1.0.11", "sortablejs": "1.13.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a8973e89d..7a8c597f4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -54,6 +54,7 @@ specifiers: postcss-import: 14.0.0 prettier: 2.3.2 pretty-quick: 3.1.1 + remixicon: ^2.5.0 resize-observer-polyfill: ^1.5.1 responsive-storage: ^1.0.11 rimraf: 3.0.2 @@ -112,6 +113,7 @@ dependencies: path: 0.12.7 path-to-regexp: 6.2.0 pinia: 2.0.2_typescript@4.4.2+vue@3.2.21 + remixicon: 2.5.0 resize-observer-polyfill: 1.5.1 responsive-storage: 1.0.11_vue@3.2.21 sortablejs: 1.13.0 @@ -5496,6 +5498,13 @@ packages: - supports-color dev: true + /remixicon/2.5.0: + resolution: + { + integrity: sha512-q54ra2QutYDZpuSnFjmeagmEiN9IMo56/zz5dDNitzKD23oFRw77cWo4TsrAdmdkPiEn8mxlrTqxnkujDbEGww== + } + dev: false + /repeat-string/1.6.1: resolution: { integrity: sha1-jcrkcOHIirwtYA//Sndihtp15jc= } engines: { node: ">=0.10" } diff --git a/src/assets/svg/arrow-left.svg b/src/assets/svg/arrow-left.svg deleted file mode 100644 index b7fa5b5f2..000000000 --- a/src/assets/svg/arrow-left.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/assets/svg/arrow-right.svg b/src/assets/svg/arrow-right.svg deleted file mode 100644 index 2dd67a0ba..000000000 --- a/src/assets/svg/arrow-right.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/assets/svg/exit_screen.svg b/src/assets/svg/exit_screen.svg index cb8bbcc55..d14a67806 100644 --- a/src/assets/svg/exit_screen.svg +++ b/src/assets/svg/exit_screen.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/svg/full_screen.svg b/src/assets/svg/full_screen.svg index b9fc5c055..ebb1111fc 100644 --- a/src/assets/svg/full_screen.svg +++ b/src/assets/svg/full_screen.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/layout/components/tag/index.scss b/src/layout/components/tag/index.scss index 3e2100496..2ada56b7b 100644 --- a/src/layout/components/tag/index.scss +++ b/src/layout/components/tag/index.scss @@ -64,6 +64,8 @@ display: flex; align-items: center; box-shadow: 0 0 1px #888; + color: var(--el-text-color-regular); + background: #fff; .scroll-item { border-radius: 3px 3px 0 0; @@ -132,14 +134,14 @@ .right-button { display: flex; - align-items: center; font-size: 16px; li { + display: flex; + align-items: center; + justify-content: center; width: 40px; height: 38px; - line-height: 38px; - text-align: center; border-right: 1px solid #ccc; cursor: pointer; } @@ -225,13 +227,30 @@ } } -.icon-left { +.ri-arrow-left-s-line { + width: 40px; + height: 38px; + line-height: 38px; + text-align: center; + font-size: 20px; + color: #00000073; + box-shadow: 5px 0 5px -6px #ccc; + &:hover { cursor: w-resize; } } -.icon-right { +.ri-arrow-right-s-line { + width: 40px; + height: 38px; + line-height: 38px; + text-align: center; + font-size: 20px; + border-right: 1px solid #ccc; + color: #00000073; + box-shadow: -5px 0 5px -6px #ccc; + &:hover { cursor: e-resize; } diff --git a/src/layout/components/tag/index.vue b/src/layout/components/tag/index.vue index 99935ee61..dbfd86f42 100644 --- a/src/layout/components/tag/index.vue +++ b/src/layout/components/tag/index.vue @@ -29,8 +29,6 @@ import close from "/@/assets/svg/close.svg"; import refresh from "/@/assets/svg/refresh.svg"; import closeAll from "/@/assets/svg/close_all.svg"; import closeLeft from "/@/assets/svg/close_left.svg"; -import arrowLeft from "/@/assets/svg/arrow-left.svg"; -import arrowRight from "/@/assets/svg/arrow-right.svg"; import closeOther from "/@/assets/svg/close_other.svg"; import closeRight from "/@/assets/svg/close_right.svg"; @@ -499,7 +497,7 @@ onBeforeMount(() => {