Bläddra i källkod

style: update switch design token (#1267)

* fix: add hash to all static files of docsite
* feat: add switch token
代强 2 år sedan
förälder
incheckning
f954e4bdca

+ 31 - 20
gatsby-node.js

@@ -12,21 +12,7 @@ const items = ['basic', 'chart'];
 const sha1 = require('sha1');
 const hash = sha1(`${new Date().getTime()}${Math.random()}`);
 const glob = require('glob');
-const addPageDataVersion = async file => {
-    const stats = fs.statSync(file);
-    if (stats.isFile()) {
-        console.log(`Adding version to page-data.json app-data.json designToken.json in ${file}..`);
-        let content = fs.readFileSync(file, 'utf8');
-        const result = content.replace(
-            /page-data.json(\?v=[a-f0-9]{32})?/g,
-            `page-data.json?v=${hash}`
-        ).replace(/app-data.json(\?v=[a-f0-9]{32})?/g,
-            `app-data.json?v=${hash}`
-        ).replace(/designToken.json(\?v=[a-f0-9]{32})?/g,
-            `designToken.json?v=${hash}`);
-        fs.writeFileSync(file, result, 'utf8');
-    }
-};
+
 
 function resolve(dir) {
     return path.resolve(__dirname, dir);
@@ -298,15 +284,40 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
     });
 };
 
-exports.onPostBootstrap = async () => {
-    const loader = path.join(__dirname, 'node_modules/gatsby/cache-dir/loader.js');
-    await addPageDataVersion(loader);
-};
 
 exports.onPostBuild = async () => {
     const publicPath = path.join(__dirname, 'public');
+
+    const pageDataFiles = glob.sync(`${publicPath}/page-data/**/page-data.json`);
+    for (let file of pageDataFiles) {
+        console.log(file);
+        const newFilename = file.replace(`page-data.json`, `page-data.${hash}.json`);
+        fs.renameSync(file, newFilename);
+    }
+
+    const appDataFiles = glob.sync(`${publicPath}/page-data/**/app-data.json`);
+    for (let file of appDataFiles) {
+        console.log(file);
+        const newFilename = file.replace(`app-data.json`, `app-data.${hash}.json`);
+        fs.renameSync(file, newFilename);
+    }
+
     const htmlAndJSFiles = glob.sync(`${publicPath}/**/*.{html,js}`);
     for (let file of htmlAndJSFiles) {
-        await addPageDataVersion(file);
+        const stats = fs.statSync(file);
+        if (stats.isFile()) {
+            console.log(`Adding version to page-data.json app-data.json designToken.json in ${file}..`);
+            let content = fs.readFileSync(file, 'utf8');
+            const result = content.replace(
+                /page-data.json(\?v=[a-f0-9]*)?/g,
+                `page-data.${hash}.json`
+            ).replace(/app-data.json(\?v=[a-f0-9]*)?/g,
+                `app-data.${hash}.json`
+            ).replace(/designToken.json(\?v=[a-f0-9]*)?/g,
+                `designToken.json?v=${hash}`);
+            fs.writeFileSync(file, result, 'utf8');
+        }
     }
+
+
 };

+ 1 - 1
packages/semi-foundation/switch/rtl.scss

@@ -20,7 +20,7 @@ $module: #{$prefix}-switch;
         &-knob {
             right: 0;
             left: auto;
-            transform: translateX(-$motion-switch_unchecked-translateX);
+            transform: translateX(-1 * $spacing-switch_unchecked-translateX);
         }
 
         &-native-control {

+ 2 - 2
packages/semi-foundation/switch/switch.scss

@@ -94,14 +94,14 @@ $module: #{$prefix}-switch;
         background-color: $color-switch_knob-bg-default;
         box-sizing: border-box;
         position: absolute;
-        left: 0;
+        left: $spacing-switch_knob-left;
         right: auto;
         transition: transform $motion-switch-transitionDuration ease-in-out, width $motion-switch-transitionDuration ease-in-out;
 
         width: $width-switch_knob_default;
         height: $width-switch_knob_default;
         top: $spacing-switch_knob-padding;
-        transform: translateX($motion-switch_unchecked-translateX);
+        transform: translateX($spacing-switch_unchecked-translateX);
     }
 
     &-native-control {

+ 3 - 2
packages/semi-foundation/switch/variables.scss

@@ -1,5 +1,5 @@
 // Other
-$motion-switch_unchecked-translateX: 2px; // 未选中开关右侧偏移量 - 动画用
+$spacing-switch_unchecked-translateX: 2px; // 未选中开关右侧偏移量 - 动画用
 $motion-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量 - 动画用
 $motion-switch_checked-translateX: 18px; // 选中开关右侧偏移量
 $motion-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
@@ -62,9 +62,10 @@ $width-switch-outline: 2px; // 开关轮廓宽度
 
 
 // Spacing
-$spacing-switch_knob-padding: 2px; // 开关按钮边距
+$spacing-switch_knob-padding: 2px; // 开关按钮顶部边距
 $spacing-switch_knob_large-padding: 3px; // 大尺寸开关按钮内边距
 $spacing-switch_knob_small-padding: 1px; // 小尺寸开关按钮内边距
+$spacing-switch_knob-left: 0px; // 开关左侧偏移距离
 
 // Radius
 $radius-switch: $height-switch * 0.5; // 开关圆角