sass-zero 0.0.11 → 0.0.12
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +16 -0
- data/app/assets/stylesheets/sass-zero/utilities/pull.scss +4 -0
- data/app/assets/stylesheets/sass-zero/utilities/push.scss +4 -0
- data/app/assets/stylesheets/sass-zero/variables/spacing.scss +1 -1
- data/lib/sass/zero/version.rb +1 -1
- data/package.json +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 5d8a062bf532d6d116cb141c1d7ea05edfcb7be3fd90dd3178dcc947a4950099
|
|
4
|
+
data.tar.gz: fe5bdfafde33910075e589ab22a3adc832c4dd3132c87df3857bc38ba259ff60
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 8169d217a2d6e502071bc51b8f3d76070c0af28f776f92af087af92519acad2c1cd271010cd825194fbdfee77132c0afebca078e2caa6857af017365e0ae410d
|
|
7
|
+
data.tar.gz: ba74a9b55bd3d6be3a72e418015d012705cbbcb4a8b99ab5f3e16de162548307c25e20559e0161c04c1dc03ed3fbe8d06e50c70f6478f2d54a716c73415cdc46
|
data/README.md
CHANGED
|
@@ -3,27 +3,43 @@
|
|
|
3
3
|
SASS-ZERO is a css framework that brings concepts from [tailwindcss](https://tailwindcss.com) and [milligram](https://milligram.io) but with ideas from [BEM](http://getbem.com/naming), [Refactoring UI](https://refactoringui.com/book) and [Shape UP](https://basecamp.com/shapeup).
|
|
4
4
|
|
|
5
5
|
### Tailwindcss
|
|
6
|
+
|
|
6
7
|
"Instead of hand-picking values from a limitless pool any time you need to make a decision, start with a smaller set of options." - [Refactoring UI](https://refactoringui.com/book).
|
|
7
8
|
|
|
8
9
|
SASS-ZERO use font, color, spacing, border and etc from [tailwindcss](https://tailwindcss.com) but instead the utility-first approach we use [sass variables](https://sass-lang.com/documentation/variables).
|
|
9
10
|
|
|
10
11
|
### Milligram
|
|
12
|
+
|
|
11
13
|
"Programmers don’t need a pixel-perfect design to start implementing. All they need are endpoints: input elements, buttons, places where stored data should appear. These affordances are the core of a user interface design." - [Shape UP](https://basecamp.com/shapeup/3.2-chapter-10#affordances-before-pixel-perfect-screens).
|
|
12
14
|
|
|
13
15
|
SASS-ZERO comes with a basic grayscale theme that help you to bring your ideas to life, questions about font, color, spacing and layout can be resolved after the raw affordances.
|
|
14
16
|
|
|
15
17
|
### BEM
|
|
18
|
+
|
|
16
19
|
I believe that html is code, therefore it should be named and scoped as well. Developers need to be good with naming things, css is another oportunity to practice.
|
|
17
20
|
|
|
18
21
|
### Refactoring UI
|
|
22
|
+
|
|
19
23
|
Developers should be able to produce your own design, [Refactoring UI](https://refactoringui.com/book) is the book for that.
|
|
20
24
|
|
|
21
25
|
### Shape UP
|
|
26
|
+
|
|
22
27
|
SASS-ZERO comes with a implict flow from Shape UP, Find Elemens -> Create Affordance -> Make it Beautiful.
|
|
23
28
|
|
|
24
29
|
### Icons
|
|
30
|
+
|
|
25
31
|
We embed svg icons from [Zondicons](http://www.zondicons.com).
|
|
26
32
|
|
|
33
|
+
### Utilities
|
|
34
|
+
|
|
35
|
+
- [Margin Reset](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/flush.scss)
|
|
36
|
+
- [Margin Push](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/push.scss)
|
|
37
|
+
- [Margin Pull](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/pull.scss)
|
|
38
|
+
- [Padding Reset](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/unpad.scss)
|
|
39
|
+
- [Text Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/text.scss)
|
|
40
|
+
- [Layout Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/layout.scss)
|
|
41
|
+
|
|
42
|
+
|
|
27
43
|
### Breadboard Theme - [Just HTML](https://github.com/lazaronixon/sass-zero/blob/master/Example.html)
|
|
28
44
|
|
|
29
45
|
|
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
@import "sass-zero/variables/spacing";
|
|
2
2
|
|
|
3
|
+
// *******************************************************************
|
|
4
|
+
// Pull Utilities
|
|
5
|
+
// $size-map: ("smaller": $size-2, "small": $size-4, "medium": $size-6, "large": $size-8, "larger": $size-10);
|
|
6
|
+
// *******************************************************************
|
|
3
7
|
@each $scale, $size in $size-map {
|
|
4
8
|
.pull-#{$scale} {
|
|
5
9
|
margin: (-$size) !important;
|
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
@import "sass-zero/variables/spacing";
|
|
2
2
|
|
|
3
|
+
// *******************************************************************
|
|
4
|
+
// Push Utilities
|
|
5
|
+
// $size-map: ("smaller": $size-2, "small": $size-4, "medium": $size-6, "large": $size-8, "larger": $size-10);
|
|
6
|
+
// *******************************************************************
|
|
3
7
|
@each $scale, $size in $size-map {
|
|
4
8
|
.push-#{$scale} {
|
|
5
9
|
margin: $size !important;
|
data/lib/sass/zero/version.rb
CHANGED
data/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sass-zero",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.12",
|
|
4
4
|
"description": "A CSS framework for rapid UI development based on tailwindcss, miligram and BEM.",
|
|
5
5
|
"homepage": "https://github.com/lazaronixon/sass-zero",
|
|
6
6
|
"repository": "lazaronixon/sass-zero",
|