sass-zero 0.0.11 → 0.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- 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",
|