├── .gitignore
├── index.html
├── LICENSE.txt
├── column-rule-color.scss
├── css
├── column-rule-color.css
├── css-column-rule-color.min.css
└── css-column-rule-color.css
├── src
└── css-column-rule-color.css
├── package.json
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | # List of files for git to ignore
2 |
3 | .DS_Store
4 | .AppleDouble
5 | .LSOverride
6 |
7 | # Icon must end with two \r
8 | Icon
9 |
10 |
11 | # Thumbnails
12 | ._*
13 |
14 | # Files that might appear on external disk
15 | .Spotlight-V100
16 | .Trashes
17 |
18 | # Directories potentially created on remote AFP share
19 | .AppleDB
20 | .AppleDesktop
21 | Network Trash Folder
22 | Temporary Items
23 | .apdisk
24 |
25 | # Vim
26 | Session.vim
27 |
28 | # Node
29 | node_modules/*
30 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | css - column rule color
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 | npm install --save-dev css-column-rule-color
17 |
18 |
19 |
20 |
22 |
23 |
24 |
--------------------------------------------------------------------------------
/LICENSE.txt:
--------------------------------------------------------------------------------
1 | ISC License (ISC)
2 | Copyright (c) 2018, Adam Morse
3 |
4 | Permission to use, copy, modify, and/or distribute this software for any
5 | purpose with or without fee is hereby granted, provided that the above
6 | copyright notice and this permission notice appear in all copies.
7 |
8 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
9 | REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND
10 | FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
11 | INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
12 | LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
13 | OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
14 | PERFORMANCE OF THIS SOFTWARE.
15 |
--------------------------------------------------------------------------------
/column-rule-color.scss:
--------------------------------------------------------------------------------
1 | /*
2 | COLUMN RULE COLOR
3 | */
4 |
5 | .crc-drkgry { column-rule-color: $dark-gray; }
6 | .crc-transparent { column-rule-color: transparent; }
7 | .crc-i { column-rule-color: inherit; }
8 |
9 | @media screen and (min-width: 48em) {
10 | .crc-drkgry-ns { column-rule-color: $dark-gray; }
11 | .crc-transparent-ns { column-rule-color: transparent; }
12 | .crc-i-ns { column-rule-color: inherit; }
13 | }
14 |
15 | @media screen and (min-width:48em) and (max-width: 64em) {
16 | .crc-drkgry-m { column-rule-color: $dark-gray; }
17 | .crc-transparent-m { column-rule-color: transparent; }
18 | .crc-i-m { column-rule-color: inherit; }
19 |
20 | }
21 |
22 | @media screen and (min-width: 64em) {
23 | .crc-drkgry-l { column-rule-color: $dark-gray; }
24 | .crc-transparent-l { column-rule-color: transparent; }
25 | .crc-i-l { column-rule-color: inherit; }
26 | }
27 |
28 |
--------------------------------------------------------------------------------
/css/column-rule-color.css:
--------------------------------------------------------------------------------
1 | /*
2 | COLUMN RULE COLOR
3 | */
4 |
5 | .crc-drkgry { column-rule-color: $dark-gray; }
6 | .crc-transparent { column-rule-color: transparent; }
7 | .crc-i { column-rule-color: inherit; }
8 |
9 | @media screen and (min-width: 48em) {
10 | .crc-drkgry-ns { column-rule-color: $dark-gray; }
11 | .crc-transparent-ns { column-rule-color: transparent; }
12 | .crc-i-ns { column-rule-color: inherit; }
13 | }
14 |
15 | @media screen and (min-width:48em) and (max-width: 64em) {
16 | .crc-drkgry-m { column-rule-color: $dark-gray; }
17 | .crc-transparent-m { column-rule-color: transparent; }
18 | .crc-i-m { column-rule-color: inherit; }
19 |
20 | }
21 |
22 | @media screen and (min-width: 64em) {
23 | .crc-drkgry-l { column-rule-color: $dark-gray; }
24 | .crc-transparent-l { column-rule-color: transparent; }
25 | .crc-i-l { column-rule-color: inherit; }
26 | }
27 |
28 |
--------------------------------------------------------------------------------
/src/css-column-rule-color.css:
--------------------------------------------------------------------------------
1 | /*
2 | COLUMN RULE COLOR
3 | */
4 |
5 | .crc-drkgry { column-rule-color: $dark-gray; }
6 | .crc-transparent { column-rule-color: transparent; }
7 | .crc-i { column-rule-color: inherit; }
8 |
9 | @media screen and (min-width: 48em) {
10 | .crc-drkgry-ns { column-rule-color: $dark-gray; }
11 | .crc-transparent-ns { column-rule-color: transparent; }
12 | .crc-i-ns { column-rule-color: inherit; }
13 | }
14 |
15 | @media screen and (min-width:48em) and (max-width: 64em) {
16 | .crc-drkgry-m { column-rule-color: $dark-gray; }
17 | .crc-transparent-m { column-rule-color: transparent; }
18 | .crc-i-m { column-rule-color: inherit; }
19 |
20 | }
21 |
22 | @media screen and (min-width: 64em) {
23 | .crc-drkgry-l { column-rule-color: $dark-gray; }
24 | .crc-transparent-l { column-rule-color: transparent; }
25 | .crc-i-l { column-rule-color: inherit; }
26 | }
27 |
28 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "css-column-rule-color",
3 | "style": "column-rule-color.css",
4 | "version": "1.0.8",
5 | "homepage": "http://github.com/mrmrs/css-column-rule-color",
6 | "description": "Css module of single purpose classes for column rule color",
7 | "keywords": [
8 | "css",
9 | "oocss",
10 | "column-rule-color"
11 | ],
12 | "css-column-rule-color": {
13 | "type": "git",
14 | "url": "http://github.com/mrmrs/css-column-rule-color.git"
15 | },
16 | "bugs": {
17 | "url": "https://github.com/mrmrs/css-column-rule-color/issues",
18 | "email": "hi@mrmrs.cc"
19 | },
20 | "author": {
21 | "name": "Adam Morse",
22 | "email": "hi@mrmrs.cc",
23 | "url": "http://mrmrs.cc"
24 | },
25 | "contributors": [
26 | {
27 | "name": "Adam Morse",
28 | "email": "hi@mrmrs.cc"
29 | }
30 | ],
31 | "license": "MIT",
32 | "devDependencies": {
33 | "tachyons-cli": "^1.3.0"
34 | },
35 | "scripts": {
36 | "start": "tachyons src/css-column-rule-color.css > css/css-column-rule-color.css && tachyons src/css-column-rule-color.css --minify > css/css-column-rule-color.min.css && tachyons src/css-column-rule-color.css --generate-docs --package=../../package.json > readme.md"
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/css/css-column-rule-color.min.css:
--------------------------------------------------------------------------------
1 | .crc-drkgry{-webkit-column-rule-color:$dark-gray;-moz-column-rule-color:$dark-gray;column-rule-color:$dark-gray}.crc-transparent{-webkit-column-rule-color:transparent;-moz-column-rule-color:transparent;column-rule-color:transparent}.crc-i{-webkit-column-rule-color:inherit;-moz-column-rule-color:inherit;column-rule-color:inherit}@media screen and (min-width:48em){.crc-drkgry-ns{-webkit-column-rule-color:$dark-gray;-moz-column-rule-color:$dark-gray;column-rule-color:$dark-gray}.crc-transparent-ns{-webkit-column-rule-color:transparent;-moz-column-rule-color:transparent;column-rule-color:transparent}.crc-i-ns{-webkit-column-rule-color:inherit;-moz-column-rule-color:inherit;column-rule-color:inherit}}@media screen and (min-width:48em) and (max-width:64em){.crc-drkgry-m{-webkit-column-rule-color:$dark-gray;-moz-column-rule-color:$dark-gray;column-rule-color:$dark-gray}.crc-transparent-m{-webkit-column-rule-color:transparent;-moz-column-rule-color:transparent;column-rule-color:transparent}.crc-i-m{-webkit-column-rule-color:inherit;-moz-column-rule-color:inherit;column-rule-color:inherit}}@media screen and (min-width:64em){.crc-drkgry-l{-webkit-column-rule-color:$dark-gray;-moz-column-rule-color:$dark-gray;column-rule-color:$dark-gray}.crc-transparent-l{-webkit-column-rule-color:transparent;-moz-column-rule-color:transparent;column-rule-color:transparent}.crc-i-l{-webkit-column-rule-color:inherit;-moz-column-rule-color:inherit;column-rule-color:inherit}}
2 |
3 |
--------------------------------------------------------------------------------
/css/css-column-rule-color.css:
--------------------------------------------------------------------------------
1 | /*
2 | COLUMN RULE COLOR
3 | */
4 | .crc-drkgry { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
5 | .crc-transparent { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
6 | .crc-i { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
7 | @media screen and (min-width: 48em) {
8 | .crc-drkgry-ns { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
9 | .crc-transparent-ns { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
10 | .crc-i-ns { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
11 | }
12 | @media screen and (min-width:48em) and (max-width: 64em) {
13 | .crc-drkgry-m { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
14 | .crc-transparent-m { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
15 | .crc-i-m { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
16 | }
17 | @media screen and (min-width: 64em) {
18 | .crc-drkgry-l { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
19 | .crc-transparent-l { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
20 | .crc-i-l { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
21 | }
22 |
23 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # css-column-rule-color 1.0.6
2 |
3 | Css module of single purpose classes for column rule color
4 |
5 | #### Stats
6 |
7 | 242 | 12 | 36
8 | ---|---|---
9 | bytes | selectors | declarations
10 |
11 | ## Installation
12 |
13 | #### With [npm](https://npmjs.com)
14 |
15 | ```
16 | npm install --save-dev css-column-rule-color
17 | ```
18 |
19 | Learn more about using css installed with npm:
20 | * https://webpack.github.io/docs/stylesheets.html
21 | * https://github.com/defunctzombie/npm-css
22 |
23 | #### With Git
24 |
25 | http:
26 | ```
27 | git clone https://github.com/tachyons-css/css-column-rule-color
28 | ```
29 |
30 | ssh:
31 | ```
32 | git clone git@github.com:tachyons-css/css-column-rule-color.git
33 | ```
34 |
35 | ## Usage
36 |
37 | #### Using with [Postcss](https://github.com/postcss/postcss)
38 |
39 | Import the css module
40 |
41 | ```css
42 | @import "css-column-rule-color";
43 | ```
44 |
45 | Then process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)
46 |
47 | ```sh
48 | $ npm i -g tachyons-cli
49 | $ tachyons path/to/css-file.css > dist/t.css
50 | ```
51 |
52 | #### Using the css
53 |
54 | ##### CDN
55 | The easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:
56 |
57 | ```
58 |
59 | ```
60 |
61 | ##### Locally
62 | The built css is located in the `css` directory. It contains an unminified and minified version.
63 | You can either cut and paste that css or link to it directly in your html.
64 |
65 | ```html
66 |
67 | ```
68 |
69 | #### Development
70 |
71 | The source css files can be found in the `src` directory.
72 | Running `$ npm start` will process the source css and place the built css in the `css` directory.
73 |
74 | ## The css
75 |
76 | ```css
77 | /*
78 | COLUMN RULE COLOR
79 | */
80 | .crc-drkgry { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
81 | .crc-transparent { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
82 | .crc-i { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
83 | @media screen and (min-width: 48em) {
84 | .crc-drkgry-ns { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
85 | .crc-transparent-ns { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
86 | .crc-i-ns { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
87 | }
88 | @media screen and (min-width:48em) and (max-width: 64em) {
89 | .crc-drkgry-m { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
90 | .crc-transparent-m { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
91 | .crc-i-m { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
92 | }
93 | @media screen and (min-width: 64em) {
94 | .crc-drkgry-l { -webkit-column-rule-color: $dark-gray; -moz-column-rule-color: $dark-gray; column-rule-color: $dark-gray; }
95 | .crc-transparent-l { -webkit-column-rule-color: transparent; -moz-column-rule-color: transparent; column-rule-color: transparent; }
96 | .crc-i-l { -webkit-column-rule-color: inherit; -moz-column-rule-color: inherit; column-rule-color: inherit; }
97 | }
98 | ```
99 |
100 | ## Contributing
101 |
102 | 1. Fork it
103 | 2. Create your feature branch (`git checkout -b my-new-feature`)
104 | 3. Commit your changes (`git commit -am 'Add some feature'`)
105 | 4. Push to the branch (`git push origin my-new-feature`)
106 | 5. Create new Pull Request
107 |
108 | ## Authors
109 |
110 | * [mrmrs](http://mrmrs.io)
111 | * [johno](http://johnotander.com)
112 |
113 | ## License
114 |
115 | ISC
116 |
117 |
--------------------------------------------------------------------------------