Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2025-11-13 17:05:43 +01:00
Code Issues Packages Projects Releases Activity

Fix colors in autocomplete component (#1905)

Browse Source 
Further fixes for the high contrast mode, modly regarded to the autocomplete component.

This is a fixup for #1892

Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>
This commit is contained in:
René Pfeuffer
2021-12-22 14:07:03 +01:00
committed by GitHub
parent bc86ed4474
commit 37f89bed77
4 changed files with 53 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
scm-ui/ui-styles/src/components/_main.scss
View File

@@ -568,7 +568,6 @@ form .field:not(.is-grouped) {
.select select,
.textarea,
.file-name {
border-color: $blue-light;
box-shadow: none;
}
@@ -811,11 +810,48 @@ form .field:not(.is-grouped) {
color: $text !important;
}
.autocomplete-entry > div {
border-color: $blue-light;
&:hover,
&.is-hovered {
border-color: #4a4a4a;
}
.autocomplete-entry__option--is-focused {
background-color: $link !important;
color: $link-invert !important;
}
.autocomplete-entry__option--is-selected {
// TODO better use link-light or something
background-color: $blue-light !important;
color: $link-invert !important;
}
.autocomplete-entry__single-value {
color: $text !important;
}
.autocomplete-entry > div {
color: $text-strong !important;
}
.autocomplete-entry__menu {
background-color: $background !important;
}
.autocomplete-entry__control {
background-color: $scheme-main !important;
border-color: $input-border-color !important;
}
.autocomplete-entry__control:hover {
border-color: $input-hover-border-color !important;
}
.autocomplete-entry__control--is-focused {
border-color: $input-focus-border-color !important;
box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color !important;
}
.autocomplete-entry__control--is-focused:hover {
border-color: $input-focus-border-color !important;
box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color !important;
}
.autocomplete-entry__input {
color: $text-strong !important;
}

23
scm-ui/ui-styles/src/highcontrast.scss
View File

@@ -452,6 +452,10 @@ a.has-text-secondary-most:focus {
background-color: $white !important;
}
.has-background-light {
color: $grey-dark;
}
.has-hover-visible:hover {
color: $white-bis !important;
}
@@ -482,22 +486,3 @@ fieldset[disabled] .input::placeholder {
border: 1px solid $info;
box-shadow: none;
}
.autocomplete-entry > div {
background-color: $scheme-main;
color: $white-bis;
/* Text input */
&:nth-child(2) * {
color: $white-bis;
}
/* Suggestions */
&:nth-child(3) {
border: 1px solid $info;
> div div:hover {
background-color: #4672fe !important;
}
}
}

2
scm-ui/ui-styles/src/variables/_commons.scss
View File

@@ -32,3 +32,5 @@ $blue-light: #98d8f3;
$danger: #ff3860;
$family-monospace: "Courier New", Monaco, Menlo, "Ubuntu Mono", "source-code-pro", monospace;
$input-border-color: $blue-light;