You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@answer.apache.org by sh...@apache.org on 2025/03/25 09:18:46 UTC
(answer) 02/02: fix: run prettier to format codes
This is an automated email from the ASF dual-hosted git repository.
shuai pushed a commit to branch ui-optimization
in repository https://gitbox.apache.org/repos/asf/answer.git
commit 5d1b9dcf383e27aad56afc459c5a403d7a8ac3db
Author: shuai <li...@sifou.com>
AuthorDate: Tue Mar 25 17:11:44 2025 +0800
fix: run prettier to format codes
---
ui/src/common/_variable.scss | 6 +-
ui/src/common/color.scss | 73 +++++++++++-----------
ui/src/components/AccordionNav/index.css | 2 +-
ui/src/components/Header/index.scss | 23 ++++---
.../InitialLoadingPlaceholder/index.scss | 10 +--
ui/src/components/QueryGroup/index.scss | 1 -
ui/src/components/SchemaForm/README.md | 36 ++++++++---
ui/src/components/TagSelector/index.scss | 1 -
ui/src/index.scss | 19 +++---
.../Detail/components/InviteToAnswer/index.scss | 1 -
ui/src/pages/Questions/Detail/index.scss | 5 +-
.../components/Achievements/index.scss | 2 +-
ui/src/pages/Users/Notifications/index.scss | 2 +-
13 files changed, 101 insertions(+), 80 deletions(-)
diff --git a/ui/src/common/_variable.scss b/ui/src/common/_variable.scss
index 1ef5a345..341705b6 100644
--- a/ui/src/common/_variable.scss
+++ b/ui/src/common/_variable.scss
@@ -19,7 +19,7 @@
$link-hover-decoration: none;
$enable-negative-margins: true;
-$blue: #0033FF !default;
-$placeholder-opacity-max: .2;
-$placeholder-opacity-min: .1;
+$blue: #0033ff !default;
+$placeholder-opacity-max: 0.2;
+$placeholder-opacity-min: 0.1;
$enable-smooth-scroll: false;
diff --git a/ui/src/common/color.scss b/ui/src/common/color.scss
index e82624fe..9970ab78 100644
--- a/ui/src/common/color.scss
+++ b/ui/src/common/color.scss
@@ -17,8 +17,6 @@
* under the License.
*/
-
-
:root {
--an-side-nav-link: rgba(0, 0, 0, 0.65);
--an-toolbar-divider: rgba(0, 0, 0, 0.1);
@@ -29,46 +27,45 @@
--an-212529: #212529;
--an-gray-300: var(--bs-gray-300);
--an-white: #fff;
- --an-inbox-warning:#fff3cd80;
+ --an-inbox-warning: #fff3cd80;
--an-f5: #f5f5f5;
- --an-answer-item-border-top: rgba(0, 0, 0, .125);
+ --an-answer-item-border-top: rgba(0, 0, 0, 0.125);
--an-answer-inbox-nav-border-top: var(--bs-border-color);
- --an-comment-item-border-bottom: var(--bs-colors-gray-200, #E9ECEF);
+ --an-comment-item-border-bottom: var(--bs-colors-gray-200, #e9ecef);
--an-editor-toolbar-hover: #f8f9fa;
--ans-editor-toolbar-focus: #dae0e5;
--an-editor-placeholder-color: #6c757d;
- --an-side-nav-link-hover-color: rgba(0, 0, 0, .85);
+ --an-side-nav-link-hover-color: rgba(0, 0, 0, 0.85);
--an-invite-answer-item-active: #e9ecef;
--an-alert-exist-color: #055160;
}
+[data-bs-theme='dark'] {
+ --an-side-nav-link: rgba(255, 255, 255, 0.65);
+ --an-toolbar-divider: rgba(255, 255, 255, 0.3);
+ --an-ced4da: var(--bs-border-color);
+ --an-e9ecef: #161b22;
+ --an-pre: #161b22;
+ --an-6c757d: var(--bs-body-color);
+ --an-212529: var(--bs-body-color);
+ --an-gray-300: #161b22;
+ --an-white: #000;
+ --an-inbox-warning: #38363180;
+ --an-f5: var(--bs-body-bg);
+ --an-answer-item-border-top: var(--bs-border-color);
+ --an-answer-inbox-nav-border-top: var(--bs-border-color);
+ --an-comment-item-border-bottom: var(--bs-border-color);
+ --an-editor-toolbar-hover: var(--bs-tertiary-bg);
+ --ans-editor-toolbar-focus: var(--bs-tertiary-bg);
+ --an-editor-placeholder-color: var(--bs-body-color);
+ --an-side-nav-link-hover-color: var(--bs-body-color);
+ --an-invite-answer-item-active: var(--bs-tertiary-bg);
+ --an-alert-exist-color: #60cee4;
+}
-[data-bs-theme="dark"] {
- --an-side-nav-link: rgba(255, 255, 255, 0.65);
- --an-toolbar-divider: rgba(255, 255, 255, 0.3);
- --an-ced4da: var(--bs-border-color);
- --an-e9ecef: #161b22;
- --an-pre: #161b22;
- --an-6c757d: var(--bs-body-color);
- --an-212529: var(--bs-body-color);
- --an-gray-300: #161b22;
- --an-white: #000;
- --an-inbox-warning:#38363180;
- --an-f5: var(--bs-body-bg);
- --an-answer-item-border-top: var(--bs-border-color);
- --an-answer-inbox-nav-border-top: var(--bs-border-color);
- --an-comment-item-border-bottom: var(--bs-border-color);
- --an-editor-toolbar-hover: var(--bs-tertiary-bg);
- --ans-editor-toolbar-focus: var(--bs-tertiary-bg);
- --an-editor-placeholder-color: var(--bs-body-color);
- --an-side-nav-link-hover-color: var(--bs-body-color);
- --an-invite-answer-item-active: var(--bs-tertiary-bg);
- --an-alert-exist-color: #60cee4;
- }
-
-[data-bs-theme="dark"] {
+[data-bs-theme='dark'] {
.link-dark {
- color: rgba(var(--bs-emphasis-color-rgb),0.8)!important;
+ color: rgba(var(--bs-emphasis-color-rgb), 0.8) !important;
}
/** CodeMirror **/
@@ -81,9 +78,9 @@
border-left-color: var(--bs-body-color);
}
.ͼ2.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground {
- background-color: #3E4451;
+ background-color: #3e4451;
}
- /** link color **/
+ /** link color **/
.ͼc {
color: rgb(60, 138, 233);
}
@@ -91,8 +88,10 @@
color: var(--bs-body-color);
}
- .ͼ2 .cm-selectionBackground {background: #3E4451;}
- /** CodeMirror end **/
+ .ͼ2 .cm-selectionBackground {
+ background: #3e4451;
+ }
+ /** CodeMirror end **/
.bg-light {
background-color: rgba(0, 0, 0, 0.5) !important;
@@ -103,7 +102,8 @@
}
/** side nav **/
#sideNav {
- .nav-link:hover, .nav-link.active {
+ .nav-link:hover,
+ .nav-link.active {
background-color: #2b3035 !important;
}
}
@@ -136,5 +136,4 @@
.view-level3 {
color: $orange-100;
}
-
}
diff --git a/ui/src/components/AccordionNav/index.css b/ui/src/components/AccordionNav/index.css
index da5dad70..68e2ba56 100644
--- a/ui/src/components/AccordionNav/index.css
+++ b/ui/src/components/AccordionNav/index.css
@@ -18,7 +18,7 @@
*/
.collapse-indicator {
- transition: all .2s ease;
+ transition: all 0.2s ease;
}
.expanding .collapse-indicator {
diff --git a/ui/src/components/Header/index.scss b/ui/src/components/Header/index.scss
index f4fb9082..822c15bd 100644
--- a/ui/src/components/Header/index.scss
+++ b/ui/src/components/Header/index.scss
@@ -20,10 +20,12 @@
@import 'bootstrap/scss/functions';
@import 'bootstrap/scss/variables';
#header {
- transform: translate3d(0,0,0);
+ transform: translate3d(0, 0, 0);
--bs-navbar-padding-y: 0.75rem;
background: var(--bs-primary);
- box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15), 0 0.125rem 0.25rem rgb(0 0 0 / 8%);
+ box-shadow:
+ inset 0 -1px 0 rgba(0, 0, 0, 0.15),
+ 0 0.125rem 0.25rem rgb(0 0 0 / 8%);
.logo {
max-height: 2rem;
}
@@ -45,7 +47,7 @@
}
.lg-none {
- display: none!important;
+ display: none !important;
}
.hr {
@@ -58,8 +60,8 @@
padding-left: 42px;
box-shadow: none;
color: #fff;
- background-color: rgba(255, 255, 255, .2);
- border: $border-width $border-style rgba(255, 255, 255, .2);
+ background-color: rgba(255, 255, 255, 0.2);
+ border: $border-width $border-style rgba(255, 255, 255, 0.2);
&:focus {
border: $border-width $border-style $border-color;
}
@@ -82,7 +84,7 @@
padding-left: 42px;
box-shadow: none;
color: var(--bs-body-color);
- background-color: rgba(255, 255, 255, .2);
+ background-color: rgba(255, 255, 255, 0.2);
border: $border-width $border-style #dee2e6;
&:focus {
border: $border-width $border-style $border-color;
@@ -97,7 +99,7 @@
}
.maxw-400 {
- max-width: 400px;;
+ max-width: 400px;
}
.search-wrap {
@@ -109,21 +111,18 @@
}
}
-
@media (max-width: 991.9px) {
#header {
.nav-grow {
- flex-grow: 1!important;
+ flex-grow: 1 !important;
}
.lg-none {
- display: flex!important;
+ display: flex !important;
}
.maxw-400 {
max-width: 100%;
}
}
-
}
-
diff --git a/ui/src/components/InitialLoadingPlaceholder/index.scss b/ui/src/components/InitialLoadingPlaceholder/index.scss
index a1cad1a5..3a1b74de 100644
--- a/ui/src/components/InitialLoadingPlaceholder/index.scss
+++ b/ui/src/components/InitialLoadingPlaceholder/index.scss
@@ -20,7 +20,9 @@
// Same as spin in `public/index.html`
@keyframes _initial-loading-spin {
- to { transform: rotate(360deg) }
+ to {
+ transform: rotate(360deg);
+ }
}
.InitialLoadingPlaceholder {
@@ -44,10 +46,10 @@
display: inline-block;
width: 2rem;
height: 2rem;
- vertical-align: -.125em;
- border: .25rem solid currentColor;
+ vertical-align: -0.125em;
+ border: 0.25rem solid currentColor;
border-right-color: transparent;
- color: rgba(108, 117, 125, .75);
+ color: rgba(108, 117, 125, 0.75);
border-radius: 50%;
animation: 0.75s linear infinite _initial-loading-spin;
}
diff --git a/ui/src/components/QueryGroup/index.scss b/ui/src/components/QueryGroup/index.scss
index 3a05069f..ae731659 100644
--- a/ui/src/components/QueryGroup/index.scss
+++ b/ui/src/components/QueryGroup/index.scss
@@ -24,7 +24,6 @@
display: none;
}
-
@media screen and (max-width: 768px) {
.md-show {
display: none !important;
diff --git a/ui/src/components/SchemaForm/README.md b/ui/src/components/SchemaForm/README.md
index 13149ae4..59805fac 100644
--- a/ui/src/components/SchemaForm/README.md
+++ b/ui/src/components/SchemaForm/README.md
@@ -9,7 +9,13 @@ A React component capable of building HTML forms out of a [JSON schema](https://
```tsx
import React, { useState } from 'react';
-import { SchemaForm, initFormData, JSONSchema, UISchema, FormKit } from '@/components';
+import {
+ SchemaForm,
+ initFormData,
+ JSONSchema,
+ UISchema,
+ FormKit,
+} from '@/components';
const schema: JSONSchema = {
title: 'General',
@@ -48,11 +54,11 @@ const uiSchema: UISchema = {
const Form = () => {
const [formData, setFormData] = useState(initFormData(schema));
-
+
const formRef = useRef<{
validator: () => Promise<boolean>;
}>(null);
-
+
const refreshConfig: FormKit['refreshConfig'] = async () => {
// refreshFormConfig();
};
@@ -103,9 +109,9 @@ interface FormProps {
## Form Ref
```ts
- export interface FormRef {
- validator: () => Promise<boolean>;
- }
+export interface FormRef {
+ validator: () => Promise<boolean>;
+}
```
When you need to validate a form and get the result outside the form, you can create a `FormRef` with `useRef` and pass it to the form using the `ref` property.
@@ -115,6 +121,7 @@ This allows you to validate the form and get the result outside the form using `
---
## Types Definition
+
### JSONSchema
```ts
@@ -137,6 +144,7 @@ export interface JSONSchema {
```
### UISchema
+
```ts
export interface UISchema {
[key: string]: {
@@ -147,6 +155,7 @@ export interface UISchema {
```
### UIWidget
+
```ts
export type UIWidget =
| 'textarea'
@@ -164,6 +173,7 @@ export type UIWidget =
---
### UIOptions
+
```ts
export type UIOptions =
| InputOptions
@@ -178,6 +188,7 @@ export type UIOptions =
```
#### BaseUIOptions
+
```ts
export interface BaseUIOptions {
empty?: string;
@@ -197,6 +208,7 @@ export interface BaseUIOptions {
```
#### InputOptions
+
```ts
export interface InputOptions extends BaseUIOptions {
placeholder?: string;
@@ -219,11 +231,13 @@ export interface InputOptions extends BaseUIOptions {
```
#### SelectOptions
+
```ts
export interface SelectOptions extends UIOptions {}
```
#### UploadOptions
+
```ts
export interface UploadOptions extends BaseUIOptions {
acceptType?: string;
@@ -232,6 +246,7 @@ export interface UploadOptions extends BaseUIOptions {
```
#### SwitchOptions
+
```ts
export interface SwitchOptions extends BaseUIOptions {
label?: string;
@@ -239,6 +254,7 @@ export interface SwitchOptions extends BaseUIOptions {
```
#### TimezoneOptions
+
```ts
export interface TimezoneOptions extends UIOptions {
placeholder?: string;
@@ -246,16 +262,19 @@ export interface TimezoneOptions extends UIOptions {
```
#### CheckboxOptions
+
```ts
export interface CheckboxOptions extends UIOptions {}
```
#### RadioOptions
+
```ts
export interface RadioOptions extends UIOptions {}
```
#### TextareaOptions
+
```ts
export interface TextareaOptions extends UIOptions {
placeholder?: string;
@@ -264,6 +283,7 @@ export interface TextareaOptions extends UIOptions {
```
#### ButtonOptions
+
```ts
export interface ButtonOptions extends BaseUIOptions {
text: string;
@@ -275,6 +295,7 @@ export interface ButtonOptions extends BaseUIOptions {
```
#### UIAction
+
```ts
export interface UIAction {
url: string;
@@ -291,6 +312,7 @@ export interface UIAction {
```
#### FormKit
+
```ts
export interface FormKit {
refreshConfig(): void;
@@ -300,6 +322,7 @@ export interface FormKit {
---
### FormData
+
```ts
export interface FormValue<T = any> {
value: T;
@@ -350,7 +373,6 @@ For backend generating modal form you can return json like this.
}
```
-
## reference
- [json schema](https://json-schema.org/understanding-json-schema/index.html)
diff --git a/ui/src/components/TagSelector/index.scss b/ui/src/components/TagSelector/index.scss
index 7cbeb5a8..52a1f1c2 100644
--- a/ui/src/components/TagSelector/index.scss
+++ b/ui/src/components/TagSelector/index.scss
@@ -70,7 +70,6 @@
overflow: hidden;
max-width: calc(100% - 40px);
}
-
}
.tag-selector-wrap--focus {
diff --git a/ui/src/index.scss b/ui/src/index.scss
index a056e538..52abe408 100644
--- a/ui/src/index.scss
+++ b/ui/src/index.scss
@@ -48,7 +48,7 @@ a {
}
// If the image does not have a `src` attribute, it must break and may not trigger the `onerror` event.
// With or without the `alt` attribute, it is visually hidden directly.
-img[src=""] {
+img[src=''] {
visibility: hidden !important;
}
@@ -270,7 +270,10 @@ img[src=""] {
word-break: initial;
}
}
- ol ol,ol ul,ul ol,ul ul {
+ ol ol,
+ ol ul,
+ ul ol,
+ ul ul {
margin-bottom: 1rem;
}
}
@@ -329,8 +332,8 @@ img[src=""] {
animation: bg-fade-out 2s ease 0.3s;
}
-
-.btnSvg, .btnSvg:hover {
+.btnSvg,
+.btnSvg:hover {
display: inline-block;
font-size: 16px;
width: 16px;
@@ -348,17 +351,15 @@ img[src=""] {
}
.bronze {
- color: #CD7F32;
+ color: #cd7f32;
}
.silver {
- color: #C0C0C0;
+ color: #c0c0c0;
}
.gold {
- color: #FFD700;
+ color: #ffd700;
}
-
-
.view-level1 {
color: $orange-600;
}
diff --git a/ui/src/pages/Questions/Detail/components/InviteToAnswer/index.scss b/ui/src/pages/Questions/Detail/components/InviteToAnswer/index.scss
index 0f3739e0..0e7c8a46 100644
--- a/ui/src/pages/Questions/Detail/components/InviteToAnswer/index.scss
+++ b/ui/src/pages/Questions/Detail/components/InviteToAnswer/index.scss
@@ -27,6 +27,5 @@
border-top: 0;
border-bottom-left-radius: var(--bs-border-radius);
border-bottom-right-radius: var(--bs-border-radius);
-
}
}
diff --git a/ui/src/pages/Questions/Detail/index.scss b/ui/src/pages/Questions/Detail/index.scss
index bbc42bc5..0d2613c0 100644
--- a/ui/src/pages/Questions/Detail/index.scss
+++ b/ui/src/pages/Questions/Detail/index.scss
@@ -27,7 +27,8 @@
background-color: var(--bs-gray-100);
}
- &:active, &.active {
+ &:active,
+ &.active {
background-color: var(--bs-gray-200);
}
}
@@ -47,7 +48,7 @@
z-index: 80;
display: block;
cursor: default;
- content: " ";
+ content: ' ';
}
@media screen and (max-width: 768px) {
diff --git a/ui/src/pages/Users/Notifications/components/Achievements/index.scss b/ui/src/pages/Users/Notifications/components/Achievements/index.scss
index 9a224921..aaf4ea68 100644
--- a/ui/src/pages/Users/Notifications/components/Achievements/index.scss
+++ b/ui/src/pages/Users/Notifications/components/Achievements/index.scss
@@ -23,4 +23,4 @@
width: 60px;
flex: none;
}
-}
\ No newline at end of file
+}
diff --git a/ui/src/pages/Users/Notifications/index.scss b/ui/src/pages/Users/Notifications/index.scss
index f4c930dc..efa2f99e 100644
--- a/ui/src/pages/Users/Notifications/index.scss
+++ b/ui/src/pages/Users/Notifications/index.scss
@@ -19,5 +19,5 @@
.inbox-nav {
border-top: 1px solid var(--an-answer-item-border-top);
- padding: .5rem 0;
+ padding: 0.5rem 0;
}