diff --git a/docs/.vuepress/components/GroupSelectComponent.vue b/docs/.vuepress/components/GroupSelectComponent.vue index 156ade1..fc06997 100644 --- a/docs/.vuepress/components/GroupSelectComponent.vue +++ b/docs/.vuepress/components/GroupSelectComponent.vue @@ -66,6 +66,10 @@ select { color: white; font-weight: bold; cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .select-wrapper:hover { @@ -80,14 +84,14 @@ select optgroup { .select-wrapper:after { position: absolute; - right: 2px; - top: 2px; - width: 50px; + right: 0px; + top: 3px; + width: 40px; height: 100%; content: "\25BC"; text-align: center; color: white; - font-size: 18px; + font-size: 14px; z-index: -1; } diff --git a/docs/.vuepress/components/SelectComponent.vue b/docs/.vuepress/components/SelectComponent.vue index 48eb7c9..781ac8d 100644 --- a/docs/.vuepress/components/SelectComponent.vue +++ b/docs/.vuepress/components/SelectComponent.vue @@ -56,6 +56,10 @@ select { color: white; font-weight: bold; cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .select-wrapper:hover { @@ -69,14 +73,14 @@ select option { .select-wrapper:after { position: absolute; - right: 2px; - top: 2px; - width: 50px; + right: 0px; + top: 3px; + width: 40px; height: 100%; content: "\25BC"; text-align: center; color: white; - font-size: 18px; + font-size: 14px; z-index: -1; } diff --git a/docs/.vuepress/components/StageLoader.vue b/docs/.vuepress/components/StageLoader.vue index 13fbcbc..7da5c02 100644 --- a/docs/.vuepress/components/StageLoader.vue +++ b/docs/.vuepress/components/StageLoader.vue @@ -35,22 +35,29 @@
Route:
@@ -89,10 +96,16 @@ import GroupSelectComponent from "./GroupSelectComponent"; import stageLoaderLevels from "../data/stageLoaderLevels.json"; import stageLoaderPresets from "../data/stageLoaderPresets.json"; +// Lib +import draggable from "vuedraggable"; + export default { props: { fastCodes: { type: Object }, }, + components: { + draggable, + }, data() { return { selectedRoute: [], @@ -213,9 +226,11 @@ ul { ul li { display: flex; flex-wrap: nowrap; + margin-bottom: 2px; } .route-drag { + cursor: move; margin-right: 5px; } @@ -232,3 +247,9 @@ ul li { cursor: pointer; } + + diff --git a/package-lock.json b/package-lock.json index b2d3c34..f26e345 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8754,6 +8754,11 @@ "is-plain-obj": "^1.0.0" } }, + "sortablejs": { + "version": "1.10.2", + "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.10.2.tgz", + "integrity": "sha512-YkPGufevysvfwn5rfdlGyrGjt7/CRHwvRPogD/lC+TnvcN29jDpCifKP+rBqf+LRldfXSTh+0CGLcSg0VIxq3A==" + }, "source-list-map": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz", @@ -9983,6 +9988,14 @@ "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", "dev": true }, + "vuedraggable": { + "version": "2.23.2", + "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.23.2.tgz", + "integrity": "sha512-PgHCjUpxEAEZJq36ys49HfQmXglattf/7ofOzUrW2/rRdG7tu6fK84ir14t1jYv4kdXewTEa2ieKEAhhEMdwkQ==", + "requires": { + "sortablejs": "^1.10.1" + } + }, "vuepress": { "version": "1.5.2", "resolved": "https://registry.npmjs.org/vuepress/-/vuepress-1.5.2.tgz", diff --git a/package.json b/package.json index e89c010..c869a2c 100755 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "@vuepress/plugin-medium-zoom": "^1.3.1" }, "dependencies": { - "axios": "^0.19.2" + "axios": "^0.19.2", + "vuedraggable": "^2.23.2" } }