style: adjust ui fontSize

rookie-luochao · May 8, 2024 · 61a9dd1 · 61a9dd1
1 parent 4f8470c
commit 61a9dd1
Show file tree

Hide file tree

Showing 10 changed files with 20 additions and 40 deletions.
diff --git a/src/components/Section/index.tsx b/src/components/Section/index.tsx
@@ -23,7 +23,6 @@ export const Section = ({ title, children }: ISectionProps): JSX.Element => {
         <h3
           style={{
             position: "relative",
-            fontSize: dsc.fontSize.s,
             margin: "0 0 1em",
             color: theme.color.primary,
             padding: "0.5em 0",

diff --git a/src/components/antd-config/index.tsx b/src/components/antd-config/index.tsx
@@ -65,9 +65,9 @@ export function AntdConfigProviderWrap({ children }: { children: React.ReactNode
                 ...darkThemeColorMap,
                 colorBgContainerDisabled: darkTheme.color.descCardBg,
                 colorTextDisabled: darkTheme.color.textLight,
-                fontSize: dsc.fontSize.xxs,
+                fontSize: dsc.fontSize.xs,
               }
-            : { fontSize: dsc.fontSize.xxs },
+            : { fontSize: dsc.fontSize.xs },
           Upload: isDarkTheme
             ? {
                 ...lightThemeColorMap,

diff --git a/src/components/curl/index.tsx b/src/components/curl/index.tsx
@@ -17,8 +17,6 @@ export function CreateCURL({ request }: { request: AxiosRequestConfig }) {
       <div>
         <Button
           type="primary"
-          size="small"
-          style={{ fontSize: dsc.fontSize.xxs }}
           onClick={() => {
             copy(cURL);
             message.success(t("openapi.copySuccess"));

diff --git a/src/components/generate-code/index.tsx b/src/components/generate-code/index.tsx
@@ -29,14 +29,12 @@ export function CreateGenerateCode({ request }: { request: AxiosRequestConfig })
   return (
     <div>
       <div style={{ display: "flex", justifyContent: "space-between" }}>
-        <Radio.Group defaultValue="axios" size="small" buttonStyle="solid">
+        <Radio.Group defaultValue="axios" buttonStyle="solid">
           <Radio.Button value="axios">JavaScript</Radio.Button>
           {/* <Radio.Button value="python">python</Radio.Button> */}
         </Radio.Group>
         <Button
           type="primary"
-          size="small"
-          style={{ fontSize: dsc.fontSize.xxs }}
           onClick={() => {
             copy(template);
             message.success(t("openapi.copySuccess"));

diff --git a/src/openapi/OpenapiView.tsx b/src/openapi/OpenapiView.tsx
@@ -53,7 +53,6 @@ export default function OpenapiView() {
             <Tooltip title={t("openapi.clickToCopy")}>
               <a
                 style={{
-                  fontSize: dsc.fontSize.s,
                   fontWeight: "bold",
                   marginRight: 10,
                   color: theme.color.menuGroup,
@@ -66,15 +65,11 @@ export default function OpenapiView() {
                 {operation.operationName}
               </a>
             </Tooltip>
-            <span title={operation.summary} style={{ fontSize: dsc.fontSize.xxs }}>
+            <span title={operation.summary} style={{ fontSize: dsc.fontSize.xs }}>
               {operation.summary}
             </span>
           </div>
-          <div
-            style={{
-              fontSize: dsc.fontSize.s,
-            }}
-          >
+          <div>
             <span style={{ textTransform: "uppercase", fontFamily: dsc.fontFamily.mono }}>{operation.method}</span>
             <span
               style={{
@@ -101,7 +96,6 @@ export default function OpenapiView() {
                 <small
                   style={{
                     lineHeight: 1.4,
-                    fontSize: "0.8em",
                     marginBottom: "0.5em",
                     color: theme.color.title,
                   }}

diff --git a/src/openapi/OperationList.tsx b/src/openapi/OperationList.tsx
@@ -70,7 +70,6 @@ function GroupedOperationList({
     <div style={{ position: "relative" }}>
       <div
         style={{
-          fontSize: dsc.fontSize.s,
           color: theme.color.menuGroup,
           backgroundColor: theme.color.menuGroupBg,
           padding: "0.5em 0.8em",
@@ -94,7 +93,7 @@ function GroupedOperationList({
               }}
               css={[
                 {
-                  height: 46,
+                  height: 50,
                   borderBottom: `1px solid ${theme.color.border}`,
                   position: "relative",
                   display: "flex",
@@ -121,20 +120,19 @@ function GroupedOperationList({
                 <OperationDescStyleWrap deprecated={operation.deprecated}>
                   <div
                     style={{
-                      fontSize: dsc.fontSize.xs,
                       fontWeight: 600,
                       marginBottom: 4,
                     }}
                   >
                     {operation.operationName}
                   </div>
-                  <div style={{ fontSize: dsc.fontSize.xxs }}>
+                  <div style={{ fontSize: dsc.fontSize.xs }}>
                     {operation.summary || ""}
                     &nbsp;
                   </div>
                 </OperationDescStyleWrap>
               ) : (
-                <div style={{ height: 46 }} />
+                <div style={{ height: 50 }} />
               )}
               <MethodStyleWrap method={operation.method}>
                 {operation.method === MethodType.delete ? operation.method.slice(0, 3) : operation.method}

diff --git a/src/openapi/RequestBuilder.tsx b/src/openapi/RequestBuilder.tsx
@@ -200,23 +200,19 @@ export function RequestBuilder(props: { operation: IOperationEnhance; schemas: D
         >
           <HttpRequestView request={getRequestByValues(form.getFieldsValue())} />
           <div css={{ margin: "1em 0", "& > *": { marginRight: 4 } }}>
-            <Button htmlType="submit" type="primary" size="small" disabled={loading}>
+            <Button htmlType="submit" type="primary" disabled={loading}>
               {loading ? t("openapi.requesting") : t("openapi.request")}
             </Button>
-            <Button size="small" onClick={() => handleMockData(true)}>
-              {t("openapi.mockRequired")}
-            </Button>
-            <Button size="small" onClick={() => handleMockData(false)}>
-              {t("openapi.mockAll")}
-            </Button>
+            <Button onClick={() => handleMockData(true)}>{t("openapi.mockRequired")}</Button>
+            <Button onClick={() => handleMockData(false)}>{t("openapi.mockAll")}</Button>
             <Popover content={<CreateCURL request={getRequestByValues(form.getFieldsValue())} />} trigger="click">
-              <Button size="small">{t("openapi.cURL")}</Button>
+              <Button>{t("openapi.cURL")}</Button>
             </Popover>
             <Popover
               content={<CreateGenerateCode request={getRequestByValues(form.getFieldsValue())} />}
               trigger="click"
             >
-              <Button size="small">{t("openapi.generateCode")}</Button>
+              <Button>{t("openapi.generateCode")}</Button>
             </Popover>
           </div>
           {!isEmpty(axiosResponse) && <HttpResponseView {...axiosResponse} />}

diff --git a/src/openapi/SchemaView.tsx b/src/openapi/SchemaView.tsx
@@ -34,7 +34,7 @@ function SchemaNameWrapView({
       >
         {children}
       </span>
-      {!required && <span style={{ fontWeight: 700, fontSize: dsc.fontSize.xs, color: theme.color.text }}>?</span>}
+      {!required && <span style={{ fontWeight: 700, color: theme.color.text }}>?</span>}
     </>
   );
 }
@@ -58,7 +58,7 @@ const SchemaTypeWrapView = (props: React.HTMLAttributes<any>) => {
       style={{
         display: "block",
         fontWeight: "bold",
-        marginBottom: 14,
+        marginBottom: 16,
         color: theme.color.title,
       }}
     />
@@ -139,7 +139,7 @@ function SchemaRow(props: ISchemaRowProps) {
   return (
     <span
       style={{
-        fontSize: dsc.fontSize.xs,
+        fontSize: dsc.fontSize.s,
         position: "relative",
         display: "flex",
         whiteSpace: "nowrap",
@@ -165,7 +165,7 @@ function SchemaRow(props: ISchemaRowProps) {
             top: "-10px",
             left: 0,
             lineHeight: 1,
-            fontSize: dsc.fontSize.xxs,
+            fontSize: dsc.fontSize.xs,
           }}
         >
           <Description desc={schema.description} prefix={"// "} />
@@ -237,7 +237,6 @@ function renderSchema(schema: ISchema, name?: string, required?: boolean): React
                   css={{
                     display: "block",
                     lineHeight: 1.4,
-                    fontSize: dsc.fontSize.xxs,
                     opacity: 0.5,
                     "&:hover": {
                       opacity: 1,

diff --git a/src/openapi/displayType.tsx b/src/openapi/displayType.tsx
@@ -1,4 +1,5 @@
 import { forEach, has, map, reduce, replace, some } from "lodash-es";
+import { dsc } from "../core/style/defaultStyleConfig";
 import { schemaOpacity } from "./SchemaView";
 
 function highlightType(v: string) {
@@ -184,7 +185,7 @@ export function displayClassName(schema: any): React.ReactNode {
         {highlightType(displayType(schema))}
         <div
           style={{
-            fontSize: "0.8em",
+            fontSize: dsc.fontSize.xs,
             paddingLeft: "1em",
             paddingBottom: "0.6em",
           }}

diff --git a/src/postman/RequestBuilder.tsx b/src/postman/RequestBuilder.tsx
@@ -163,7 +163,6 @@ export function RequestBuilder() {
           <Button
             type="primary"
             disabled={loading}
-            style={{ fontSize: dsc.fontSize.xs }}
             onClick={() => {
               if (urlRegex.test(url)) {
                 form.submit();
@@ -204,9 +203,7 @@ export function RequestBuilder() {
         </div>
         <div css={{ marginBottom: 8, "& > *": { marginRight: 4 } }}>
           <Popover content={<CreateCURL request={Object.assign({}, axiosRequest, { url })} />} trigger="click">
-            <Button size="small" style={{ fontSize: dsc.fontSize.xxs }}>
-              {t("openapi.cURL")}
-            </Button>
+            <Button>{t("openapi.cURL")}</Button>
           </Popover>
         </div>
         {!isEmpty(axiosResponse) && <HttpResponseView {...axiosResponse} />}