Spearhead/joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Adding in CSS functions and adding to Radio CSS

Browse Source
This commit is contained in:
Alex Windett 2016-10-27 16:06:40 +01:00
parent 7663819f02
commit e75942af75
6 changed files with 36 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ui/package.json
View File

@ -49,6 +49,7 @@
"postcss-at-rules-variables": "0.0.25",
"postcss-cssnext": "^2.8.0",
"postcss-for": "^2.1.1",
"postcss-functions": "^2.1.1",
"postcss-import": "8.0.2",
"postcss-loader": "^1.0.0",
"postcss-mixins": "^5.4.0",

2
ui/src/components/radio/index.js
View File

@ -37,10 +37,10 @@ const Radio = ({
Radio.propTypes = {
checked: React.PropTypes.bool,
label: React.PropTypes.node,
className: React.PropTypes.string,
disabled: React.PropTypes.bool,
id: React.PropTypes.string,
label: React.PropTypes.node,
name: React.PropTypes.string,
onChange: React.PropTypes.func,
style: React.PropTypes.object,

4
ui/src/components/radio/style.css
View File

@ -15,8 +15,8 @@
}
& span {
margin-left: 30px;
margin-right: 20px;
margin-left: remCalc(30);
margin-right: remCalc(20);
@add-mixin pseduo-element before, var(--radio-radius), var(--radio-radius), -1px, auto, auto, -30px {
border: var(--radio-border-size) solid white;

10
ui/webpack/base.js
View File

@ -15,6 +15,16 @@ const plugins = {
require("postcss-import")(),
require('postcss-at-rules-variables')(),
require('postcss-modules-values'),
require('postcss-functions')({
functions: {
remCalc: function(pixels) {
pixels = pixels.replace('px', '');
const baseValue = 16;
const remSize = pixels / baseValue;
return `${remSize}rem`;
}
},
}),
require('postcss-mixins')(),
require('postcss-for'),
require('postcss-cssnext')()

23
ui/yarn.lock
View File

@ -2651,6 +2651,16 @@ glob-parent@^2.0.0:
dependencies:
is-glob "^2.0.0"
glob@^5.0.15:
version "5.0.15"
resolved "https://registry.yarnpkg.com/glob/-/glob-5.0.15.tgz#1bc936b9e02f4a603fcc222ecf7633d30b8b93b1"
dependencies:
inflight "^1.0.4"
inherits "2"
minimatch "2 || 3"
once "^1.3.0"
path-is-absolute "^1.0.0"
glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.0.6:
version "7.1.1"
resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.1.tgz#805211df04faaf1c63a3600306cdf5ade50b2ec8"
@ -3688,7 +3698,7 @@ minimalistic-assert@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz#702be2dda6b37f4836bcb3f5db56641b64a1d3d3"
minimatch@^3.0.0, minimatch@^3.0.2:
minimatch@^3.0.0, minimatch@^3.0.2, "minimatch@2 || 3":
version "3.0.3"
resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.3.tgz#2a4e4090b96b2db06a9d7df01055a62a77c9b774"
dependencies:
@ -4417,6 +4427,15 @@ postcss-for@^2.1.1:
postcss "^5.0.0"
postcss-simple-vars "^2.0.0"
postcss-functions:
version "2.1.1"
resolved "https://registry.yarnpkg.com/postcss-functions/-/postcss-functions-2.1.1.tgz#f9b64d3b5690f6795fe42a180496805375b7a840"
dependencies:
glob "^5.0.15"
object-assign "^4.0.1"
postcss "^5.0.10"
postcss-value-parser "^3.1.3"
postcss-import@8.0.2:
version "8.0.2"
resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-8.0.2.tgz#59cf54d92cfd25ea96a82ee1e404acad6196fc22"
@ -4699,7 +4718,7 @@ postcss-unique-selectors@^2.0.2:
postcss "^5.0.4"
uniqs "^2.0.0"
postcss-value-parser@^3.0.1, postcss-value-parser@^3.0.2, postcss-value-parser@^3.1.1, postcss-value-parser@^3.1.2, postcss-value-parser@^3.2.3, postcss-value-parser@^3.3.0:
postcss-value-parser@^3.0.1, postcss-value-parser@^3.0.2, postcss-value-parser@^3.1.1, postcss-value-parser@^3.1.2, postcss-value-parser@^3.1.3, postcss-value-parser@^3.2.3, postcss-value-parser@^3.3.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz#87f38f9f18f774a4ab4c8a232f5c5ce8872a9d15"