Docs : Improve the design guide (#111)
- Use modal verbs instead of "has" - Use "icons" instead of "each icon" - change some other things as well
This commit is contained in:
@@ -4,46 +4,46 @@ Here are rules that should be followed to keep quality and consistency when maki
|
||||
|
||||
## Summary of the rules we have
|
||||
|
||||
1. Each Icon is desined on a canvas of **24 by 24 pixels**.
|
||||
2. Each Icon have **1 pixel padding** between icon and the canvas.
|
||||
3. Each icon has a **stroke width of 2 pixels**.
|
||||
4. Each icon has **round joins**.
|
||||
5. Each icon has **round caps**.
|
||||
6. Each icon has **centered strokes**.
|
||||
7. Each icon containing squares has a **border radius of 2 pixels**.
|
||||
8. Each icon **2 pixels of spacing between elements**.
|
||||
1. Icons must be designed on a **24 by 24 pixels** canvas.
|
||||
2. Icons must have a **1 pixel padding** within the canvas.
|
||||
3. Icons must have a **stroke width of 2 pixels**.
|
||||
4. Icons must use **round joins**.
|
||||
5. Icons must use **round caps**.
|
||||
6. Icons must use **centered strokes**.
|
||||
7. Shapes (such as rectangles) in icons must have **border radius of 2 pixels**.
|
||||
8. Distinct elements must have **2 pixels of spacing between each other**.
|
||||
|
||||
## The Rules Visualized
|
||||
|
||||
### 1. **Each Icon is desined on a canvas of 24 by 24 pixels**
|
||||
### 1. Icons must be designed on a 24 by 24 pixels canvas.
|
||||
|
||||

|
||||
|
||||
### 2. **Each Icon have 1 pixel between icon and the canvas**
|
||||
### 2. Icons must have a 1 pixel padding within the canvas.
|
||||
|
||||

|
||||
|
||||
### 3. **Each icon has a stroke width of 2 pixels**
|
||||
### 3. Icons must have a stroke width of 2 pixels.
|
||||
|
||||

|
||||
|
||||
### 4. **Each icon has round joins**
|
||||
### 4. Icons must use round joins.
|
||||
|
||||

|
||||
|
||||
### 5. **Each icon has round caps**
|
||||
### 5. Icons must use round caps.
|
||||
|
||||

|
||||
|
||||
### 6. **Each icon has centered strokes**
|
||||
### 6. Icons must use centered strokes.
|
||||
|
||||

|
||||
|
||||
### 7. **Each icon containing squares has a border radius of 2 pixels**
|
||||
### 7. Shapes (such as squares) in icons must have border radius of 2 pixels.
|
||||
|
||||

|
||||
|
||||
### 8. **Each icon 2 pixels of spaciong between elements**
|
||||
### 8. Distinct elements must have 2 pixels of spacing between each other.
|
||||
|
||||

|
||||
|
||||
@@ -53,7 +53,7 @@ Before an icon is added to the library, we like to have readable and optimized s
|
||||
|
||||
### Global Attributes
|
||||
|
||||
For each icon these attributes are applied.
|
||||
For each icon these attributes are applied, corresponding to the above rules.
|
||||
|
||||
```xml
|
||||
<svg
|
||||
|
||||
Reference in New Issue
Block a user