diff --git a/package.json b/package.json index be53372..b3d125d 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "style-loader": "^0.20.1", "svg-react-loader": "^0.4.5", "uglifyjs-webpack-plugin": "^1.1.8", + "url-loader": "^0.6.2", "webpack": "^3.10.0", "webpack-dev-server": "^2.11.1", "webpack-merge": "^4.1.1", diff --git a/src/pages/404.js b/src/pages/404.js index 3fa24fd..c6c0d07 100644 --- a/src/pages/404.js +++ b/src/pages/404.js @@ -4,7 +4,7 @@ import ReactDOM from 'react-dom'; import '../style.css'; import Message from '../components/Message'; -import ErrorIcon from 'feather-icons/dist/icons/alert-octagon.svg'; +import ErrorIcon from '!svg-react-loader!feather-icons/dist/icons/alert-octagon.svg'; ReactDOM.render( diff --git a/src/style.css b/src/style.css index f37a115..f9ee797 100644 --- a/src/style.css +++ b/src/style.css @@ -25,7 +25,7 @@ body { font-size: 1.6rem; } -:global(#main) { +#main { background: var(--color-green) linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%); box-shadow: 0 0 1rem var(--color-black); padding: 0 var(--content-margin); @@ -33,7 +33,7 @@ body { position: relative; } -:global(#main) h1 { +#main h1 { font-family: 'Bangers', 'cursive'; font-size: 4rem; font-weight: normal; @@ -42,20 +42,20 @@ body { line-height: var(--header-height); } -:global(#main) a { +#main a { text-decoration: none; display: inline-block; } -:global(#main) ul { +#main ul { line-height: var(--header-height); position: absolute; top: 0; right: var(--content-margin); } -:global(#main) li a:hover, -:global(#main) li a:active { +#main li a:hover, +#main li a:active { text-decoration: underline; } @@ -84,15 +84,28 @@ li { display: inline-block; } -:global(.inline-list) li { +.inline-list li { white-space: nowrap; } -:global(.inline-list) li:after { +.inline-list li:after { content: '//'; padding: 0 0.5rem; } -:global(.inline-list) li:last-child:after { +.inline-list li:last-child:after { content: ''; } + +[icon] { + display: inline-block; + width: 1em; + height: 1em; + background-size: 1em 1em; + margin-right: 0.5rem; + vertical-align: text-top; +} + +[icon="github"] { + background-image: url('~feather-icons/dist/icons/github.svg'); +} diff --git a/src/template.html b/src/template.html index d4d8f98..dfb3a80 100644 --- a/src/template.html +++ b/src/template.html @@ -17,7 +17,7 @@ diff --git a/webpack.common.js b/webpack.common.js index 2f2208e..4c46dd8 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -79,31 +79,58 @@ module.exports = { loader: 'babel-loader' }, { - test: /\.css$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: [ - { - loader: 'css-loader', - options: { - importLoaders: 1, - minimize: true, - sourceMap: true, - modules: true - } - }, - { - loader: 'postcss-loader', - options: { - ident: 'postcss' - } - } - ] - }) + oneOf: [ + { + test: /\.css$/, + exclude: /components/, + use: ExtractTextPlugin.extract({ + fallback: 'style-loader', + use: [ + { + loader: 'css-loader', + options: { + importLoaders: 1, + minimize: true, + sourceMap: true, + } + }, + { + loader: 'postcss-loader', + options: { + ident: 'postcss' + } + } + ] + }) + }, + { + test: /\.css$/, + use: ExtractTextPlugin.extract({ + fallback: 'style-loader', + use: [ + { + loader: 'css-loader', + options: { + importLoaders: 1, + minimize: true, + sourceMap: true, + modules: true + } + }, + { + loader: 'postcss-loader', + options: { + ident: 'postcss' + } + } + ] + }) + }, + ] }, { test: /\.svg$/, - loader: 'svg-react-loader' + loader: 'url-loader' } ] } diff --git a/yarn.lock b/yarn.lock index fe5edb0..1eae8f8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6547,6 +6547,14 @@ url-join@^2.0.2: version "2.0.5" resolved "http://nexus.home.bromidic.net:8081/repository/npm-all/url-join/-/url-join-2.0.5.tgz#5af22f18c052a000a48d7b82c5e9c2e2feeda728" +url-loader@^0.6.2: + version "0.6.2" + resolved "http://nexus.home.bromidic.net:8081/repository/npm-all/url-loader/-/url-loader-0.6.2.tgz#a007a7109620e9d988d14bce677a1decb9a993f7" + dependencies: + loader-utils "^1.0.2" + mime "^1.4.1" + schema-utils "^0.3.0" + url-parse@1.0.x: version "1.0.5" resolved "http://nexus.home.bromidic.net:8081/repository/npm-all/url-parse/-/url-parse-1.0.5.tgz#0854860422afdcfefeb6c965c662d4800169927b"