move and remove styles

galaxyproject · Jan 19, 2024 · ccb788d · ccb788d
1 parent 293f8c3
commit ccb788d
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 104 deletions.
diff --git a/client/src/components/TagsMultiselect/HeadlessMultiselect.vue b/client/src/components/TagsMultiselect/HeadlessMultiselect.vue
@@ -318,10 +318,11 @@ const bounds = useElementBounding(root);
     left: var(--left);
 
     width: var(--width);
-    height: min(400px, calc(100% - var(--top) - var(--height) - 12px));
+    height: min(300px, calc(100% - var(--top) - var(--height) - 12px));
 
     display: flex;
     flex-direction: column;
+    box-shadow: 0 0 6px 0 rgba(3, 0, 34, 0.048), 0 0 4px 0 rgba(3, 0, 34, 0.185);
 
     .headless-multiselect__option {
         padding: 0.5rem;

diff --git a/client/src/components/TagsMultiselect/StatelessTags.vue b/client/src/components/TagsMultiselect/StatelessTags.vue
@@ -206,108 +206,5 @@ function onTagClicked(tag: string) {
         width: 100%;
         height: 1.75rem;
     }
-
-    &:deep(.multiselect) {
-        min-height: unset;
-        display: flex;
-        flex-direction: column-reverse;
-
-        .multiselect__select {
-            top: unset;
-            bottom: 0;
-            padding: 0;
-            z-index: 1;
-            height: $font-size-base * 2;
-
-            &::before {
-                border-color: $text-color transparent transparent;
-            }
-        }
-
-        .multiselect__placeholder {
-            display: none;
-        }
-
-        .multiselect__tags-wrap {
-            margin-bottom: 0.5rem;
-        }
-
-        .multiselect__tags {
-            padding: 0;
-            background: none;
-            font-size: $font-size-base;
-            border: none;
-            min-height: 0;
-        }
-
-        .multiselect__content-wrapper {
-            top: 100%;
-            z-index: 800;
-            width: calc(100% - 4px);
-            box-shadow: 0 0 6px 0 rgba(3, 0, 34, 0.048), 0 0 4px 0 rgba(3, 0, 34, 0.185);
-        }
-
-        &.multiselect--above .multiselect__content-wrapper {
-            top: unset;
-        }
-
-        // built in option class
-        .multiselect__option {
-            min-height: unset;
-            padding: 0;
-
-            &::after {
-                display: none;
-            }
-
-            // custom option wrapper
-            .multiselect-option {
-                font-size: $font-size-base;
-                padding: 0.5rem;
-                display: inline-block;
-                width: 100%;
-                height: 100%;
-
-                .info {
-                    display: none;
-                }
-
-                &.invalid {
-                    color: $brand-light;
-                    background-color: $brand-warning;
-                }
-            }
-        }
-
-        .multiselect__option--selected {
-            .multiselect-option {
-                color: $brand-primary;
-                background-color: $brand-secondary;
-
-                .info:not(.highlighted) {
-                    display: inline-block;
-                }
-            }
-        }
-
-        .multiselect__option--highlight {
-            &::after {
-                display: none;
-            }
-
-            .multiselect-option {
-                background: $brand-primary;
-                color: $brand-light;
-
-                .info.highlighted {
-                    display: inline-block;
-                }
-
-                .info:not(.highlighted) {
-                    display: none;
-                }
-            }
-        }
-    }
 }
 </style>