aboutsummaryrefslogtreecommitdiffstats
path: root/core/src
diff options
context:
space:
mode:
Diffstat (limited to 'core/src')
-rw-r--r--core/src/components/UnifiedSearch/SearchResult.vue125
-rw-r--r--core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue1
-rw-r--r--core/src/jquery/css/jquery-ui-fixes.scss18
-rw-r--r--core/src/jquery/css/jquery.ocdialog.scss8
-rw-r--r--core/src/views/LegacyUnifiedSearch.vue26
-rw-r--r--core/src/views/Login.vue1
-rw-r--r--core/src/views/UnsupportedBrowser.vue3
7 files changed, 100 insertions, 82 deletions
diff --git a/core/src/components/UnifiedSearch/SearchResult.vue b/core/src/components/UnifiedSearch/SearchResult.vue
index 93e104f1a20..231ac97642c 100644
--- a/core/src/components/UnifiedSearch/SearchResult.vue
+++ b/core/src/components/UnifiedSearch/SearchResult.vue
@@ -106,68 +106,67 @@ $clickable-area: 44px;
$margin: 10px;
.result-items {
- &__item {
-
- ::v-deep a {
- border-radius: 12px;
- border: 2px solid transparent;
- border-radius: var(--border-radius-large) !important;
-
- &--focused {
- background-color: var(--color-background-hover);
- }
-
- &:active,
- &:hover,
- &:focus {
- background-color: var(--color-background-hover);
- border: 2px solid var(--color-border-maxcontrast);
- }
-
- * {
- cursor: pointer;
- }
-
- }
-
- &-icon {
- overflow: hidden;
- width: $clickable-area;
- height: $clickable-area;
- border-radius: var(--border-radius);
- background-repeat: no-repeat;
- background-position: center center;
- background-size: 32px;
-
- &--rounded {
- border-radius: math.div($clickable-area, 2);
- }
-
- &--no-preview {
- background-size: 32px;
- }
-
- &--with-thumbnail {
- background-size: cover;
- }
-
- &--with-thumbnail:not(&--rounded) {
- // compensate for border
- max-width: $clickable-area - 2px;
- max-height: $clickable-area - 2px;
- border: 1px solid var(--color-border);
- }
-
- img {
- // Make sure to keep ratio
- width: 100%;
- height: 100%;
-
- object-fit: cover;
- object-position: center;
- }
- }
-
- }
+ &__item:deep {
+
+ a {
+ border: 2px solid transparent;
+ border-radius: var(--border-radius-large) !important;
+
+ &--focused {
+ background-color: var(--color-background-hover);
+ }
+
+ &:active,
+ &:hover,
+ &:focus {
+ background-color: var(--color-background-hover);
+ border: 2px solid var(--color-border-maxcontrast);
+ }
+
+ * {
+ cursor: pointer;
+ }
+
+ }
+
+ &-icon {
+ overflow: hidden;
+ width: $clickable-area;
+ height: $clickable-area;
+ border-radius: var(--border-radius);
+ background-repeat: no-repeat;
+ background-position: center center;
+ background-size: 32px;
+
+ &--rounded {
+ border-radius: math.div($clickable-area, 2);
+ }
+
+ &--no-preview {
+ background-size: 32px;
+ }
+
+ &--with-thumbnail {
+ background-size: cover;
+ }
+
+ &--with-thumbnail:not(&--rounded) {
+ // compensate for border
+ max-width: $clickable-area - 2px;
+ max-height: $clickable-area - 2px;
+ border: 1px solid var(--color-border);
+ }
+
+ img {
+ // Make sure to keep ratio
+ width: 100%;
+ height: 100%;
+
+ object-fit: cover;
+ object-position: center;
+ }
+ }
+
+ }
}
</style>
diff --git a/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue b/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue
index 44d1d716375..67853490d9f 100644
--- a/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue
+++ b/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue
@@ -93,7 +93,6 @@ function clearAndCloseSearch() {
<style scoped lang="scss">
.local-unified-search {
--local-search-width: min(calc(250px + v-bind('searchGlobalButtonCSSWidth')), 95vw);
-
box-sizing: border-box;
position: relative;
height: var(--header-height);
diff --git a/core/src/jquery/css/jquery-ui-fixes.scss b/core/src/jquery/css/jquery-ui-fixes.scss
index a5fee7ea0d9..637f4bfe14b 100644
--- a/core/src/jquery/css/jquery-ui-fixes.scss
+++ b/core/src/jquery/css/jquery-ui-fixes.scss
@@ -9,14 +9,17 @@
background: var(--color-main-background) none;
color: var(--color-main-text);
}
+
.ui-widget-content a {
color: var(--color-main-text);
}
+
.ui-widget-header {
border: none;
color: var(--color-main-text);
background-image: none;
}
+
.ui-widget-header a {
color: var(--color-main-text);
}
@@ -31,11 +34,13 @@
font-weight: bold;
color: #555;
}
+
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
color: #555;
}
+
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
@@ -47,12 +52,14 @@
font-weight: bold;
color: var(--color-main-text);
}
+
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited {
color: var(--color-main-text);
}
+
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
@@ -61,6 +68,7 @@
font-weight: bold;
color: var(--color-main-text);
}
+
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
@@ -77,11 +85,13 @@
color: var(--color-text-light);
font-weight: 600;
}
+
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
color: var(--color-text-lighter);
}
+
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
@@ -89,11 +99,13 @@
background: var(--color-error) none;
color: #ffffff;
}
+
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
color: #ffffff;
}
+
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
@@ -105,20 +117,25 @@
.ui-state-default .ui-icon {
background-image: url('images/ui-icons_1d2d44_256x240.png');
}
+
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
background-image: url('images/ui-icons_1d2d44_256x240.png');
}
+
.ui-state-active .ui-icon {
background-image: url('images/ui-icons_1d2d44_256x240.png');
}
+
.ui-state-highlight .ui-icon {
background-image: url('images/ui-icons_ffffff_256x240.png');
}
+
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
background-image: url('images/ui-icons_ffd27a_256x240.png');
}
+
.ui-icon.ui-icon-none {
display: none;
}
@@ -130,6 +147,7 @@
background: #666666 url('images/ui-bg_diagonals-thick_20_666666_40x40.png') 50% 50% repeat;
opacity: .5;
}
+
.ui-widget-shadow {
margin: -5px 0 0 -5px;
padding: 5px;
diff --git a/core/src/jquery/css/jquery.ocdialog.scss b/core/src/jquery/css/jquery.ocdialog.scss
index a1946bc648f..b950d98c381 100644
--- a/core/src/jquery/css/jquery.ocdialog.scss
+++ b/core/src/jquery/css/jquery.ocdialog.scss
@@ -19,14 +19,16 @@
max-width: calc(100% - 20px);
overflow: auto;
}
+
.oc-dialog-title {
background: var(--color-main-background);
}
+
.oc-dialog-buttonrow {
position: relative;
display: flex;
background: transparent;
- right: 0;
+ inset-inline-end: 0;
bottom: 0;
padding: 0;
padding-top: 10px;
@@ -57,7 +59,7 @@
width: 44px !important;
height: 44px !important;
top: 4px;
- right: 4px;
+ inset-inline-end: 4px;
padding: 25px;
background: var(--icon-close-dark) no-repeat center;
opacity: .5;
@@ -76,7 +78,7 @@
z-index: 100001;
position: fixed;
top: 0;
- left: 0;
+ inset-inline-start: 0;
width: 100%;
height: 100%;
}
diff --git a/core/src/views/LegacyUnifiedSearch.vue b/core/src/views/LegacyUnifiedSearch.vue
index fdf4c95a4cc..0bb55dc53e4 100644
--- a/core/src/views/LegacyUnifiedSearch.vue
+++ b/core/src/views/LegacyUnifiedSearch.vue
@@ -728,16 +728,6 @@ $input-padding: 10px;
}
}
- &__form-input {
- margin: 0 !important;
- &:focus,
- &:focus-visible,
- &:active {
- border-color: 2px solid var(--color-main-text) !important;
- box-shadow: 0 0 0 2px var(--color-main-background) !important;
- }
- }
-
&__input-row {
display: flex;
width: 100%;
@@ -774,6 +764,13 @@ $input-padding: 10px;
height: $input-height;
padding: $input-padding;
+ &:focus,
+ &:focus-visible,
+ &:active {
+ border-color: 2px solid var(--color-main-text) !important;
+ box-shadow: 0 0 0 2px var(--color-main-background) !important;
+ }
+
&,
&[placeholder],
&::placeholder {
@@ -791,7 +788,8 @@ $input-padding: 10px;
}
}
- &-reset, &-submit {
+ &-reset,
+ &-submit {
position: absolute;
top: 0;
inset-inline-end: 4px;
@@ -832,16 +830,16 @@ $input-padding: 10px;
}
}
- .unified-search__result-more::v-deep {
+ :deep(.unified-search__result-more) {
color: var(--color-text-maxcontrast);
}
.empty-content {
margin: 10vh 0;
- ::v-deep .empty-content__title {
+ :deep(.empty-content__title) {
font-weight: normal;
- font-size: var(--default-font-size);
+ font-size: var(--default-font-size);
text-align: center;
}
}
diff --git a/core/src/views/Login.vue b/core/src/views/Login.vue
index d6c88d607ad..a13109bb766 100644
--- a/core/src/views/Login.vue
+++ b/core/src/views/Login.vue
@@ -196,6 +196,7 @@ body {
.fade-enter-active, .fade-leave-active {
transition: opacity .3s;
}
+
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
diff --git a/core/src/views/UnsupportedBrowser.vue b/core/src/views/UnsupportedBrowser.vue
index daeac632e3c..d8d7dc55208 100644
--- a/core/src/views/UnsupportedBrowser.vue
+++ b/core/src/views/UnsupportedBrowser.vue
@@ -164,7 +164,8 @@ $spacing: 30px;
.empty-content {
margin: 0;
- &::v-deep .empty-content__icon {
+
+ :deep(.empty-content__icon) {
opacity: 1;
}
}
generated by cgit v1.2.3 (git 2.39.1) at 2025-04-25 18:20:56 +0000