ui: autocomplete: fix component render

This commit is contained in:
undefined committed 2025-03-28 20:50:58 +08:00
1 parent 8e8ab22561
commit 574d45f914
8 files changed
+12 -13

No files matched your search

@@ -44,7 +44,7 @@
height: 30px; height: 30px;
box-sizing: border-box; box-sizing: border-box;
padding: 4px 6px; padding: 4px 6px;
width: 0; width: 100%;
min-width: 30px; min-width: 30px;
flex-grow: 1; flex-grow: 1;
border: 0; border: 0;
+6 -6
View File
@@ -3,7 +3,7 @@
@use "sass:math"; @use "sass:math";
@function toRem($value) { @function toRem($value) {
$remValue: math.div($value, 16) + rem; $remValue: calc($value / 16px) * 1rem;
@return $remValue; @return $remValue;
} }
@function rem($values) { @function rem($values) {
@@ -63,7 +63,7 @@ $section-gap-v: 15px;
$section-gap-h: $grid-padding; $section-gap-h: $grid-padding;
$section-list-v: 25px; $section-list-v: 25px;
$section-margin: 30px; $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-bg-color: $content-bg-color;
$section-title-color: $header-2-color; $section-title-color: $header-2-color;
$section-toolbtn-color: #AAA; $section-toolbtn-color: #AAA;
@@ -74,13 +74,13 @@ $userselect-uid-color: #BBB;
$editor-border-color: $border-1-color; $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; $datapicker-list-item-bg-color-hover: #F0F0F0;
$dialog-layer-bg-color: rgba(#F0F0F0, 0.6); $dialog-layer-bg-color: rgba(#F0F0F0, 0.6);
$dialog-bg-color: $content-bg-color; $dialog-bg-color: $content-bg-color;
$dialog-border-color: $border-1-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; $dialog-title-color: $header-2-color;
$comment-placeholder-color: #AAA; $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%); $comment-op-link-color: lighten($text-1-color, 50%);
$menu-item-bg-color-hover: #F4F4F4; $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-bg-color: $content-bg-color;
$menu-drop-triangle-size: 4px; $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-height: 45px;
$nav-item-hover-color: $primary-color; $nav-item-hover-color: $primary-color;
@@ -41,7 +41,7 @@ export default class CustomSelectAutoComplete<Multi extends boolean> extends Aut
attach() { attach() {
const value = this.$dom.val(); const value = this.$dom.val();
ReactDOM.createRoot(this.container).render( this.component.render(
<Component <Component
ref={(ref) => { this.ref = ref; }} ref={(ref) => { this.ref = ref; }}
data={this.options.data} data={this.options.data}
@@ -31,7 +31,7 @@ export default class DomainSelectAutoComplete extends AutoComplete {
attach() { attach() {
const value = this.$dom.val(); const value = this.$dom.val();
ReactDOM.createRoot(this.container).render(<Component this.component.render(<Component
ref={(ref) => { this.ref = ref; }} ref={(ref) => { this.ref = ref; }}
value={value} value={value}
onChange={this.onChange} onChange={this.onChange}
@@ -44,7 +44,7 @@ export default class FileSelectAutoComplete<Multi extends boolean> extends AutoC
attach() { attach() {
const value = this.$dom.val(); const value = this.$dom.val();
ReactDOM.createRoot(this.container).render( this.component.render(
<Component <Component
ref={(ref) => { this.ref = ref; }} ref={(ref) => { this.ref = ref; }}
data={this.options.data} data={this.options.data}
@@ -31,7 +31,7 @@ export default class ProblemSelectAutoComplete extends AutoComplete {
attach() { attach() {
const value = this.$dom.val(); const value = this.$dom.val();
ReactDOM.createRoot(this.container).render( this.component.render(
<Component <Component
ref={(ref) => { this.ref = ref; }} ref={(ref) => { this.ref = ref; }}
value={value} value={value}
@@ -36,7 +36,7 @@ export default class UserSelectAutoComplete<Multi extends boolean> extends AutoC
attach() { attach() {
const value = this.$dom.val(); const value = this.$dom.val();
ReactDOM.createRoot(this.container).render( this.component.render(
<Component <Component
ref={(ref) => { this.ref = ref; }} ref={(ref) => { this.ref = ref; }}
value={value} value={value}
@@ -40,7 +40,6 @@
</style> </style>
{% if process.env.DEV %} {% if process.env.DEV %}
<script src="/default.theme.js?version={{ global.Hydro.version['ui-default'] }}"></script> <script src="/default.theme.js?version={{ global.Hydro.version['ui-default'] }}"></script>
<link rel="stylesheet" media="all" href="/theme.css?version={{ global.Hydro.version['ui-default'] }}">
{% else %} {% else %}
<link rel="stylesheet" media="all" href="{{ UiContext.cdn_prefix }}theme-{{ global.Hydro.version['ui-default'] }}.css"> <link rel="stylesheet" media="all" href="{{ UiContext.cdn_prefix }}theme-{{ global.Hydro.version['ui-default'] }}.css">
{% endif %} {% endif %}