oceanprotocol
/
docs
mirror of https://github.com/oceanprotocol/docs.git
1
0
Fork 0
Code Releases Activity

add stylelint, lint & format tasks

This commit is contained in:
Matthias Kretschmann 2018-11-10 15:04:16 +01:00
parent e6224e2d0d
commit 4b1ad4d95e
Signed by: m
GPG Key ID: 606EEEF3C479A91F
14 changed files with 110 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
.stylelintrc Normal file
View File

@ -0,0 +1,11 @@
{
"extends": [
"stylelint-config-bigchaindb",
"stylelint-config-css-modules",
"./node_modules/prettier-stylelint/config.js"
],
"syntax": "scss",
"rules": {
"no-descending-specificity": null
}
}

1
README.md
View File

@ -6,6 +6,7 @@
[![Build Status](https://travis-ci.com/oceanprotocol/docs.svg?token=3psqw6c8KMDqfdGQ2x6d&branch=master)](https://travis-ci.com/oceanprotocol/docs)
[![js oceanprotocol](https://img.shields.io/badge/js-oceanprotocol-7b1173.svg)](https://github.com/oceanprotocol/eslint-config-oceanprotocol)
[![css bigchaindb](https://img.shields.io/badge/css-bigchaindb-39BA91.svg)](https://github.com/bigchaindb/stylelint-config-bigchaindb)
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-7b1173.svg?style=flat-square)](https://github.com/prettier/prettier)
[![Greenkeeper badge](https://badges.greenkeeper.io/oceanprotocol/docs.svg?token=2757ede2de02f4679c4dfc6597a331a26f2f206fed53bfeb708c64cbe3d5f55f&ts=1541590505792)](https://greenkeeper.io/)

18
package.json
View File

@ -5,7 +5,7 @@
"author": "Ocean Protocol <devops@oceanprotocol.com>",
"dependencies": {
"@oceanprotocol/art": "^1.0.2",
"gatsby": "^2.0.44",
"gatsby": "^2.0.45",
"gatsby-image": "^2.0.20",
"gatsby-plugin-catch-links": "^2.0.8",
"gatsby-plugin-google-analytics": "^2.0.7",
@ -39,15 +39,25 @@
"build": "gatsby build",
"start": "gatsby develop",
"ssr": "npm run build && serve -s public/",
"format": "prettier --write 'src/**/*.{js,jsx}'",
"test": "eslint --ext .js,.jsx ."
"format:js": "prettier --write 'src/**/*.{js,jsx}'",
"format:css": "prettier-stylelint --write --quiet 'src/**/*.{css,scss}'",
"format": "run-p format:js format:css",
"lint:js": "eslint ./gatsby-*.js && eslint ./src/**/*.{js,jsx}",
"lint:css": "stylelint ./src/**/*.{css,scss}",
"lint": "run-p lint:js lint:css",
"test": "npm run lint"
},
"devDependencies": {
"eslint": "^5.9.0",
"eslint-config-oceanprotocol": "^1.3.0",
"eslint-config-prettier": "^3.1.0",
"eslint-plugin-prettier": "^3.0.0",
"prettier": "^1.14.2"
"npm-run-all": "^4.1.3",
"prettier": "^1.15.1",
"prettier-stylelint": "^0.4.2",
"stylelint-config-bigchaindb": "^1.2.1",
"stylelint-config-css-modules": "^1.3.0",
"stylelint-config-standard": "^18.2.0"
},
"repository": {
"type": "git",

3
src/components/DocContent.module.scss
View File

@ -14,7 +14,8 @@
margin-top: $spacer / 2;
}
h1, h2 {
h1,
h2 {
margin-top: $spacer * $line-height;
margin-bottom: $spacer / $line-height;
padding-bottom: $spacer / $line-height;

2
src/components/DocFooter.module.scss
View File

@ -28,5 +28,5 @@
}
.active {
color: $brand-pink !important;
color: $brand-pink !important; // stylelint-disable-line declaration-no-important
}

4
src/components/Header.module.scss
View File

@ -1,7 +1,9 @@
@import 'variables';
.header {
background: $brand-black url('@oceanprotocol/art/jellyfish/jellyfish-back@2x.png') no-repeat center -4rem;
background: $brand-black
url('@oceanprotocol/art/jellyfish/jellyfish-back@2x.png') no-repeat
center -4rem;
background-size: cover;
width: 100%;
padding: $spacer / 2 0;

6
src/components/HeaderHome.module.scss
View File

@ -2,7 +2,9 @@
@import 'animations';
.header {
background: $brand-black url('@oceanprotocol/art/jellyfish/jellyfish-back@2x.png') no-repeat center 7rem;
background: $brand-black
url('@oceanprotocol/art/jellyfish/jellyfish-back@2x.png') no-repeat
center 7rem;
background-size: cover;
width: 100%;
padding: $spacer * 2 0;
@ -46,5 +48,3 @@
font-size: $font-size-large;
}
}

4
src/components/Repositories/Repository.module.scss
View File

@ -27,7 +27,9 @@
padding: 0;
margin-left: $spacer / $line-height;
&:before { display: none; }
&:before {
display: none;
}
}
a {

4
src/components/Sidebar.module.scss
View File

@ -57,7 +57,9 @@
li {
display: block;
&:before { display: none; }
&:before {
display: none;
}
}
}

9
src/pages/index.module.scss
View File

@ -17,12 +17,13 @@
margin-top: $spacer;
animation: fadeInUp .6s ease-out backwards;
&:before { display: none; }
&:before {
display: none;
}
@media (min-width: $break-point--medium) {
flex: 0 0 31%;
}
animation-delay: .4s;
&:nth-child(2) {
@ -39,7 +40,7 @@
flex-wrap: wrap;
padding: $spacer $spacer * $line-height;
border-radius: $border-radius;
box-shadow: rgba($brand-black, .1) 0px 9px 18px;
box-shadow: rgba($brand-black, .1) 0 9px 18px;
color: $brand-grey;
background: $brand-white;
height: 100%;
@ -47,7 +48,7 @@
&:hover,
&:focus {
color: $brand-grey;
box-shadow: rgba($brand-black, .1) 0px 12px 20px;
box-shadow: rgba($brand-black, .1) 0 12px 20px;
svg {
transform: translate3d(.2rem, 0, 0);

4
src/styles/_animations.scss
View File

@ -1,6 +1,6 @@
@keyframes fadeInUp {
0% {
opacity: 0.01;
opacity: .01;
transform: translate3d(0, 5rem, 0);
}
@ -12,7 +12,7 @@
@keyframes fadeIn {
0% {
opacity: 0.01;
opacity: .01;
}
100% {

16
src/styles/_fonts.scss
View File

@ -1,26 +1,26 @@
@font-face {
font-family: 'Sharp Sans Display';
src: url('../fonts/SharpSansDispNo1-Bold.woff2') format('woff2'),
url('../fonts/SharpSansDispNo1-Bold.woff') format('woff');
url('../fonts/SharpSansDispNo1-Bold.woff') format('woff');
font-weight: 600;
font-style: normal;
font-stretch: normal;
}
}
@font-face {
@font-face {
font-family: 'Sharp Sans Medium';
src: url('../fonts/SharpSans-Medium.woff2') format('woff2'),
url('../fonts/SharpSans-Medium.woff') format('woff');
url('../fonts/SharpSans-Medium.woff') format('woff');
font-weight: 500;
font-style: normal;
font-stretch: normal;
}
}
@font-face {
@font-face {
font-family: 'Sharp Sans Bold';
src: url('../fonts/SharpSans-Bold.woff2') format('woff2'),
url('../fonts/SharpSans-Bold.woff') format('woff');
url('../fonts/SharpSans-Bold.woff') format('woff');
font-weight: 600;
font-style: normal;
font-stretch: normal;
}
}

89
src/styles/_variables.scss
View File

@ -1,59 +1,62 @@
// Colors
$brand-white: #fff;
$brand-black: #141414;
$brand-pink: #ff4092;
$brand-purple: #7b1173;
$brand-violet: #e000cf;
$brand-blue: #11597b;
$brand-white: #fff;
$brand-black: #141414;
$brand-pink: #ff4092;
$brand-purple: #7b1173;
$brand-violet: #e000cf;
$brand-blue: #11597b;
$brand-grey: #41474e;
$brand-grey-light: #8b98a9;
$brand-grey-dark: #303030;
$brand-grey-lighter: #e2e2e2;
$brand-grey: #41474e;
$brand-grey-light: #8b98a9;
$brand-grey-dark: #303030;
$brand-grey-lighter: #e2e2e2;
$green: #5fb359;
$red: #d80606;
$orange: #b35f36;
$yellow: #eac146;
$green: #5fb359;
$red: #d80606;
$orange: #b35f36;
$yellow: #eac146;
$brand-gradient: linear-gradient(to right bottom, $brand-purple, $brand-pink);
// Fonts
$font-family-base: 'Sharp Sans Medium', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
$font-family-title: 'Sharp Sans Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
$font-family-button: 'Sharp Sans Bold', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
$font-family-base: 'Sharp Sans Medium', -apple-system, BlinkMacSystemFont,
'Segoe UI', Helvetica, Arial, sans-serif;
$font-family-title: 'Sharp Sans Display', -apple-system, BlinkMacSystemFont,
'Segoe UI', Helvetica, Arial, sans-serif;
$font-family-button: 'Sharp Sans Bold', -apple-system, BlinkMacSystemFont,
'Segoe UI', Helvetica, Arial, sans-serif;
$font-family-monospace: 'Fira Code', 'Fira Mono', Menlo, Monaco, Consolas,
'Courier New', monospace;
'Courier New', monospace;
$font-size-root: 15px;
$font-size-base: 1rem;
$font-size-large: 1.2rem;
$font-size-small: .85rem;
$font-size-mini: .65rem;
$font-size-text: $font-size-base;
$font-size-label: $font-size-base;
$font-size-title: 1.4rem;
$font-size-h1: 3rem;
$font-size-h2: 1.7rem;
$font-size-h3: 1.4rem;
$font-size-h4: $font-size-large;
$font-size-h5: 1.1rem;
$font-size-root: 15px;
$font-size-base: 1rem;
$font-size-large: 1.2rem;
$font-size-small: .85rem;
$font-size-mini: .65rem;
$font-size-text: $font-size-base;
$font-size-label: $font-size-base;
$font-size-title: 1.4rem;
$font-size-h1: 3rem;
$font-size-h2: 1.7rem;
$font-size-h3: 1.4rem;
$font-size-h4: $font-size-large;
$font-size-h5: 1.1rem;
$font-weight-base: 500;
$font-weight-bold: 600;
$font-weight-base: 500;
$font-weight-bold: 600;
$line-height: 1.6;
$line-height: 1.6;
// Sizes
$spacer: 2rem;
$page-frame: .75rem;
$spacer: 2rem;
$page-frame: .75rem;
$break-point--small: 640px;
$break-point--medium: 860px;
$break-point--large: 1140px;
$break-point--huge: 1400px;
$brand-border-width: 1px;
$break-point--small: 640px;
$break-point--medium: 860px;
$break-point--large: 1140px;
$break-point--huge: 1400px;
$brand-border-width: 1px;
$border-radius: .2rem;
$border-radius: .2rem;
$narrowWidth: 35rem;
$narrowWidth: 35rem;

14
src/styles/global.scss
View File

@ -1,3 +1,5 @@
// stylelint-disable selector-no-qualifying-type, declaration-no-important, selector-no-vendor-prefix
@import 'variables';
@import 'fonts';
@ -59,7 +61,7 @@ p {
ul {
li {
&::before {
&:before {
content: ' \25AA'; // Black Small Square: ▪ &#9642;
top: -2px;
}
@ -70,7 +72,7 @@ ol {
counter-reset: ol-counter;
li {
&::before {
&:before {
content: counter(ol-counter) '.';
counter-increment: ol-counter;
font-family: $font-family-button;
@ -78,7 +80,7 @@ ol {
}
}
ul li::before {
ul li:before {
content: ' \25AA';
}
}
@ -94,7 +96,7 @@ ol {
position: relative;
display: block;
&::before {
&:before {
position: absolute;
left: -($spacer / $line-height);
color: $brand-grey-light;
@ -220,11 +222,11 @@ table {
border-bottom: 1px solid $brand-grey-lighter;
text-align: left;
&[align="center"] {
&[align='center'] {
text-align: center;
}
&[align="right"] {
&[align='right'] {
text-align: right;
}
}