From 574d45f914a33583633911f79cab1b530e090940 Mon Sep 17 00:00:00 2001 From: undefined Date: Fri, 28 Mar 2025 20:50:58 +0800 Subject: [PATCH] ui: autocomplete: fix component render --- .../frontend/autocomplete/autocomplete.scss | 2 +- packages/components/frontend/common.scss | 12 ++++++------ .../autocomplete/CustomSelectAutoComplete.tsx | 2 +- .../autocomplete/DomainSelectAutoComplete.tsx | 2 +- .../autocomplete/FileSelectAutoComplete.tsx | 2 +- .../autocomplete/ProblemSelectAutoComplete.tsx | 2 +- .../autocomplete/UserSelectAutoComplete.tsx | 2 +- packages/ui-default/templates/layout/html5.html | 1 - 8 files changed, 12 insertions(+), 13 deletions(-) diff --git a/packages/components/frontend/autocomplete/autocomplete.scss b/packages/components/frontend/autocomplete/autocomplete.scss index 67fe238fe..bae74b0cf 100644 --- a/packages/components/frontend/autocomplete/autocomplete.scss +++ b/packages/components/frontend/autocomplete/autocomplete.scss @@ -44,7 +44,7 @@ height: 30px; box-sizing: border-box; padding: 4px 6px; - width: 0; + width: 100%; min-width: 30px; flex-grow: 1; border: 0; diff --git a/packages/components/frontend/common.scss b/packages/components/frontend/common.scss index 9ab646fbe..b520ed3d3 100644 --- a/packages/components/frontend/common.scss +++ b/packages/components/frontend/common.scss @@ -3,7 +3,7 @@ @use "sass:math"; @function toRem($value) { - $remValue: math.div($value, 16) + rem; + $remValue: calc($value / 16px) * 1rem; @return $remValue; } @function rem($values) { @@ -63,7 +63,7 @@ $section-gap-v: 15px; $section-gap-h: $grid-padding; $section-list-v: 25px; $section-margin: 30px; -$section-shadow: 0 rem(6px) rem(22px) rgba(#AFC2C9, 0.5); +$section-shadow: rem(0 6px 22px) rgba(#AFC2C9, 0.5); $section-bg-color: $content-bg-color; $section-title-color: $header-2-color; $section-toolbtn-color: #AAA; @@ -74,13 +74,13 @@ $userselect-uid-color: #BBB; $editor-border-color: $border-1-color; -$datepicker-shadow: 0 rem(2px) rem(7px) rgba(#000, 0.3); +$datepicker-shadow: rem(0 2px 7px) rgba(#000, 0.3); $datapicker-list-item-bg-color-hover: #F0F0F0; $dialog-layer-bg-color: rgba(#F0F0F0, 0.6); $dialog-bg-color: $content-bg-color; $dialog-border-color: $border-1-color; -$dialog-shadow: 0 rem(2px) rem(10px) rgba(#000, 0.2); +$dialog-shadow: rem(0 2px 10px) rgba(#000, 0.2); $dialog-title-color: $header-2-color; $comment-placeholder-color: #AAA; @@ -88,10 +88,10 @@ $comment-op-color: lighten($text-1-color, 30%); $comment-op-link-color: lighten($text-1-color, 50%); $menu-item-bg-color-hover: #F4F4F4; -$menu-drop-shadow: 0 rem(2px) rem(7px) rgba(#000, 0.3); +$menu-drop-shadow: rem(0 2px 7px) rgba(#000, 0.3); $menu-drop-bg-color: $content-bg-color; $menu-drop-triangle-size: 4px; -$menu-drop-triangle-shadow: rem(-2px) rem(-2px) rem(2px) rgba(#000, 0.15); +$menu-drop-triangle-shadow: rem(-2px -2px 2px) rgba(#000, 0.15); $nav-item-height: 45px; $nav-item-hover-color: $primary-color; diff --git a/packages/ui-default/components/autocomplete/CustomSelectAutoComplete.tsx b/packages/ui-default/components/autocomplete/CustomSelectAutoComplete.tsx index 1c7b53989..807773e75 100644 --- a/packages/ui-default/components/autocomplete/CustomSelectAutoComplete.tsx +++ b/packages/ui-default/components/autocomplete/CustomSelectAutoComplete.tsx @@ -41,7 +41,7 @@ export default class CustomSelectAutoComplete extends Aut attach() { const value = this.$dom.val(); - ReactDOM.createRoot(this.container).render( + this.component.render( { this.ref = ref; }} data={this.options.data} diff --git a/packages/ui-default/components/autocomplete/DomainSelectAutoComplete.tsx b/packages/ui-default/components/autocomplete/DomainSelectAutoComplete.tsx index cd85102de..8a3e20331 100644 --- a/packages/ui-default/components/autocomplete/DomainSelectAutoComplete.tsx +++ b/packages/ui-default/components/autocomplete/DomainSelectAutoComplete.tsx @@ -31,7 +31,7 @@ export default class DomainSelectAutoComplete extends AutoComplete { attach() { const value = this.$dom.val(); - ReactDOM.createRoot(this.container).render( { this.ref = ref; }} value={value} onChange={this.onChange} diff --git a/packages/ui-default/components/autocomplete/FileSelectAutoComplete.tsx b/packages/ui-default/components/autocomplete/FileSelectAutoComplete.tsx index a30207072..bc017313a 100644 --- a/packages/ui-default/components/autocomplete/FileSelectAutoComplete.tsx +++ b/packages/ui-default/components/autocomplete/FileSelectAutoComplete.tsx @@ -44,7 +44,7 @@ export default class FileSelectAutoComplete extends AutoC attach() { const value = this.$dom.val(); - ReactDOM.createRoot(this.container).render( + this.component.render( { this.ref = ref; }} data={this.options.data} diff --git a/packages/ui-default/components/autocomplete/ProblemSelectAutoComplete.tsx b/packages/ui-default/components/autocomplete/ProblemSelectAutoComplete.tsx index daf773229..279c30f69 100644 --- a/packages/ui-default/components/autocomplete/ProblemSelectAutoComplete.tsx +++ b/packages/ui-default/components/autocomplete/ProblemSelectAutoComplete.tsx @@ -31,7 +31,7 @@ export default class ProblemSelectAutoComplete extends AutoComplete { attach() { const value = this.$dom.val(); - ReactDOM.createRoot(this.container).render( + this.component.render( { this.ref = ref; }} value={value} diff --git a/packages/ui-default/components/autocomplete/UserSelectAutoComplete.tsx b/packages/ui-default/components/autocomplete/UserSelectAutoComplete.tsx index 5976da3c4..71d697fcf 100644 --- a/packages/ui-default/components/autocomplete/UserSelectAutoComplete.tsx +++ b/packages/ui-default/components/autocomplete/UserSelectAutoComplete.tsx @@ -36,7 +36,7 @@ export default class UserSelectAutoComplete extends AutoC attach() { const value = this.$dom.val(); - ReactDOM.createRoot(this.container).render( + this.component.render( { this.ref = ref; }} value={value} diff --git a/packages/ui-default/templates/layout/html5.html b/packages/ui-default/templates/layout/html5.html index 243e7e8fd..2e28e7b4e 100644 --- a/packages/ui-default/templates/layout/html5.html +++ b/packages/ui-default/templates/layout/html5.html @@ -40,7 +40,6 @@ {% if process.env.DEV %} - {% else %} {% endif %}