Merge branch 'main' of https://github.com/bridgedxyz/design-to-code into support-components

softmarshmallow · softmarshmallow · commit 69f72840c0c1 · 2021-10-20T16:17:53.000+09:00
diff --git a/.github/workflows/docs-deploy.yml b/.github/workflows/docs-deploy.yml
@@ -0,0 +1,20 @@
+name: docsdeploy
+on:
+  push:
+    branches: [main]
+jobs:
+  copy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - name: copy docs to gridaco/grida.co
+        uses: DevOpenWRT-Router/github-action-push-to-another-repository@main
+        env:
+          API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
+        with:
+          source-directory: "docs"
+          destination-github-username: "gridaco"
+          destination-repository-name: "grida.co"
+          user-email: github@grida.co
+          target-branch: docs
+          target-directory: "docs/@designto-code"
diff --git a/docs/README.md b/docs/README.md
@@ -1,3 +1,9 @@
-# Documentations landingpage (for github)
+# This directory is copied from [gridaco/designto-code](https://github.com/gridaco/designto-code)
 
-For entry, goto [index.md](./index.md)
+> Documentations landingpage (for github)
+
+For entry, goto [grida.co/docs/@designto-code](grida.co/docs/)
+
+## Workflows (**Important!**)
+
+this directory will be copied to gridaco/grida.co by github actions. If you are interacting with this directory under gridaco/grida.co, your changes will be lost.
diff --git a/docs/component-allowed-property.md b/docs/component-allowed-property.md
@@ -1,3 +1,9 @@
+---
+title: "Allowed properties for components"
+version: 0.1.0
+revision: 1
+---
+
 # Allowed properties for components
 
 ### Text
diff --git a/docs/component-multi-proxied-property.md b/docs/component-multi-proxied-property.md
@@ -1,3 +1,9 @@
+---
+title: "Multi Proxied Property on components"
+version: 0.1.0
+revision: 1
+---
+
 # Multi Proxied Property on components
 
 ## Styled components
diff --git a/docs/component-nested.md b/docs/component-nested.md
@@ -1,3 +1,9 @@
+---
+title: "Understanding Nested Components"
+version: 0.1.0
+revision: 1
+---
+
 # Understanding Nested Components
 
 ![](./assets/component-nested-simple-example-with-numbers.png)
diff --git a/docs/component-property-default-value.md b/docs/component-property-default-value.md
@@ -1,3 +1,9 @@
+---
+title: "Component Property Default value"
+version: 0.1.0
+revision: 1
+---
+
 # Component Property Default value
 
 This document demonstrates how assigning a default value differes by frameworks and languages
diff --git a/docs/component-property-interfacing-auto.md b/docs/component-property-interfacing-auto.md
@@ -1,3 +1,9 @@
+---
+title: "Automatic property interfacing strategy for Components"
+version: 0.1.0
+revision: 1
+---
+
 # Automatic property interfacing strategy for Components
 
 > Learn more at [support-components](../packages/support-components/README.md)
diff --git a/docs/css-box-sizing.md b/docs/css-box-sizing.md
@@ -1,3 +1,9 @@
+---
+title: "Css box sizing"
+version: 0.1.0
+revision: 1
+---
+
 # Css box sizing
 
 ## When both width (or height) and padding is specified.
diff --git a/docs/css-clip-path.md b/docs/css-clip-path.md
@@ -1,3 +1,9 @@
+---
+title: "CSS Clip path"
+version: 0.1.0
+revision: 1
+---
+
 # Css Clip path
 
 > css clip path for graphics making support
diff --git a/docs/css-color-vs-background-color.md b/docs/css-color-vs-background-color.md
@@ -1,3 +1,9 @@
+---
+title: "CSS color vs background-color"
+version: 0.1.0
+revision: 1
+---
+
 # Css `color` vs `background-color`
 
 > Before we start, this document lists the obvious content for web developers.
diff --git a/docs/css-mask.md b/docs/css-mask.md
@@ -1,3 +1,9 @@
+---
+title: "CSS mask and why we don't support it"
+version: 0.1.0
+revision: 1
+---
+
 # Css masking is not supported due to lack of major browser support.
 
 https://developer.mozilla.org/en-US/docs/Web/CSS/mask
diff --git a/docs/css-position-absolute-vs-fixed.md b/docs/css-position-absolute-vs-fixed.md
@@ -1,3 +1,9 @@
+---
+title: "CSS When to use css position absolute or fixed"
+version: 0.1.0
+revision: 1
+---
+
 # When to use css position:`absolute | fixed`
 
 The difference between absolute and fixed happens when thier is more than 1 dpeth level of hierarchy.
diff --git a/docs/css.md b/docs/css.md
@@ -1,3 +1,9 @@
+---
+title: "CSS Strategy"
+version: 0.1.0
+revision: 1
+---
+
 # CSS Best practice & Grida's policy on CSS.
 
 > WIP
diff --git a/docs/figma-autolayout.md b/docs/figma-autolayout.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Auto layout"
+version: 0.1.0
+revision: 1
+---
+
 # Figma Auto layout
 
 > These are the figma frame's property effecting to auto layouyt (flexbox) behaiviour
diff --git a/docs/figma-blur-effects.md b/docs/figma-blur-effects.md
@@ -1,3 +1,9 @@
+---
+title: "Figma blur effects"
+version: 0.1.0
+revision: 1
+---
+
 # Figma blur effects
 
 ![](https://static.figma.com/uploads/9def6cce093b164306328ee228028155d13d72d0)
diff --git a/docs/figma-boolean-operation.md b/docs/figma-boolean-operation.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Boolean operation and how to handle it."
+version: 0.1.0
+revision: 1
+---
+
 # Figma Boolean operation and how to handle it.
 
 > **Theoretically, svg support for boolean operation is possible.** But, we don't support this on remote version of design to code.
diff --git a/docs/figma-constraint-center.md b/docs/figma-constraint-center.md
@@ -1,3 +1,9 @@
+---
+title: "Constraints - CENTER"
+version: 0.1.0
+revision: 1
+---
+
 # Constraints - CENTER
 
 > This document is based on horizontally centered element. (which applies the same to vertically centered.)
diff --git a/docs/figma-constraint-scale.md b/docs/figma-constraint-scale.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Constraints - SCALE"
+version: 0.1.0
+revision: 1
+---
+
 # Figma Constraints - `SCALE`
 
 Before we start, we recommand you to read [Figma Constraint docs](https://www.figma.com/plugin-docs/api/Constraints/). in this document, we only handle `STRETCH`
diff --git a/docs/figma-constraint-stretch.md b/docs/figma-constraint-stretch.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Constraints - STRETCH"
+version: 0.1.0
+revision: 1
+---
+
 # Constraints - STRETCH
 
 > This document is based on horizontally stretched element. (which applies the same to vertically stretched.)
diff --git a/docs/figma-line-height.md b/docs/figma-line-height.md
@@ -1,3 +1,9 @@
+---
+title: "Figma line-height"
+version: 0.1.0
+revision: 1
+---
+
 # Figma line-height
 
 [figma api docs](https://www.figma.com/developers/api#files-types)
diff --git a/docs/figma-line.md b/docs/figma-line.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Line"
+version: 0.1.0
+revision: 1
+---
+
 # Figma Line
 
 ## Can be
diff --git a/docs/figma-mask-layer.md b/docs/figma-mask-layer.md
@@ -1,3 +1,9 @@
+---
+title: "Figma mask (not frame)"
+version: 0.1.0
+revision: 1
+---
+
 # Figma mask (not frame)
 
 ![](./assets/how-fogma-masking-works.png)
diff --git a/docs/figma-rotation.md b/docs/figma-rotation.md
@@ -1,3 +1,9 @@
+---
+title: "Figma rotation"
+version: 0.1.0
+revision: 1
+---
+
 # Figma rotation
 
 ![](./assets/figma-rotation-example.png)
@@ -183,6 +189,10 @@ node.name = "--animated-rotation";
 /* WIP */
 ```
 
+## Note for assistant
+
+On assistant, on a plugin version, the assets are exported as-is including the rotated snapshot. which means having rotation on already rotated image will cause incorrect visualization. i.e having 30 rotated triangle vector, the graphics exports as-is, in total 60 rotated visually.
+
 ## Read Also
 
 - [figma scale](./figma-scale.md)
diff --git a/docs/figma-scale.md b/docs/figma-scale.md
@@ -1,17 +1,17 @@
-
+---
+title: "Figma scale"
+version: 0.1.0
+revision: 1
+---
 
 # Figma scale
 
 > This document is incomplete.
 
-
-
 How Figma scale works - Figma SCALE is a representation of responsive scaling (not a static scaling)
 
 - https://css-tricks.com/scaled-proportional-blocks-with-css-and-javascript/
 
-
-
 ## Transform?
 
 While figma and other major design tools has both transform value, and explicit rotation value (which can be calculated from transform value), The intuitive way to represent a rotation value is by using a `Rotation` token. Overall all figma node properties, the only two property that has impact to final transform (based on css) is `scale` and `rotation`.
@@ -88,10 +88,6 @@ Transform(
 )
 ```
 
-
-
-
-
 ## Read Also
 
 - [figma rotation](./figma-rotation.md)
diff --git a/docs/figma-strokes.md b/docs/figma-strokes.md
@@ -1,3 +1,9 @@
+---
+title: "Figma strokes"
+version: 0.1.0
+revision: 1
+---
+
 # Figma strokes
 
 Fimga storkes can be a array just like fills. as well as gradient & image as a paint.
diff --git a/docs/figma-text-autoresize.md b/docs/figma-text-autoresize.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Text AutoResize"
+version: 0.1.0
+revision: 1
+---
+
 # Figma Text AutoResize
 
 ![Understanding Figma's Text Auto resize](./assets/figma-text-autoresize-example.gif)
diff --git a/docs/figma-vector.md b/docs/figma-vector.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Vectors"
+version: 0.1.0
+revision: 1
+---
+
 # Figma Vectors
 
 ## Fills
diff --git a/docs/figma-visibility.md b/docs/figma-visibility.md
@@ -1,3 +1,9 @@
+---
+title: "Figma Visibility"
+version: 0.1.0
+revision: 1
+---
+
 # Figma Visibility
 
 > `visible` property is a global property rather defines if the node should be visible or not. By default, setting `visible = false` for figma not will act like the node never existed. I.e. item under autolayout, if the item's visibility is off, than the item will not only invisible, but act like it does not exist, triggering re-arrangement of other items.
diff --git a/docs/flags.md b/docs/flags.md
@@ -1,3 +1,9 @@
+---
+title: "Flags (Proposal)"
+version: 0.1.0
+revision: 1
+---
+
 # Flags (Proposal)
 
 > Flag feature is not ready to use
diff --git a/docs/flutter-box-decoration-multiple-visuals.md b/docs/flutter-box-decoration-multiple-visuals.md
@@ -1,3 +1,9 @@
+---
+title: "Flutter box decoration mutiple visuals"
+version: 0.1.0
+revision: 1
+---
+
 # Flutter box decoration mutiple visuals
 
 ## Color + Gradient
diff --git a/docs/flutter-multiple-gradients.md b/docs/flutter-multiple-gradients.md
@@ -1,3 +1,9 @@
+---
+title: "Flutter multiple gradients"
+version: 0.1.0
+revision: 1
+---
+
 # Flutter multiple gradients
 
 How to apply multiple gradients as a background?
diff --git a/docs/flutter-positioned-vs-align.md b/docs/flutter-positioned-vs-align.md
@@ -1,3 +1,9 @@
+---
+title: "Flutter positioning - when to use Positioned vs Align"
+version: 0.1.0
+revision: 1
+---
+
 # Flutter - positioning - when to use `Positioned` vs `Align`
 
 **Bullet points**
diff --git a/docs/flutter-svg-support.md b/docs/flutter-svg-support.md
@@ -1,3 +1,9 @@
+---
+title: "Flutter does not have a Builtin SVG support."
+version: 0.1.0
+revision: 1
+---
+
 # Flutter does not have a SVG support.
 
 **Use `flutter_svg`**
diff --git a/docs/flutter-when-to-use-constrainedbox.md b/docs/flutter-when-to-use-constrainedbox.md
@@ -1,3 +1,9 @@
+---
+title: "Flutter: When to use - ConstrainedBox VS (SizedBox, Container, Column, Row)"
+version: 0.1.0
+revision: 1
+---
+
 # Flutter: When to use - ConstrainedBox VS (SizedBox, Container, Column, Row)
 
 > this describes when to use ConstrainedBox instead of listed above, and how we handle relative layout scenarios in design-to-code-standard.
diff --git a/docs/icons.md b/docs/icons.md
@@ -1,3 +1,9 @@
+---
+title: "Icons"
+version: 0.1.0
+revision: 1
+---
+
 # Icons
 
 ## Detecion
diff --git a/docs/item-order.md b/docs/item-order.md
diff --git a/docs/item-overflow.md b/docs/item-overflow.md
diff --git a/docs/item-spacing.md b/docs/item-spacing.md
diff --git a/docs/known-issues.md b/docs/known-issues.md
diff --git a/docs/overflow-layout-scroll.md b/docs/overflow-layout-scroll.md
diff --git a/docs/react-jsx-css-line-break.md b/docs/react-jsx-css-line-break.md
diff --git a/docs/text-multi-style.md b/docs/text-multi-style.md
diff --git a/packages/builder-css-styles/dimensions/px.ts b/packages/builder-css-styles/dimensions/px.ts
diff --git a/packages/builder-css-styles/length/index.ts b/packages/builder-css-styles/length/index.ts
diff --git a/packages/builder-css-styles/letter-spacing/index.ts b/packages/builder-css-styles/letter-spacing/index.ts
diff --git a/packages/builder-web-core/widgets-native/html-text-span/index.ts b/packages/builder-web-core/widgets-native/html-text-span/index.ts
diff --git a/packages/designto-flutter/length/multiple.ts b/packages/designto-flutter/length/multiple.ts
diff --git a/scripts/docs-deploy/README.md b/scripts/docs-deploy/README.md
