Skip to content

Commit

Permalink
fix(Docs): Remove redundant TOC from README and add TypeScript sectio…
Browse files Browse the repository at this point in the history 
…n. (#237)

* fix(Docs): Remove redundant TOC from README and add TypeScript section.

* docs(Remove unneeded markdown.js theme script):
  • Loading branch information
@bhough
bhough committed Aug 26, 2017
1 parent 70794c5 commit 63b24f4
Show file tree
Hide file tree
Showing 5 changed files with 76 additions and 212 deletions.
107 changes: 6 additions & 101 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@ Want to write styles in JavaScript, but also want Sass-style helper functions an
- **Cross framework compatible**: No matter if you're using `styled-components`, aphrodite, radium, or plain inline styles, as long as you're writing your styles in JavaScript you can use polished!
- **Switching from a pre-processor to styles in JS made easy**

## Docs

**See the full documentation at [polished.js.org](http://polished.js.org/docs)!**

## Usage

`✨ polished` modules are meant to be used as stand-alone imports. You should avoid importing the entire library directly:
Expand All @@ -42,9 +46,9 @@ Flow frequently updates and it is possible that the version you are running may
.*/node_modules/polished/.*
```

## Docs
## TypeScript

**See the full documentation at [polished.js.org](http://polished.js.org/docs)!**
`✨ polished` has [TypeScript](https://www.typescriptlang.org/) definitions to allow the library to be used in any TypeScript project.

### Babel plugin

Expand All @@ -54,105 +58,6 @@ You can optionally also use [`babel-plugin-polished`](https://github.com/styled-

In the documentation you will see examples using [object spread properties](https://github.com/tc39/proposal-object-rest-spread). (`{ ...other }`) To enable this syntax in your project add the [`transform-object-rest-spread` plugin](https://www.npmjs.com/package/babel-plugin-transform-object-rest-spread) (or the [`stage-3` preset](https://babeljs.io/docs/plugins/preset-stage-3/) to enable all stage three features) to your Babel configuration.

### ToC

<!-- NOTE: Anything between INJECT DOCS START and END will be deleted! -->
<!-- INJECT DOCS START -->
<details open>
<summary>Mixins</summary>
<ul>
<li><a href="http://polished.js.org/docs/#clearfix">clearFix</a></li>
<li><a href="http://polished.js.org/docs/#ellipsis">ellipsis</a></li>
<li><a href="http://polished.js.org/docs/#fontface">fontFace</a></li>
<li><a href="http://polished.js.org/docs/#hidpi">hiDPI</a></li>
<li><a href="http://polished.js.org/docs/#hidetext">hideText</a></li>
<li><a href="http://polished.js.org/docs/#normalize">normalize</a></li>
<li><a href="http://polished.js.org/docs/#placeholder">placeholder</a></li>
<li><a href="http://polished.js.org/docs/#radialgradient">radialGradient</a></li>
<li><a href="http://polished.js.org/docs/#retinaimage">retinaImage</a></li>
<li><a href="http://polished.js.org/docs/#selection">selection</a></li>
<li><a href="http://polished.js.org/docs/#timingfunctions">timingFunctions</a></li>
<li><a href="http://polished.js.org/docs/#triangle">triangle</a></li>
<li><a href="http://polished.js.org/docs/#wordwrap">wordWrap</a></li>
</ul>
</details>
<details open>
<summary>Color</summary>
<ul>
<li><a href="http://polished.js.org/docs/#adjusthue">adjustHue</a></li>
<li><a href="http://polished.js.org/docs/#complement">complement</a></li>
<li><a href="http://polished.js.org/docs/#darken">darken</a></li>
<li><a href="http://polished.js.org/docs/#desaturate">desaturate</a></li>
<li><a href="http://polished.js.org/docs/#grayscale">grayscale</a></li>
<li><a href="http://polished.js.org/docs/#hsl">hsl</a></li>
<li><a href="http://polished.js.org/docs/#hsla">hsla</a></li>
<li><a href="http://polished.js.org/docs/#invert">invert</a></li>
<li><a href="http://polished.js.org/docs/#lighten">lighten</a></li>
<li><a href="http://polished.js.org/docs/#mix">mix</a></li>
<li><a href="http://polished.js.org/docs/#opacify">opacify</a></li>
<li><a href="http://polished.js.org/docs/#parsetohsl">parseToHsl</a></li>
<li><a href="http://polished.js.org/docs/#parsetorgb">parseToRgb</a></li>
<li><a href="http://polished.js.org/docs/#readablecolor">readableColor</a></li>
<li><a href="http://polished.js.org/docs/#rgb">rgb</a></li>
<li><a href="http://polished.js.org/docs/#rgba">rgba</a></li>
<li><a href="http://polished.js.org/docs/#saturate">saturate</a></li>
<li><a href="http://polished.js.org/docs/#sethue">setHue</a></li>
<li><a href="http://polished.js.org/docs/#setlightness">setLightness</a></li>
<li><a href="http://polished.js.org/docs/#setsaturation">setSaturation</a></li>
<li><a href="http://polished.js.org/docs/#shade">shade</a></li>
<li><a href="http://polished.js.org/docs/#tint">tint</a></li>
<li><a href="http://polished.js.org/docs/#transparentize">transparentize</a></li>
</ul>
</details>
<details open>
<summary>Shorthands</summary>
<ul>
<li><a href="http://polished.js.org/docs/#animation">animation</a></li>
<li><a href="http://polished.js.org/docs/#backgroundimages">backgroundImages</a></li>
<li><a href="http://polished.js.org/docs/#backgrounds">backgrounds</a></li>
<li><a href="http://polished.js.org/docs/#bordercolor">borderColor</a></li>
<li><a href="http://polished.js.org/docs/#borderradius">borderRadius</a></li>
<li><a href="http://polished.js.org/docs/#borderstyle">borderStyle</a></li>
<li><a href="http://polished.js.org/docs/#borderwidth">borderWidth</a></li>
<li><a href="http://polished.js.org/docs/#buttons">buttons</a></li>
<li><a href="http://polished.js.org/docs/#margin">margin</a></li>
<li><a href="http://polished.js.org/docs/#padding">padding</a></li>
<li><a href="http://polished.js.org/docs/#position">position</a></li>
<li><a href="http://polished.js.org/docs/#size">size</a></li>
<li><a href="http://polished.js.org/docs/#textinputs">textInputs</a></li>
<li><a href="http://polished.js.org/docs/#transitions">transitions</a></li>
</ul>
</details>
<details open>
<summary>Helpers</summary>
<ul>
<li><a href="http://polished.js.org/docs/#directionalproperty">directionalProperty</a></li>
<li><a href="http://polished.js.org/docs/#em">em</a></li>
<li><a href="http://polished.js.org/docs/#modularscale">modularScale</a></li>
<li><a href="http://polished.js.org/docs/#rem">rem</a></li>
<li><a href="http://polished.js.org/docs/#stripunit">stripUnit</a></li>
</ul>
</details>
<details open>
<summary>Types</summary>
<ul>
<li><a href="http://polished.js.org/docs/#animationproperty">AnimationProperty</a></li>
<li><a href="http://polished.js.org/docs/#fontfaceconfiguration">FontFaceConfiguration</a></li>
<li><a href="http://polished.js.org/docs/#hslcolor">HslColor</a></li>
<li><a href="http://polished.js.org/docs/#hslacolor">HslaColor</a></li>
<li><a href="http://polished.js.org/docs/#interactionstate">InteractionState</a></li>
<li><a href="http://polished.js.org/docs/#pointingdirection">PointingDirection</a></li>
<li><a href="http://polished.js.org/docs/#radialgradientconfiguration">RadialGradientConfiguration</a></li>
<li><a href="http://polished.js.org/docs/#ratio">Ratio</a></li>
<li><a href="http://polished.js.org/docs/#rgbacolor">RgbaColor</a></li>
<li><a href="http://polished.js.org/docs/#rgbcolor">RgbColor</a></li>
<li><a href="http://polished.js.org/docs/#timingfunction">TimingFunction</a></li>
<li><a href="http://polished.js.org/docs/#tocolorstring">toColorString</a></li>
<li><a href="http://polished.js.org/docs/#modularscaleratio">ModularScaleRatio</a></li>
</ul>
</details>
<!-- INJECT DOCS END -->

## Why?

When writing styles in JavaScript, many people need Sass-style helper functions to be productive. `✨ polished` brings them to you in a nice, lightweight package tailor-made for styles in JavaScript.
Expand Down
39 changes: 0 additions & 39 deletions docs-theme/markdown.js
View file

This file was deleted.

3 changes: 1 addition & 2 deletions docs/assets/polished.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -181,7 +181,7 @@ var pxtoFactory$1 = function pxtoFactory$1(to) {
*/

// Don’t inline this variable into export because Rollup will remove the /*#__PURE__*/ comment
var em = /*#__PURE__*/pxtoFactory$1('em'); // eslint-disable-line spaced-comment
var em = /* #__PURE__*/pxtoFactory$1('em'); // eslint-disable-line spaced-comment

//

Expand Down Expand Up @@ -2200,7 +2200,6 @@ function opacify(amount, color) {
var curriedOpacify = /*#__PURE__*/curry(opacify); // eslint-disable-line spaced-comment

//

var h = function h(c) {
return c / 255 <= 0.03928 ? c / 255 / 12.92 : Math.pow((c / 255 + 0.055) / 1.055, 2.4);
};
Expand Down
Loading

0 comments on commit 63b24f4

Please sign in to comment.