Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/twbs/rfs.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMartijn Cuppens <martijn.cuppens@intracto.com>2018-01-28 14:58:39 +0300
committerMartijn Cuppens <martijn.cuppens@intracto.com>2018-01-28 14:58:39 +0300
commit40aeeb4fd94713fb786a2fc3909c02dfc232f814 (patch)
treeb2a8064f57a3ab89ca5c198b45abc8d346846be6
parentc4387822dec700957ed19b4900f2f227b965b3fa (diff)
WIP: update documentation
-rw-r--r--README.md39
1 files changed, 30 insertions, 9 deletions
diff --git a/README.md b/README.md
index b72033b..1038fd8 100644
--- a/README.md
+++ b/README.md
@@ -43,17 +43,39 @@ lose the ability to easily and quickly manage and update RFS as a dependency.
## Usage
This input:
+### SCSS
```scss
.title {
- @include responsive-font-size(4rem);
- // OR:
- // @include responsive-font-size(64px);
- // OR:
- // @include responsive-font-size(64);
+ @include responsive-font-size(4rem); // OR @include responsive-font-size(64px); OR @include rfs(64);
}
```
-Will generate this (CSS):
+### Sass
+```sass
+.title
+ +responsive-font-size(4rem); // OR +responsive-font-size(64px); OR +rfs(64);
+```
+
+### PostCSS
+```postcss
+.title {
+ responsive-font-size: 4rem; // OR responsive-font-size: 64px; OR rfs: 64;
+}
+```
+
+### Less
+```less
+.title
+ +responsive-font-size(4rem); // OR +responsive-font-size(64px); OR +rfs(64);
+```
+
+### Stylus
+```stylus
+.title {
+ @include responsive-font-size(4rem); // OR @include responsive-font-size(64px); OR @include rfs(64);
+}
+```
+### Generated css
```css
.title,
.disable-responsive-font-size .title,
@@ -67,7 +89,6 @@ Will generate this (CSS):
}
}
```
-The `rfs()` can also be used alias instead of `responsive-font-size()`.
## Configuration
@@ -134,7 +155,7 @@ Enabling the two dimensional media queries will determine the font size based on
*Default value: `false`*
-### Two dimensional <sub><sup>(boolean)</sup></sub> ###
+### Generate disable classes <sub><sup>(boolean)</sup></sub> ###
> **SCSS, Sass & Stylus:** `$rfs-generate-disable-classes`
> **Less:** `@rfs-generate-disable-classes`
> **PostCSS:** `generateDisableClasses`
@@ -172,7 +193,7 @@ CSS:
## But this generates a lot of css?
True. But with gzip or other compression enabled, the difference in file size is barely noticeable due the high amount
of repetitive strings. If you really want to minimize the amount of generated css, setting
-`$rfs-generate-disable-classes` to `false` can make a difference (and lowers the global specificity).
+the _generate disable classes_ option to `false` can make a difference.
## Known issues
Safari doesn't recalculate the value of vw in a calc()-function for font-sizes in iframes if the min-width, max-width or