mirror of
https://github.com/restoreddev/phpapprentice.git
synced 2025-01-16 22:28:13 +01:00
Using css custom properties and moving dark mode js to top of page
This commit is contained in:
Andrew Davis
parent
5ed7a72db1
commit
56464d4ea8
4
assets/dark-mode.js
Normal file
4
assets/dark-mode.js
Normal file
@ -0,0 +1,4 @@
|
||||
var bodyTag = document.querySelector('body');
|
||||
if (localStorage.getItem('dark_mode') === 'true') {
|
||||
bodyTag.className = 'dark-mode';
|
||||
}
|
||||
@ -1,9 +1,5 @@
|
||||
// Dark mode
|
||||
var bodyTag = document.querySelector('body');
|
||||
if (localStorage.getItem('dark_mode') === 'true') {
|
||||
bodyTag.className = 'dark-mode';
|
||||
}
|
||||
|
||||
var darkMode = document.getElementById('dark_mode');
|
||||
if (localStorage.getItem('dark_mode') === 'true') {
|
||||
darkMode.checked = true;
|
||||
|
||||
@ -1,23 +1,21 @@
|
||||
@import "assets/prism-solarized.css";
|
||||
@import "assets/prism-tomorrow-night.css";
|
||||
|
||||
$primary-color: #2AA198;
|
||||
$primary-color-dark: #1D6E68;
|
||||
$drop-shadow: rgba(0, 0, 0, 0.4);
|
||||
$code-highlight: #EDEDED;
|
||||
$modal-background: #FFF;
|
||||
$button-text: #FFF;
|
||||
$hr-color: #EEE;
|
||||
|
||||
$dark-background: #222;
|
||||
$dark-text-color: #CCC;
|
||||
$dark-primary-color: #cc99cd; /*#7ec699;*/
|
||||
$dark-primary-color-dark: #8C698C; /*#568769;*/
|
||||
$dark-button-text: #222;
|
||||
$dark-code-highlight: #111;
|
||||
$dark-modal-background: #222;
|
||||
$dark-drop-shadow: rgba(0, 0, 0, 0.6);
|
||||
$dark-hr-color: #444;
|
||||
:root {
|
||||
--primary-color: #2AA198;
|
||||
--primary-color-dark: #1D6E68;
|
||||
--drop-shadow: rgba(0, 0, 0, 0.4);
|
||||
--code-highlight: #EDEDED;
|
||||
--modal-background: #FFF;
|
||||
--button-text: #FFF;
|
||||
--hr-color: #EEE;
|
||||
--dark-background: #222;
|
||||
--dark-text-color: #CCC;
|
||||
--dark-primary-color: #cc99cd; /*#7ec699;*/
|
||||
--dark-primary-color-dark: #8C698C; /*#568769;*/
|
||||
--dark-button-text: #222;
|
||||
--dark-code-highlight: #111;
|
||||
--dark-modal-background: #222;
|
||||
--dark-drop-shadow: rgba(0, 0, 0, 0.6);
|
||||
--dark-hr-color: #444;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Cambria, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
|
||||
@ -26,21 +24,21 @@ body {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
body.dark-mode {
|
||||
background-color: $dark-background;
|
||||
color: $dark-text-color;
|
||||
background-color: var(--dark-background);
|
||||
color: var(--dark-text-color);
|
||||
}
|
||||
button {
|
||||
font-family: Cambria, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
|
||||
}
|
||||
code {
|
||||
background-color: $code-highlight;
|
||||
background-color: var(--code-highlight);
|
||||
font-family: Menlo, Monaco, Consolas, "Noto Mono", "Liberation Mono", "Courier New", monospace !important;
|
||||
font-variant-ligatures: none;
|
||||
font-size: 14px !important;
|
||||
padding: 0.10em 0.25em;
|
||||
}
|
||||
.dark-mode code {
|
||||
background-color: $dark-code-highlight;
|
||||
background-color: var(--dark-code-highlight);
|
||||
}
|
||||
pre, pre code {
|
||||
background-color: transparent;
|
||||
@ -52,27 +50,27 @@ pre, pre code {
|
||||
padding: 0.5em 0 0.5em 0;
|
||||
}
|
||||
a {
|
||||
color: $primary-color;
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
.dark-mode a {
|
||||
color: $dark-primary-color;
|
||||
color: var(--dark-primary-color);
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
color: $primary-color-dark;
|
||||
color: var(--primary-color-dark);
|
||||
}
|
||||
.dark-mode a:hover {
|
||||
color: $dark-primary-color-dark;
|
||||
color: var(--dark-primary-color-dark);
|
||||
}
|
||||
hr {
|
||||
border: 0;
|
||||
height: 1px;
|
||||
background-color: $hr-color;
|
||||
background-color: var(--hr-color);
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
.dark-mode hr {
|
||||
background-color: $dark-hr-color;
|
||||
background-color: var(--dark-hr-color);
|
||||
}
|
||||
p {
|
||||
line-height: 1.5;
|
||||
@ -101,16 +99,16 @@ button {
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
color: $primary-color;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
.dark-mode button {
|
||||
color: $dark-primary-color;
|
||||
color: var(--dark-primary-color);
|
||||
}
|
||||
button:hover {
|
||||
color: $primary-color-dark;
|
||||
color: var(--primary-color-dark);
|
||||
}
|
||||
.dark-mode button:hover {
|
||||
color: $dark-primary-color-dark;
|
||||
color: var(--dark-primary-color-dark);
|
||||
}
|
||||
button:focus {
|
||||
outline: 0;
|
||||
@ -119,45 +117,45 @@ button .icon {
|
||||
vertical-align: middle;
|
||||
}
|
||||
button .icon svg {
|
||||
fill: $primary-color;
|
||||
fill: var(--primary-color);
|
||||
}
|
||||
.dark-mode button .icon svg {
|
||||
fill: $dark-primary-color;
|
||||
fill: var(--dark-primary-color);
|
||||
}
|
||||
button:hover .icon svg {
|
||||
fill: $primary-color-dark;
|
||||
fill: var(--primary-color-dark);
|
||||
}
|
||||
.dark-mode button:hover .icon svg {
|
||||
fill: $dark-primary-color-dark;
|
||||
fill: var(--dark-primary-color-dark);
|
||||
}
|
||||
.button {
|
||||
background-color: $primary-color;
|
||||
color: $button-text;
|
||||
background-color: var(--primary-color);
|
||||
color: var(--button-text);
|
||||
padding: 0.5em 0.75em;
|
||||
border-radius: 2em;
|
||||
display: inline-block;
|
||||
}
|
||||
.dark-mode .button {
|
||||
color: $dark-button-text;
|
||||
background-color: $dark-primary-color;
|
||||
color: var(--dark-button-text);
|
||||
background-color: var(--dark-primary-color);
|
||||
}
|
||||
.button:hover {
|
||||
color: $button-text;
|
||||
background-color: $primary-color-dark;
|
||||
color: var(--button-text);
|
||||
background-color: var(--primary-color-dark);
|
||||
text-decoration: none;
|
||||
}
|
||||
.dark-mode .button:hover {
|
||||
color: $dark-button-text;
|
||||
background-color: $dark-primary-color-dark;
|
||||
color: var(--dark-button-text);
|
||||
background-color: var(--dark-primary-color-dark);
|
||||
}
|
||||
.button .icon {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.button .icon svg {
|
||||
fill: $button-text;
|
||||
fill: var(--button-text);
|
||||
}
|
||||
.dark-mode .button .icon svg {
|
||||
fill: $dark-button-text;
|
||||
fill: var(--dark-button-text);
|
||||
}
|
||||
.clearfix:after {
|
||||
content: "";
|
||||
@ -202,18 +200,18 @@ button:hover .icon svg {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.navigate-links .icon svg {
|
||||
fill: $primary-color;
|
||||
fill: var(--primary-color);
|
||||
}
|
||||
.dark-mode .navigate-links .icon svg {
|
||||
fill: $dark-primary-color;
|
||||
fill: var(--dark-primary-color);
|
||||
}
|
||||
.prev-link:hover .icon svg,
|
||||
.next-link:hover .icon svg {
|
||||
fill: $primary-color-dark;
|
||||
fill: var(--primary-color-dark);
|
||||
}
|
||||
.dark-mode .prev-link:hover .icon svg,
|
||||
.dark-mode .next-link:hover .icon svg {
|
||||
fill: $dark-primary-color-dark;
|
||||
fill: var(--dark-primary-color-dark);
|
||||
}
|
||||
.navigate-links a {
|
||||
margin-left: 1em;
|
||||
@ -299,27 +297,27 @@ button:hover .icon svg {
|
||||
left: 0;
|
||||
z-index: 50;
|
||||
overflow: auto;
|
||||
background-color: $drop-shadow;
|
||||
background-color: var(--drop-shadow);
|
||||
}
|
||||
.dark-mode .modal {
|
||||
background-color: $dark-drop-shadow;
|
||||
background-color: var(--dark-drop-shadow);
|
||||
}
|
||||
.modal-content {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 1em;
|
||||
background-color: $modal-background;
|
||||
background-color: var(--modal-background);
|
||||
max-width: 20em;
|
||||
height: 100%;
|
||||
animation-name: animateleft;
|
||||
animation-duration: .4s;
|
||||
overflow: auto;
|
||||
box-shadow: 0 0 10px 0 $drop-shadow;
|
||||
box-shadow: 0 0 10px 0 var(--drop-shadow);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.dark-mode .modal-content {
|
||||
background-color: $dark-modal-background;
|
||||
box-shadow: 0 0 10px 0 $dark-drop-shadow;
|
||||
background-color: var(--dark-modal-background);
|
||||
box-shadow: 0 0 10px 0 var(--dark-drop-shadow);
|
||||
}
|
||||
.modal-content .table-of-contents {
|
||||
padding: 2em;
|
||||
|
||||
@ -8,19 +8,32 @@
|
||||
<meta name="description" content="{{ if .Description }}{{ .Description }}{{ else }}An online book for learning PHP{{ end }}" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
|
||||
{{ $prismSolarized := resources.Get "prism-solarized.css" }}
|
||||
{{ $prismTomorrowNight := resources.Get "prism-tomorrow-night.css" }}
|
||||
{{ $securePrismSolarized := $prismSolarized | resources.Fingerprint "sha512" }}
|
||||
{{ $securePrismTomorrowNight := $prismTomorrowNight | resources.Fingerprint "sha512" }}
|
||||
|
||||
{{ $css := resources.Get "styles.css" }}
|
||||
{{ $style := $css | resources.PostCSS }}
|
||||
{{ $secureCss := $style | resources.Fingerprint "sha512" }}
|
||||
<link rel="stylesheet" type="text/css" href="{{ $securePrismSolarized.Permalink }}" integrity="{{ $securePrismSolarized.Data.Integrity }}">
|
||||
<link rel="stylesheet" type="text/css" href="{{ $securePrismTomorrowNight.Permalink }}" integrity="{{ $securePrismTomorrowNight.Data.Integrity }}">
|
||||
<link rel="stylesheet" type="text/css" href="{{ $secureCss.Permalink }}" integrity="{{ $secureCss.Data.Integrity }}">
|
||||
<link rel="icon" href="/favicon-32.png">
|
||||
</head>
|
||||
<body class="light-mode">
|
||||
{{ block "main" . }}{{ end }}
|
||||
{{ $darkMode := resources.Get "dark-mode.js" }}
|
||||
{{ $darkModeSecure := $darkMode | resources.Fingerprint "sha512" }}
|
||||
<script type="text/javascript" src="{{ $darkModeSecure.Permalink }}" integrity="{{ $darkModeSecure.Data.Integrity }}"></script>
|
||||
|
||||
{{ $prism := resources.Get "prism.js" }}
|
||||
{{ $site := resources.Get "site.js"}}
|
||||
{{ $js := slice $prism $site | resources.Concat "bundle.js" }}
|
||||
{{ $secureJS := $js | resources.Fingerprint "sha512" }}
|
||||
<script type="text/javascript" src="{{ $secureJS.Permalink }}" integrity="{{ $secureJS.Data.Integrity }}"></script>
|
||||
{{ block "main" . }}{{ end }}
|
||||
|
||||
{{ $prism := resources.Get "prism.js" }}
|
||||
{{ $site := resources.Get "site.js"}}
|
||||
{{ $prismSecure := $prism | resources.Fingerprint "sha512" }}
|
||||
{{ $siteSecure := $site | resources.Fingerprint "sha512" }}
|
||||
<script type="text/javascript" src="{{ $prismSecure.Permalink }}" integrity="{{ $prismSecure.Data.Integrity }}"></script>
|
||||
<script type="text/javascript" src="{{ $siteSecure.Permalink }}" integrity="{{ $siteSecure.Data.Integrity }}"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
104
package-lock.json
generated
104
package-lock.json
generated
@ -1546,6 +1546,12 @@
|
||||
"integrity": "sha512-wPVv/y/QQ/Uiirj/vh3oP+1Ww+AWehmi1g5fFWGPF6IpCBCDVrhgHRMvrLfdYcwDh3QJbGXDW4JAuzxElLSqKA==",
|
||||
"dev": true
|
||||
},
|
||||
"ip-regex": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-4.1.0.tgz",
|
||||
"integrity": "sha512-pKnZpbgCTfH/1NLIlOduP/V+WRXzC2MOz3Qo8xmxk8C5GudJLgK5QyLVXOSWy3ParAH7Eemurl3xjv/WXYFvMA==",
|
||||
"dev": true
|
||||
},
|
||||
"is-accessor-descriptor": {
|
||||
"version": "0.1.6",
|
||||
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
|
||||
@ -1694,6 +1700,15 @@
|
||||
"integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=",
|
||||
"dev": true
|
||||
},
|
||||
"is-url-superb": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-url-superb/-/is-url-superb-3.0.0.tgz",
|
||||
"integrity": "sha512-3faQP+wHCGDQT1qReM5zCPx2mxoal6DzbzquFlCYJLWyy4WPTved33ea2xFbX37z4NoriEwZGIYhFtx8RUB5wQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"url-regex": "^5.0.0"
|
||||
}
|
||||
},
|
||||
"is-windows": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
|
||||
@ -2112,12 +2127,6 @@
|
||||
"integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=",
|
||||
"dev": true
|
||||
},
|
||||
"path-parse": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
|
||||
"integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==",
|
||||
"dev": true
|
||||
},
|
||||
"path-type": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
|
||||
@ -2189,24 +2198,14 @@
|
||||
"yargs": "^12.0.1"
|
||||
}
|
||||
},
|
||||
"postcss-import": {
|
||||
"version": "12.0.1",
|
||||
"resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-12.0.1.tgz",
|
||||
"integrity": "sha512-3Gti33dmCjyKBgimqGxL3vcV8w9+bsHwO5UrBawp796+jdardbcFl4RP5w/76BwNL7aGzpKstIfF9I+kdE8pTw==",
|
||||
"postcss-custom-properties": {
|
||||
"version": "9.0.2",
|
||||
"resolved": "https://registry.npmjs.org/postcss-custom-properties/-/postcss-custom-properties-9.0.2.tgz",
|
||||
"integrity": "sha512-WHaQrEp3gJ6mgxBA4mGJKW6DSVfy2IFnKPFAb2IEulgxGUW8nWp1NkOD/rWR6e2uIuAdnTa0LXSupST7daniAw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"postcss": "^7.0.1",
|
||||
"postcss-value-parser": "^3.2.3",
|
||||
"read-cache": "^1.0.0",
|
||||
"resolve": "^1.1.7"
|
||||
},
|
||||
"dependencies": {
|
||||
"postcss-value-parser": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
|
||||
"integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==",
|
||||
"dev": true
|
||||
}
|
||||
"postcss": "^7.0.17",
|
||||
"postcss-values-parser": "^3.0.5"
|
||||
}
|
||||
},
|
||||
"postcss-load-config": {
|
||||
@ -2231,21 +2230,39 @@
|
||||
"postcss": "^7.0.7"
|
||||
}
|
||||
},
|
||||
"postcss-simple-vars": {
|
||||
"version": "5.0.2",
|
||||
"resolved": "https://registry.npmjs.org/postcss-simple-vars/-/postcss-simple-vars-5.0.2.tgz",
|
||||
"integrity": "sha512-xWIufxBoINJv6JiLb7jl5oElgp+6puJwvT5zZHliUSydoLz4DADRB3NDDsYgfKVwojn4TDLiseoC65MuS8oGGg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"postcss": "^7.0.14"
|
||||
}
|
||||
},
|
||||
"postcss-value-parser": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.0.0.tgz",
|
||||
"integrity": "sha512-ESPktioptiSUchCKgggAkzdmkgzKfmp0EU8jXH+5kbIUB+unr0Y4CY9SRMvibuvYUBjNh1ACLbxqYNpdTQOteQ==",
|
||||
"dev": true
|
||||
},
|
||||
"postcss-values-parser": {
|
||||
"version": "3.0.5",
|
||||
"resolved": "https://registry.npmjs.org/postcss-values-parser/-/postcss-values-parser-3.0.5.tgz",
|
||||
"integrity": "sha512-0N6EUBx2Vzl0c9LQipuus90EkVh7saBQFRhgAYpHHcDCIvxRt+K/q0zwcIYtDQVNs5Y9NGqei4AuCEvAOsePfQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-name": "^1.1.4",
|
||||
"is-number": "^7.0.0",
|
||||
"is-url-superb": "^3.0.0",
|
||||
"postcss": "^7.0.5",
|
||||
"url-regex": "^5.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"color-name": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
|
||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
||||
"dev": true
|
||||
},
|
||||
"is-number": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"pretty-hrtime": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
|
||||
@ -2351,15 +2368,6 @@
|
||||
"integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
|
||||
"dev": true
|
||||
},
|
||||
"resolve": {
|
||||
"version": "1.11.1",
|
||||
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.11.1.tgz",
|
||||
"integrity": "sha512-vIpgF6wfuJOZI7KKKSP+HmiKggadPQAdsp5HiC1mvqnfp0gF1vdwgBWZIdrVft9pgqoMFQN+R7BSWZiBxx+BBw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"path-parse": "^1.0.6"
|
||||
}
|
||||
},
|
||||
"resolve-from": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
|
||||
@ -2672,6 +2680,12 @@
|
||||
"has-flag": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"tlds": {
|
||||
"version": "1.207.0",
|
||||
"resolved": "https://registry.npmjs.org/tlds/-/tlds-1.207.0.tgz",
|
||||
"integrity": "sha512-k7d7Q1LqjtAvhtEOs3yN14EabsNO8ZCoY6RESSJDB9lst3bTx3as/m1UuAeCKzYxiyhR1qq72ZPhpSf+qlqiwg==",
|
||||
"dev": true
|
||||
},
|
||||
"to-object-path": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
|
||||
@ -2784,6 +2798,16 @@
|
||||
"integrity": "sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI=",
|
||||
"dev": true
|
||||
},
|
||||
"url-regex": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/url-regex/-/url-regex-5.0.0.tgz",
|
||||
"integrity": "sha512-O08GjTiAFNsSlrUWfqF1jH0H1W3m35ZyadHrGv5krdnmPPoxP27oDTqux/579PtaroiSGm5yma6KT1mHFH6Y/g==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ip-regex": "^4.1.0",
|
||||
"tlds": "^1.203.0"
|
||||
}
|
||||
},
|
||||
"use": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
|
||||
|
||||
@ -18,8 +18,7 @@
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^9.6.1",
|
||||
"postcss-cli": "^6.1.3",
|
||||
"postcss-import": "^12.0.1",
|
||||
"postcss-simple-vars": "^5.0.2"
|
||||
"postcss-custom-properties": "^9.0.2"
|
||||
},
|
||||
"dependencies": {}
|
||||
}
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
module.exports = {
|
||||
plugins: [
|
||||
require('postcss-import'),
|
||||
require('postcss-simple-vars'),
|
||||
require('postcss-custom-properties'),
|
||||
require('autoprefixer'),
|
||||
]
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user