This is an automated email from the ASF dual-hosted git repository.
jeffreyh pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/doris-website.git
The following commit(s) were added to refs/heads/master by this push:
new 320436c0082 fix:searchbar style (#1475)
320436c0082 is described below
commit 320436c0082b78b13888f85535790ab5555a8d71
Author: yangon <[email protected]>
AuthorDate: Mon Dec 9 10:56:24 2024 +0800
fix:searchbar style (#1475)
fix:
Co-authored-by: liyang <[email protected]>
---
src/scss/components/navbar.scss | 58 +----------------
src/theme/SearchBar/SearchBar.module.css | 106 +++++++++++++++++++++++--------
2 files changed, 82 insertions(+), 82 deletions(-)
diff --git a/src/scss/components/navbar.scss b/src/scss/components/navbar.scss
index 0dc57d431e6..0680fc92019 100644
--- a/src/scss/components/navbar.scss
+++ b/src/scss/components/navbar.scss
@@ -21,60 +21,6 @@
width: 38vw;
top: 12px;
max-width: 443px;
-
- .navbar__search > :last-child {
- position: absolute;
- right: 10x;
- top: 50%;
- transform: translateY(-50%);
- display: flex !important;
- align-items: center;
- justify-content: center;
- padding: 5px 7px;
- background-color: #fff;
- border: none;
- gap: 2px;
- height: auto;
- }
- .navbar__search kbd {
- color: #8592a6 !important;
- background-color: #ffffff !important;
- border: none !important;
- border-radius: none !important;
- box-shadow: none !important;
- font-size: 12px !important;
- padding: 0 !important;
- }
- .navbar__search > span {
- width: 100% !important;
- left: auto !important;
- right: 0 !important;
- display: inline !important;
- background: transparent;
- border-radius: 6px;
- margin-top: 8px;
- width: var(--search-local-modal-width, 560px);
- position: relative;
- padding: 0 !important;
- }
- .navbar__search input {
- width: 100% !important;
- border: none !important;
- background-color: #f7f9fe !important;
- background-image: url('/static/images/search-icon.svg');
- height: 2.5rem !important;
- background-position: 0.625rem center !important;
- padding-left: 2.25rem !important;
- color: #4c576c !important;
- border-radius: 0.5rem;
- }
- .navbar__search input:focus {
- border: none !important;
- outline: none !important;
- }
- .navbar__search span span {
- top: 2.5rem !important;
- }
}
}
@@ -432,8 +378,8 @@
}
.docs {
svg {
- width: 8.125rem;
- height: 1.5625rem;
+ width: 11rem;
+ height: 2rem;
}
}
}
diff --git a/src/theme/SearchBar/SearchBar.module.css
b/src/theme/SearchBar/SearchBar.module.css
index 077a0dd8bed..c4c0f0f7220 100644
--- a/src/theme/SearchBar/SearchBar.module.css
+++ b/src/theme/SearchBar/SearchBar.module.css
@@ -4,11 +4,9 @@
background: var(--search-local-modal-background, #f5f6f7);
border-radius: 6px;
- box-shadow: var(
- --search-local-modal-shadow,
- inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5),
- 0 3px 8px 0 #555a64
- );
+ box-shadow: var(--search-local-modal-shadow,
+ inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5),
+ 0 3px 8px 0 #555a64);
margin-top: 8px;
width: var(--search-local-modal-width, 560px);
position: relative;
@@ -36,11 +34,9 @@
html[data-theme="dark"] .searchBar .dropdownMenu {
background: var(--search-local-modal-background,
var(--ifm-background-color));
- box-shadow: var(
- --search-local-modal-shadow,
- inset 1px 1px 0 0 #2c2e40,
- 0 3px 8px 0 #000309
- );
+ box-shadow: var(--search-local-modal-shadow,
+ inset 1px 1px 0 0 #2c2e40,
+ 0 3px 8px 0 #000309);
}
.searchBar .dropdownMenu .suggestion {
@@ -69,10 +65,8 @@ html[data-theme="dark"] .dropdownMenu .suggestion {
}
.searchBar .dropdownMenu .suggestion.cursor {
- background-color: var(
- --search-local-highlight-color,
- var(--ifm-color-primary)
- );
+ background-color: var(--search-local-highlight-color,
+ var(--ifm-color-primary));
}
.hitTree,
@@ -95,7 +89,7 @@ html[data-theme="dark"] .noResultsIcon {
align-items: center;
}
-.hitTree > svg {
+.hitTree>svg {
height: var(--search-local-hit-height, 56px);
opacity: 0.5;
stroke-width: var(--search-local-icon-stroke-width, 1.4);
@@ -145,7 +139,7 @@ html[data-theme="dark"] .noResultsIcon {
width: 20px;
}
-.hideAction > svg {
+.hideAction>svg {
display: none;
}
@@ -171,7 +165,7 @@ html[data-theme="dark"] .noResultsIcon {
text-decoration: underline;
}
-.cursor .hideAction > svg {
+.cursor .hideAction>svg {
display: block;
}
@@ -180,10 +174,8 @@ html[data-theme="dark"] .noResultsIcon {
.suggestion.cursor .hitTree,
.suggestion.cursor .hitIcon,
.suggestion.cursor .hitPath {
- color: var(
- --search-local-hit-active-color,
- var(--ifm-color-white)
- ) !important;
+ color: var(--search-local-hit-active-color,
+ var(--ifm-color-white)) !important;
}
.suggestion.cursor mark {
@@ -214,6 +206,65 @@ html[data-theme="dark"] .noResultsIcon {
:global(.navbar__search) {
position: relative;
+
+ .searchBar {
+ width: 100% !important;
+ left: auto !important;
+ right: 0 !important;
+ display: inline !important;
+ background: transparent;
+ border-radius: 6px;
+ margin-top: 8px;
+ width: var(--search-local-modal-width, 560px);
+ position: relative;
+ padding: 0 !important;
+ }
+
+ input {
+ width: 100% !important;
+ border: none !important;
+ background-color: #f7f9fe !important;
+ background-image: url('/static/images/search-icon.svg');
+ height: 2.5rem !important;
+ background-position: 0.625rem center !important;
+ padding-left: 2.25rem !important;
+ color: #4c576c !important;
+ border-radius: 0.5rem;
+ }
+
+ input:focus {
+ border: none !important;
+ outline: none !important;
+ }
+
+ .dropdownMenu {
+ top: 2.5rem !important;
+ }
+
+ kbd {
+ color: #8592a6 !important;
+ background-color: #ffffff !important;
+ border: none !important;
+ border-radius: none !important;
+ box-shadow: none !important;
+ font-size: 12px !important;
+ padding: 0 !important;
+ }
+
+ .searchHintContainer {
+ position: absolute;
+ right: 10x;
+ top: 50%;
+ transform: translateY(-50%);
+ display: flex !important;
+ align-items: center;
+ justify-content: center;
+ padding: 5px 7px;
+ background-color: #fff;
+ border: none;
+ gap: 2px;
+ height: auto;
+ }
}
.searchIndexLoading :global(.navbar__search-input) {
@@ -244,6 +295,7 @@ html[data-theme="dark"] .noResultsIcon {
}
@media (max-width: 576px) {
+
.searchBarContainer:not(.focused) .searchClearButton,
.searchHintContainer {
display: none;
@@ -274,12 +326,14 @@ html[dir="rtl"] :global(.navbar__search-input) {
}
.hint {
}
+
.suggestions {
max-height: 500px !important;
overflow: scroll !important;
}
-.dataset {
-}
-.empty {
-}
-/**/
+
+.dataset {}
+
+.empty {}
+
+/**/
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
