Initial commit
This commit is contained in:
commit
8edd9f7ac0
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
node_modules
|
||||||
186
README.md
Normal file
186
README.md
Normal file
@ -0,0 +1,186 @@
|
|||||||
|
# Default Stylesheet
|
||||||
|
|
||||||
|
Return styles to browser defaults.
|
||||||
|
|
||||||
|
## Warning: Work in Progress!
|
||||||
|
|
||||||
|
This technique is still a work in progress. Styles for all elements are not yet
|
||||||
|
completely isolated. Using the Firefox's browser default stylesheet means that
|
||||||
|
it doesn't quite work as expected in other browsers.
|
||||||
|
|
||||||
|
To see the current progress for yourself:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone https://github.com/thallada/default-stylesheet
|
||||||
|
cd default-stylesheet
|
||||||
|
npm install
|
||||||
|
npm run build
|
||||||
|
python -m SimpleHTTPServer 8888
|
||||||
|
```
|
||||||
|
|
||||||
|
Then visit `http://localhost:8888/example/index.html` in your browser.
|
||||||
|
|
||||||
|
That said, I've had success using only Bootstrap components on top of this reset
|
||||||
|
in another project.
|
||||||
|
|
||||||
|
## Why this is needed
|
||||||
|
|
||||||
|
If you have applied an [`all:
|
||||||
|
initial`](https://developer.mozilla.org/en-US/docs/Web/CSS/all) reset, the
|
||||||
|
affected elements will have absolutely no styling because they have been reset
|
||||||
|
to the element's initial values as defined in the CSS spec (e.g. all elements
|
||||||
|
will be inline). `all: initial` effectively undoes all styling on an element
|
||||||
|
including the browser default styling.
|
||||||
|
|
||||||
|
Applying this stylesheet after applying an `all: initial` style will return
|
||||||
|
elements to some sane browser default. It "redoes" the browser default
|
||||||
|
stylesheet after undoing it.
|
||||||
|
|
||||||
|
## Will this work in non-Firefox browsers?
|
||||||
|
|
||||||
|
Theoretically yes, you will just end up with a styling that looks a lot like
|
||||||
|
Firefox. This stylesheet is based upon the [default Firefox
|
||||||
|
stylesheets](https://dxr.mozilla.org/mozilla-central/source/layout/style/res),
|
||||||
|
but with modifications to remove `-moz-` prefixes, `%if` blocks, and
|
||||||
|
Firefox-specific properties.
|
||||||
|
|
||||||
|
You can use CSS resets, such as
|
||||||
|
[normalize.css](https://necolas.github.io/normalize.css/), to normalize the
|
||||||
|
Firefox styling to a cross-browser default standard.
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
|
||||||
|
You have two options:
|
||||||
|
|
||||||
|
### Import source and process with Webpack (recommended)
|
||||||
|
|
||||||
|
Using [Webpack](https://webpack.js.org/) with [PostCSS](http://postcss.org/)
|
||||||
|
will give you the most control over how this stylesheet is applied.
|
||||||
|
Additionally, since `all: initial` is only supported by Firefox at the time of
|
||||||
|
writing, the [`postcss-initial`
|
||||||
|
plugin](https://github.com/maximkoretskiy/postcss-initial) is necessary to
|
||||||
|
polyfill it for other browsers.
|
||||||
|
|
||||||
|
If you are using `all: initial` to isolate a specific element on the page from
|
||||||
|
the surrounding CSS cascade, you will likely want to scope it and this
|
||||||
|
stylesheet to that specific element. This can either be done by nesting
|
||||||
|
[Sass](https://sass-lang.com/) selectors or by using the
|
||||||
|
[`postcss-prepend-selector`
|
||||||
|
plugin](https://www.npmjs.com/package/postcss-prepend-selector).
|
||||||
|
|
||||||
|
The advantage of using `postcss-prepend-selector` is that you won't have to wrap
|
||||||
|
every style in a selector to your embedded element. It will automatically
|
||||||
|
prepend every selector in your project with the selector at Webpack build-time.
|
||||||
|
|
||||||
|
Here is an example of a Sass file that fully resets an embedded element:
|
||||||
|
|
||||||
|
```scss
|
||||||
|
/* Note: Because postcss-prepend-selector is used in this project, all selectors defined in any CSS/SCSS file will have
|
||||||
|
* "#embedded.embedded " prepended to them so that all styles here will be scoped to *only* the root div. */
|
||||||
|
|
||||||
|
/* reset all element properties to initial values as defined in CSS spec (*not* browser defaults) */
|
||||||
|
* {
|
||||||
|
all: initial;
|
||||||
|
/* allow all elements to inherit these properties from the root "body" div */
|
||||||
|
font-family: inherit;
|
||||||
|
font-size: inherit;
|
||||||
|
font-weight: inherit;
|
||||||
|
line-height: inherit;
|
||||||
|
color: inherit;
|
||||||
|
text-align: left;
|
||||||
|
background-color: inherit;
|
||||||
|
cursor: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* apply Firefox's default stylesheet so that Bootstrap has some browser-like styling to work with */
|
||||||
|
@import '~default-stylesheet/default.css';
|
||||||
|
|
||||||
|
/* apply the Bootstrap reboot (normalize.css) to convert Firefox default styling to some cross-browser baseline
|
||||||
|
* then, apply the Bootstrap component styling */
|
||||||
|
@import '~bootstrap/scss/bootstrap';
|
||||||
|
|
||||||
|
/* Since elements inside the embedded div can no longer inherit styles set on the <body>, we will apply the styles
|
||||||
|
* that the Bootstrap reboot applies to the <body> on the wrapper div instead, which containing elements can inherit.
|
||||||
|
*
|
||||||
|
* <div id="embedded" class="embedded">
|
||||||
|
* <div class="embedded-wrapper">
|
||||||
|
* <!-- ... embedded component here ... -->
|
||||||
|
* </div>
|
||||||
|
* </div>
|
||||||
|
*/
|
||||||
|
.embedded-wrapper {
|
||||||
|
font-family: $font-family-base;
|
||||||
|
font-size: $font-size-base;
|
||||||
|
font-weight: $font-weight-base;
|
||||||
|
line-height: $line-height-base;
|
||||||
|
color: $body-color;
|
||||||
|
text-align: left;
|
||||||
|
background-color: rgb(255, 255, 255);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
And an example Webpack 3 SCSS/CSS rule to process it:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
{
|
||||||
|
test: /(.scss|.css)$/,
|
||||||
|
use: [
|
||||||
|
'style-loader',
|
||||||
|
{
|
||||||
|
loader: 'css-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
importLoaders: 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loader: 'postcss-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
ident: 'postcss',
|
||||||
|
plugins: () => [
|
||||||
|
/* eslint-disable global-require */
|
||||||
|
require('autoprefixer'),
|
||||||
|
require('postcss-initial')(),
|
||||||
|
require('postcss-prepend-selector')({ selector: '#embedded.embedded ' }),
|
||||||
|
/* eslint-enable global-require */
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loader: 'sass-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
includePaths: [
|
||||||
|
path.join(__dirname, '../node_modules'),
|
||||||
|
path.join(__dirname, '../src'),
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
```
|
||||||
|
|
||||||
|
### Include pre-built CSS
|
||||||
|
|
||||||
|
This project includes built CSS files in-case you are not using Webpack or
|
||||||
|
PostCSS. However, all of the styles are scoped to the hard-coded selector
|
||||||
|
"#embedded.embedded". Make sure there is an element on the page that has the id
|
||||||
|
"embedded" and a class name of "embedded". The styles will be applied to that
|
||||||
|
div.
|
||||||
|
|
||||||
|
```html
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<!--- ... other stylesheets ... -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="default.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<!-- ... other elements not affected ... -->
|
||||||
|
<div id="embedded" class="embedded">
|
||||||
|
<!--- ... embedded component here will be reset to default ... -->
|
||||||
|
</div>
|
||||||
|
<!-- ... other elements not affected ... -->
|
||||||
|
</body>
|
||||||
|
</html
|
||||||
|
```
|
||||||
935
chrome-default.css
Normal file
935
chrome-default.css
Normal file
@ -0,0 +1,935 @@
|
|||||||
|
/*
|
||||||
|
* The default style sheet used to render HTML.
|
||||||
|
*
|
||||||
|
* Copyright (C) 2000 Lars Knoll (knoll@kde.org)
|
||||||
|
* Copyright (C) 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011 Apple Inc. All rights reserved.
|
||||||
|
*
|
||||||
|
* This library is free software; you can redistribute it and/or
|
||||||
|
* modify it under the terms of the GNU Library General Public
|
||||||
|
* License as published by the Free Software Foundation; either
|
||||||
|
* version 2 of the License, or (at your option) any later version.
|
||||||
|
*
|
||||||
|
* This library is distributed in the hope that it will be useful,
|
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
|
||||||
|
* Library General Public License for more details.
|
||||||
|
*
|
||||||
|
* You should have received a copy of the GNU Library General Public License
|
||||||
|
* along with this library; see the file COPYING.LIB. If not, write to
|
||||||
|
* the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
|
||||||
|
* Boston, MA 02110-1301, USA.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
@namespace "http://www.w3.org/1999/xhtml";
|
||||||
|
html {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
/* children of the <head> element all have display:none */
|
||||||
|
head {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
meta {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
title {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
link {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
style {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
script {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
/* generic block-level elements */
|
||||||
|
body {
|
||||||
|
display: block;
|
||||||
|
margin: 8px
|
||||||
|
}
|
||||||
|
body:-webkit-full-page-media {
|
||||||
|
background-color: rgb(0, 0, 0)
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
display: block;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
}
|
||||||
|
div {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
layer {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
article, aside, footer, header, hgroup, main, nav, section {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
marquee {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
address {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
blockquote {
|
||||||
|
display: block;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 40px;
|
||||||
|
margin-end: 40px;
|
||||||
|
}
|
||||||
|
figcaption {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
figure {
|
||||||
|
display: block;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 40px;
|
||||||
|
margin-end: 40px;
|
||||||
|
}
|
||||||
|
q {
|
||||||
|
display: inline
|
||||||
|
}
|
||||||
|
q:before {
|
||||||
|
content: open-quote;
|
||||||
|
}
|
||||||
|
q:after {
|
||||||
|
content: close-quote;
|
||||||
|
}
|
||||||
|
center {
|
||||||
|
display: block;
|
||||||
|
/* special centering to be able to emulate the html4/netscape behaviour */
|
||||||
|
text-align: center
|
||||||
|
}
|
||||||
|
hr {
|
||||||
|
display: block;
|
||||||
|
margin-before: 0.5em;
|
||||||
|
margin-after: 0.5em;
|
||||||
|
margin-start: auto;
|
||||||
|
margin-end: auto;
|
||||||
|
border-style: inset;
|
||||||
|
border-width: 1px
|
||||||
|
}
|
||||||
|
map {
|
||||||
|
display: inline
|
||||||
|
}
|
||||||
|
video {
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
/* heading elements */
|
||||||
|
h1 {
|
||||||
|
display: block;
|
||||||
|
font-size: 2em;
|
||||||
|
margin-before: 0.67em;
|
||||||
|
margin-after: 0.67em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
:any(article,aside,nav,section) h1 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
margin-before: 0.83em;
|
||||||
|
margin-after: 0.83em;
|
||||||
|
}
|
||||||
|
:any(article,aside,nav,section) :any(article,aside,nav,section) h1 {
|
||||||
|
font-size: 1.17em;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
}
|
||||||
|
:any(article,aside,nav,section) :any(article,aside,nav,section) :any(article,aside,nav,section) h1 {
|
||||||
|
font-size: 1.00em;
|
||||||
|
margin-before: 1.33em;
|
||||||
|
margin-after: 1.33em;
|
||||||
|
}
|
||||||
|
:any(article,aside,nav,section) :any(article,aside,nav,section) :any(article,aside,nav,section) :any(article,aside,nav,section) h1 {
|
||||||
|
font-size: .83em;
|
||||||
|
margin-before: 1.67em;
|
||||||
|
margin-after: 1.67em;
|
||||||
|
}
|
||||||
|
:any(article,aside,nav,section) :any(article,aside,nav,section) :any(article,aside,nav,section) :any(article,aside,nav,section) :any(article,aside,nav,section) h1 {
|
||||||
|
font-size: .67em;
|
||||||
|
margin-before: 2.33em;
|
||||||
|
margin-after: 2.33em;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
display: block;
|
||||||
|
font-size: 1.5em;
|
||||||
|
margin-before: 0.83em;
|
||||||
|
margin-after: 0.83em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
display: block;
|
||||||
|
font-size: 1.17em;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
h4 {
|
||||||
|
display: block;
|
||||||
|
margin-before: 1.33em;
|
||||||
|
margin-after: 1.33em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
h5 {
|
||||||
|
display: block;
|
||||||
|
font-size: .83em;
|
||||||
|
margin-before: 1.67em;
|
||||||
|
margin-after: 1.67em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
h6 {
|
||||||
|
display: block;
|
||||||
|
font-size: .67em;
|
||||||
|
margin-before: 2.33em;
|
||||||
|
margin-after: 2.33em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
/* tables */
|
||||||
|
table {
|
||||||
|
display: table;
|
||||||
|
border-collapse: separate;
|
||||||
|
border-spacing: 2px;
|
||||||
|
border-color: gray
|
||||||
|
}
|
||||||
|
thead {
|
||||||
|
display: table-header-group;
|
||||||
|
vertical-align: middle;
|
||||||
|
border-color: inherit
|
||||||
|
}
|
||||||
|
tbody {
|
||||||
|
display: table-row-group;
|
||||||
|
vertical-align: middle;
|
||||||
|
border-color: inherit
|
||||||
|
}
|
||||||
|
tfoot {
|
||||||
|
display: table-footer-group;
|
||||||
|
vertical-align: middle;
|
||||||
|
border-color: inherit
|
||||||
|
}
|
||||||
|
/* for tables without table section elements (can happen with XHTML or dynamically created tables) */
|
||||||
|
table > tr {
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
col {
|
||||||
|
display: table-column
|
||||||
|
}
|
||||||
|
colgroup {
|
||||||
|
display: table-column-group
|
||||||
|
}
|
||||||
|
tr {
|
||||||
|
display: table-row;
|
||||||
|
vertical-align: inherit;
|
||||||
|
border-color: inherit
|
||||||
|
}
|
||||||
|
td, th {
|
||||||
|
display: table-cell;
|
||||||
|
vertical-align: inherit
|
||||||
|
}
|
||||||
|
th {
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
caption {
|
||||||
|
display: table-caption;
|
||||||
|
text-align: center
|
||||||
|
}
|
||||||
|
/* lists */
|
||||||
|
ul, menu, dir {
|
||||||
|
display: block;
|
||||||
|
list-style-type: disc;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
padding-start: 40px
|
||||||
|
}
|
||||||
|
ol {
|
||||||
|
display: block;
|
||||||
|
list-style-type: decimal;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
padding-start: 40px
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
display: list-item;
|
||||||
|
text-align: match-parent;
|
||||||
|
}
|
||||||
|
ul ul, ol ul {
|
||||||
|
list-style-type: circle
|
||||||
|
}
|
||||||
|
ol ol ul, ol ul ul, ul ol ul, ul ul ul {
|
||||||
|
list-style-type: square
|
||||||
|
}
|
||||||
|
dd {
|
||||||
|
display: block;
|
||||||
|
margin-start: 40px
|
||||||
|
}
|
||||||
|
dl {
|
||||||
|
display: block;
|
||||||
|
margin-before: 1em;
|
||||||
|
margin-after: 1em;
|
||||||
|
margin-start: 0;
|
||||||
|
margin-end: 0;
|
||||||
|
}
|
||||||
|
dt {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
ol ul, ul ol, ul ul, ol ol {
|
||||||
|
margin-before: 0;
|
||||||
|
margin-after: 0
|
||||||
|
}
|
||||||
|
/* form elements */
|
||||||
|
form {
|
||||||
|
display: block;
|
||||||
|
margin-top: 0em;
|
||||||
|
}
|
||||||
|
label {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
legend {
|
||||||
|
display: block;
|
||||||
|
padding-start: 2px;
|
||||||
|
padding-end: 2px;
|
||||||
|
border: none
|
||||||
|
}
|
||||||
|
fieldset {
|
||||||
|
display: block;
|
||||||
|
margin-start: 2px;
|
||||||
|
margin-end: 2px;
|
||||||
|
padding-before: 0.35em;
|
||||||
|
padding-start: 0.75em;
|
||||||
|
padding-end: 0.75em;
|
||||||
|
padding-after: 0.625em;
|
||||||
|
border: 2px groove ThreeDFace;
|
||||||
|
min-width: min-content;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
appearance: button;
|
||||||
|
}
|
||||||
|
/* Form controls don't go vertical. */
|
||||||
|
input, textarea, keygen, select, button, meter, progress {
|
||||||
|
webkit-writing-mode: horizontal-tb !important;
|
||||||
|
}
|
||||||
|
input, textarea, keygen, select, button {
|
||||||
|
margin: 0em;
|
||||||
|
font: small-control;
|
||||||
|
text-rendering: auto; /* FIXME: Remove when tabs work with optimizeLegibility. */
|
||||||
|
color: initial;
|
||||||
|
letter-spacing: normal;
|
||||||
|
word-spacing: normal;
|
||||||
|
line-height: normal;
|
||||||
|
text-transform: none;
|
||||||
|
text-indent: 0;
|
||||||
|
text-shadow: none;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: start;
|
||||||
|
}
|
||||||
|
input[type="hidden"] {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
input {
|
||||||
|
appearance: textfield;
|
||||||
|
padding: 1px;
|
||||||
|
background-color: white;
|
||||||
|
border: 2px inset;
|
||||||
|
rtl-ordering: logical;
|
||||||
|
user-select: text;
|
||||||
|
cursor: auto;
|
||||||
|
}
|
||||||
|
input[type="search"] {
|
||||||
|
appearance: searchfield;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
input::-webkit-textfield-decoration-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
content: none !important;
|
||||||
|
}
|
||||||
|
input[type="search"]::-webkit-textfield-decoration-container {
|
||||||
|
direction: ltr;
|
||||||
|
}
|
||||||
|
input::-webkit-clear-button {
|
||||||
|
-webkit-appearance: searchfield-cancel-button;
|
||||||
|
display: inline-block;
|
||||||
|
flex: none;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
-webkit-margin-start: 2px;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
input:enabled:read-write:any(:focus,:hover)::-webkit-clear-button {
|
||||||
|
opacity: 1;
|
||||||
|
pointer-events: auto;
|
||||||
|
}
|
||||||
|
input[type="search"]::-webkit-search-cancel-button {
|
||||||
|
-webkit-appearance: searchfield-cancel-button;
|
||||||
|
display: block;
|
||||||
|
flex: none;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
-webkit-margin-start: 1px;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
input[type="search"]:enabled:read-write:any(:focus,:hover)::-webkit-search-cancel-button {
|
||||||
|
opacity: 1;
|
||||||
|
pointer-events: auto;
|
||||||
|
}
|
||||||
|
input[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: searchfield-decoration;
|
||||||
|
display: block;
|
||||||
|
flex: none;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
-webkit-align-self: flex-start;
|
||||||
|
margin: auto 0;
|
||||||
|
}
|
||||||
|
input[type="search"]::-webkit-search-results-decoration {
|
||||||
|
-webkit-appearance: searchfield-results-decoration;
|
||||||
|
display: block;
|
||||||
|
flex: none;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
-webkit-align-self: flex-start;
|
||||||
|
margin: auto 0;
|
||||||
|
}
|
||||||
|
input::-webkit-inner-spin-button {
|
||||||
|
-webkit-appearance: inner-spin-button;
|
||||||
|
display: inline-block;
|
||||||
|
cursor: default;
|
||||||
|
flex: none;
|
||||||
|
align-self: stretch;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
input:enabled:read-write:any(:focus,:hover)::-webkit-inner-spin-button {
|
||||||
|
opacity: 1;
|
||||||
|
pointer-events: auto;
|
||||||
|
}
|
||||||
|
keygen, select {
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
keygen::-webkit-keygen-select {
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
textarea {
|
||||||
|
-webkit-appearance: textarea;
|
||||||
|
background-color: white;
|
||||||
|
border: 1px solid;
|
||||||
|
-webkit-rtl-ordering: logical;
|
||||||
|
-webkit-user-select: text;
|
||||||
|
flex-direction: column;
|
||||||
|
resize: auto;
|
||||||
|
cursor: auto;
|
||||||
|
padding: 2px;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
::-webkit-input-placeholder {
|
||||||
|
-webkit-text-security: none;
|
||||||
|
color: darkGray;
|
||||||
|
pointer-events: none !important;
|
||||||
|
}
|
||||||
|
input::-webkit-input-placeholder {
|
||||||
|
white-space: pre;
|
||||||
|
word-wrap: normal;
|
||||||
|
overflow: hidden;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
}
|
||||||
|
input[type="password"] {
|
||||||
|
-webkit-text-security: disc !important;
|
||||||
|
}
|
||||||
|
input[type="hidden"], input[type="image"], input[type="file"] {
|
||||||
|
appearance: initial;
|
||||||
|
padding: initial;
|
||||||
|
background-color: initial;
|
||||||
|
border: initial;
|
||||||
|
}
|
||||||
|
input[type="file"] {
|
||||||
|
align-items: baseline;
|
||||||
|
color: inherit;
|
||||||
|
text-align: start !important;
|
||||||
|
}
|
||||||
|
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
|
||||||
|
background-color: #FAFFBD !important;
|
||||||
|
background-image:none !important;
|
||||||
|
color: #000000 !important;
|
||||||
|
}
|
||||||
|
input[type="radio"], input[type="checkbox"] {
|
||||||
|
margin: 3px 0.5ex;
|
||||||
|
padding: initial;
|
||||||
|
background-color: initial;
|
||||||
|
border: initial;
|
||||||
|
}
|
||||||
|
input[type="button"], input[type="submit"], input[type="reset"] {
|
||||||
|
appearance: push-button;
|
||||||
|
user-select: none;
|
||||||
|
white-space: pre
|
||||||
|
}
|
||||||
|
input[type="file"]::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: push-button;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
white-space: nowrap;
|
||||||
|
margin: 0;
|
||||||
|
font-size: inherit;
|
||||||
|
}
|
||||||
|
input[type="button"], input[type="submit"], input[type="reset"], input[type="file"]::-webkit-file-upload-button, button {
|
||||||
|
align-items: flex-start;
|
||||||
|
text-align: center;
|
||||||
|
cursor: default;
|
||||||
|
color: ButtonText;
|
||||||
|
padding: 2px 6px 3px 6px;
|
||||||
|
border: 2px outset ButtonFace;
|
||||||
|
background-color: ButtonFace;
|
||||||
|
box-sizing: border-box
|
||||||
|
}
|
||||||
|
input[type="range"] {
|
||||||
|
appearance: slider-horizontal;
|
||||||
|
padding: initial;
|
||||||
|
border: initial;
|
||||||
|
margin: 2px;
|
||||||
|
color: #909090;
|
||||||
|
}
|
||||||
|
input[type="range"]::-webkit-slider-container, input[type="range"]::-webkit-media-slider-container {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
input[type="range"]::-webkit-slider-runnable-track {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
-webkit-align-self: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
input[type="range"]::-webkit-slider-thumb, input[type="range"]::-webkit-media-slider-thumb {
|
||||||
|
-webkit-appearance: sliderthumb-horizontal;
|
||||||
|
box-sizing: border-box;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
input[type="button"]:disabled, input[type="submit"]:disabled, input[type="reset"]:disabled,
|
||||||
|
input[type="file"]:disabled::-webkit-file-upload-button, button:disabled,
|
||||||
|
select:disabled, keygen:disabled, optgroup:disabled, option:disabled,
|
||||||
|
select[disabled]>option {
|
||||||
|
color: GrayText
|
||||||
|
}
|
||||||
|
input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active, input[type="file"]:active::-webkit-file-upload-button, button:active {
|
||||||
|
border-style: inset
|
||||||
|
}
|
||||||
|
input[type="button"]:active:disabled, input[type="submit"]:active:disabled, input[type="reset"]:active:disabled, input[type="file"]:active:disabled::-webkit-file-upload-button, button:active:disabled {
|
||||||
|
border-style: outset
|
||||||
|
}
|
||||||
|
option:-internal-spatial-navigation-focus {
|
||||||
|
outline: black dashed 1px;
|
||||||
|
outline-offset: -1px;
|
||||||
|
}
|
||||||
|
datalist {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
area {
|
||||||
|
display: inline;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
param {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
input[type="checkbox"] {
|
||||||
|
appearance: checkbox;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
input[type="radio"] {
|
||||||
|
appearance: radio;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
input[type="color"] {
|
||||||
|
appearance: square-button;
|
||||||
|
width: 44px;
|
||||||
|
height: 23px;
|
||||||
|
background-color: ButtonFace;
|
||||||
|
/* Same as native_theme_base. */
|
||||||
|
border: 1px #a9a9a9 solid;
|
||||||
|
padding: 1px 2px;
|
||||||
|
}
|
||||||
|
input[type="color"]::-webkit-color-swatch-wrapper {
|
||||||
|
display:flex;
|
||||||
|
padding: 4px 2px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%
|
||||||
|
}
|
||||||
|
input[type="color"]::-webkit-color-swatch {
|
||||||
|
background-color: #000000;
|
||||||
|
border: 1px solid #777777;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
}
|
||||||
|
input[type="color"][list] {
|
||||||
|
appearance: menulist;
|
||||||
|
width: 88px;
|
||||||
|
height: 23px
|
||||||
|
}
|
||||||
|
input[type="color"][list]::-webkit-color-swatch-wrapper {
|
||||||
|
padding-left: 8px;
|
||||||
|
padding-right: 24px;
|
||||||
|
}
|
||||||
|
input[type="color"][list]::-webkit-color-swatch {
|
||||||
|
border-color: #000000;
|
||||||
|
}
|
||||||
|
input::-webkit-calendar-picker-indicator {
|
||||||
|
display: inline-block;
|
||||||
|
width: 0.66em;
|
||||||
|
height: 0.66em;
|
||||||
|
padding: 0.17em 0.34em;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
input::-webkit-calendar-picker-indicator:hover {
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
input:enabled:read-write:any(:focus,:hover)::-webkit-calendar-picker-indicator,
|
||||||
|
input::-webkit-calendar-picker-indicator:focus {
|
||||||
|
opacity: 1;
|
||||||
|
pointer-events: auto;
|
||||||
|
}
|
||||||
|
input[type="date"]:disabled::-webkit-clear-button,
|
||||||
|
input[type="date"]:disabled::-webkit-inner-spin-button,
|
||||||
|
input[type="datetime-local"]:disabled::-webkit-clear-button,
|
||||||
|
input[type="datetime-local"]:disabled::-webkit-inner-spin-button,
|
||||||
|
input[type="month"]:disabled::-webkit-clear-button,
|
||||||
|
input[type="month"]:disabled::-webkit-inner-spin-button,
|
||||||
|
input[type="week"]:disabled::-webkit-clear-button,
|
||||||
|
input[type="week"]:disabled::-webkit-inner-spin-button,
|
||||||
|
input:disabled::-webkit-calendar-picker-indicator,
|
||||||
|
input[type="date"][readonly]::-webkit-clear-button,
|
||||||
|
input[type="date"][readonly]::-webkit-inner-spin-button,
|
||||||
|
input[type="datetime-local"][readonly]::-webkit-clear-button,
|
||||||
|
input[type="datetime-local"][readonly]::-webkit-inner-spin-button,
|
||||||
|
input[type="month"][readonly]::-webkit-clear-button,
|
||||||
|
input[type="month"][readonly]::-webkit-inner-spin-button,
|
||||||
|
input[type="week"][readonly]::-webkit-clear-button,
|
||||||
|
input[type="week"][readonly]::-webkit-inner-spin-button,
|
||||||
|
input[readonly]::-webkit-calendar-picker-indicator {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
select {
|
||||||
|
appearance: menulist;
|
||||||
|
box-sizing: border-box;
|
||||||
|
align-items: center;
|
||||||
|
border: 1px solid;
|
||||||
|
white-space: pre;
|
||||||
|
rtl-ordering: logical;
|
||||||
|
color: black;
|
||||||
|
background-color: white;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
select:not(:-internal-list-box) {
|
||||||
|
overflow: visible !important;
|
||||||
|
}
|
||||||
|
select:-internal-list-box {
|
||||||
|
appearance: listbox;
|
||||||
|
align-items: flex-start;
|
||||||
|
border: 1px inset gray;
|
||||||
|
border-radius: initial;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: scroll;
|
||||||
|
vertical-align: text-bottom;
|
||||||
|
user-select: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
optgroup {
|
||||||
|
font-weight: bolder;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
option {
|
||||||
|
font-weight: normal;
|
||||||
|
display: block;
|
||||||
|
padding: 0 2px 1px 2px;
|
||||||
|
white-space: pre;
|
||||||
|
min-height: 1.2em;
|
||||||
|
}
|
||||||
|
select:-internal-list-box optgroup option:before {
|
||||||
|
content: "\00a0\00a0\00a0\00a0";;
|
||||||
|
}
|
||||||
|
select:-internal-list-box option,
|
||||||
|
select:-internal-list-box optgroup {
|
||||||
|
line-height: initial !important;
|
||||||
|
}
|
||||||
|
select:-internal-list-box:focus option:checked {
|
||||||
|
background-color: -internal-active-list-box-selection !important;
|
||||||
|
color: -internal-active-list-box-selection-text !important;
|
||||||
|
}
|
||||||
|
select:-internal-list-box option:checked {
|
||||||
|
background-color: -internal-inactive-list-box-selection !important;
|
||||||
|
color: -internal-inactive-list-box-selection-text !important;
|
||||||
|
}
|
||||||
|
select:-internal-list-box:disabled option:checked,
|
||||||
|
select:-internal-list-box option:checked:disabled {
|
||||||
|
color: gray !important;
|
||||||
|
}
|
||||||
|
select:-internal-list-box hr {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
output {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
/* meter */
|
||||||
|
meter {
|
||||||
|
appearance: meter;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: inline-block;
|
||||||
|
height: 1em;
|
||||||
|
width: 5em;
|
||||||
|
vertical-align: -0.2em;
|
||||||
|
}
|
||||||
|
meter::-webkit-meter-inner-element {
|
||||||
|
-webkit-appearance: inherit;
|
||||||
|
box-sizing: inherit;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
meter::-webkit-meter-bar {
|
||||||
|
background: linear-gradient(to bottom, #ddd, #eee 20%, #ccc 45%, #ccc 55%, #ddd);
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
meter::-webkit-meter-optimum-value {
|
||||||
|
background: linear-gradient(to bottom, #ad7, #cea 20%, #7a3 45%, #7a3 55%, #ad7);
|
||||||
|
height: 100%;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
meter::-webkit-meter-suboptimum-value {
|
||||||
|
background: linear-gradient(to bottom, #fe7, #ffc 20%, #db3 45%, #db3 55%, #fe7);
|
||||||
|
height: 100%;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
meter::-webkit-meter-even-less-good-value {
|
||||||
|
background: linear-gradient(to bottom, #f77, #fcc 20%, #d44 45%, #d44 55%, #f77);
|
||||||
|
height: 100%;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
/* progress */
|
||||||
|
progress {
|
||||||
|
appearance: progress-bar;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: inline-block;
|
||||||
|
height: 1em;
|
||||||
|
width: 10em;
|
||||||
|
vertical-align: -0.2em;
|
||||||
|
}
|
||||||
|
progress::-webkit-progress-inner-element {
|
||||||
|
-webkit-appearance: inherit;
|
||||||
|
box-sizing: inherit;
|
||||||
|
-webkit-user-modify: read-only;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
progress::-webkit-progress-bar {
|
||||||
|
background-color: gray;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
progress::-webkit-progress-value {
|
||||||
|
background-color: green;
|
||||||
|
height: 100%;
|
||||||
|
width: 50%; /* should be removed later */
|
||||||
|
-webkit-user-modify: read-only !important;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
/* inline elements */
|
||||||
|
u, ins {
|
||||||
|
text-decoration: underline
|
||||||
|
}
|
||||||
|
strong, b {
|
||||||
|
font-weight: bold
|
||||||
|
}
|
||||||
|
i, cite, em, var, address, dfn {
|
||||||
|
font-style: italic
|
||||||
|
}
|
||||||
|
tt, code, kbd, samp {
|
||||||
|
font-family: monospace
|
||||||
|
}
|
||||||
|
pre, xmp, plaintext, listing {
|
||||||
|
display: block;
|
||||||
|
font-family: monospace;
|
||||||
|
white-space: pre;
|
||||||
|
margin: 1em 0
|
||||||
|
}
|
||||||
|
mark {
|
||||||
|
background-color: yellow;
|
||||||
|
color: black
|
||||||
|
}
|
||||||
|
big {
|
||||||
|
font-size: larger
|
||||||
|
}
|
||||||
|
small {
|
||||||
|
font-size: smaller
|
||||||
|
}
|
||||||
|
s, strike, del {
|
||||||
|
text-decoration: line-through
|
||||||
|
}
|
||||||
|
sub {
|
||||||
|
vertical-align: sub;
|
||||||
|
font-size: smaller
|
||||||
|
}
|
||||||
|
sup {
|
||||||
|
vertical-align: super;
|
||||||
|
font-size: smaller
|
||||||
|
}
|
||||||
|
nobr {
|
||||||
|
white-space: nowrap
|
||||||
|
}
|
||||||
|
/* states */
|
||||||
|
:focus {
|
||||||
|
outline: auto 5px Highlight
|
||||||
|
}
|
||||||
|
/* Read-only text fields do not show a focus ring but do still receive focus */
|
||||||
|
html:focus, body:focus, input[readonly]:focus {
|
||||||
|
outline: none
|
||||||
|
}
|
||||||
|
embed:focus, iframe:focus, object:focus {
|
||||||
|
outline: none
|
||||||
|
}
|
||||||
|
|
||||||
|
input:focus, textarea:focus, keygen:focus, select:focus {
|
||||||
|
outline-offset: -2px
|
||||||
|
}
|
||||||
|
input[type="button"]:focus,
|
||||||
|
input[type="checkbox"]:focus,
|
||||||
|
input[type="file"]:focus,
|
||||||
|
input[type="hidden"]:focus,
|
||||||
|
input[type="image"]:focus,
|
||||||
|
input[type="radio"]:focus,
|
||||||
|
input[type="reset"]:focus,
|
||||||
|
input[type="search"]:focus,
|
||||||
|
input[type="submit"]:focus,
|
||||||
|
input[type="file"]:focus::-webkit-file-upload-button {
|
||||||
|
outline-offset: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
a:any-link {
|
||||||
|
color: -webkit-link;
|
||||||
|
text-decoration: underline;
|
||||||
|
cursor: auto;
|
||||||
|
}
|
||||||
|
a:any-link:active {
|
||||||
|
color: -webkit-activelink
|
||||||
|
}
|
||||||
|
/* HTML5 ruby elements */
|
||||||
|
ruby, rt {
|
||||||
|
text-indent: 0; /* blocks used for ruby rendering should not trigger this */
|
||||||
|
}
|
||||||
|
rt {
|
||||||
|
line-height: normal;
|
||||||
|
text-emphasis: none;
|
||||||
|
}
|
||||||
|
ruby > rt {
|
||||||
|
display: block;
|
||||||
|
font-size: 50%;
|
||||||
|
text-align: start;
|
||||||
|
}
|
||||||
|
ruby > rp {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
/* other elements */
|
||||||
|
noframes {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
frameset, frame {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
frameset {
|
||||||
|
border-color: inherit
|
||||||
|
}
|
||||||
|
iframe {
|
||||||
|
border: 2px inset
|
||||||
|
}
|
||||||
|
details {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
summary {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
summary::-webkit-details-marker {
|
||||||
|
display: inline-block;
|
||||||
|
width: 0.66em;
|
||||||
|
height: 0.66em;
|
||||||
|
-webkit-margin-end: 0.4em;
|
||||||
|
}
|
||||||
|
template {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
bdi, output {
|
||||||
|
unicode-bidi: isolate;
|
||||||
|
}
|
||||||
|
bdo {
|
||||||
|
unicode-bidi: bidi-override;
|
||||||
|
}
|
||||||
|
textarea[dir=auto] {
|
||||||
|
unicode-bidi: plaintext;
|
||||||
|
}
|
||||||
|
dialog:not([open]) {
|
||||||
|
display: none
|
||||||
|
}
|
||||||
|
dialog {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
width: fit-content;
|
||||||
|
height: fit-content;
|
||||||
|
margin: auto;
|
||||||
|
border: solid;
|
||||||
|
padding: 1em;
|
||||||
|
background: white;
|
||||||
|
color: black
|
||||||
|
}
|
||||||
|
dialog::backdrop {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background: rgba(0,0,0,0.1)
|
||||||
|
}
|
||||||
|
/* page */
|
||||||
|
@page {
|
||||||
|
/* FIXME: Define the right default values for page properties. */
|
||||||
|
size: auto;
|
||||||
|
margin: auto;
|
||||||
|
padding: 0px;
|
||||||
|
border-width: 0px;
|
||||||
|
}
|
||||||
|
/* Disable multicol in printing, since it's not implemented properly. See crbug.com/99358 */
|
||||||
|
@media print {
|
||||||
|
* { columns: auto !important; }
|
||||||
|
}
|
||||||
|
/* noscript is handled internally, as it depends on settings. */
|
||||||
1
dist/default.min.css
vendored
Normal file
1
dist/default.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
74
dist/default.min.js
vendored
Normal file
74
dist/default.min.js
vendored
Normal file
@ -0,0 +1,74 @@
|
|||||||
|
/******/ (function(modules) { // webpackBootstrap
|
||||||
|
/******/ // The module cache
|
||||||
|
/******/ var installedModules = {};
|
||||||
|
/******/
|
||||||
|
/******/ // The require function
|
||||||
|
/******/ function __webpack_require__(moduleId) {
|
||||||
|
/******/
|
||||||
|
/******/ // Check if module is in cache
|
||||||
|
/******/ if(installedModules[moduleId]) {
|
||||||
|
/******/ return installedModules[moduleId].exports;
|
||||||
|
/******/ }
|
||||||
|
/******/ // Create a new module (and put it into the cache)
|
||||||
|
/******/ var module = installedModules[moduleId] = {
|
||||||
|
/******/ i: moduleId,
|
||||||
|
/******/ l: false,
|
||||||
|
/******/ exports: {}
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // Execute the module function
|
||||||
|
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
||||||
|
/******/
|
||||||
|
/******/ // Flag the module as loaded
|
||||||
|
/******/ module.l = true;
|
||||||
|
/******/
|
||||||
|
/******/ // Return the exports of the module
|
||||||
|
/******/ return module.exports;
|
||||||
|
/******/ }
|
||||||
|
/******/
|
||||||
|
/******/
|
||||||
|
/******/ // expose the modules object (__webpack_modules__)
|
||||||
|
/******/ __webpack_require__.m = modules;
|
||||||
|
/******/
|
||||||
|
/******/ // expose the module cache
|
||||||
|
/******/ __webpack_require__.c = installedModules;
|
||||||
|
/******/
|
||||||
|
/******/ // define getter function for harmony exports
|
||||||
|
/******/ __webpack_require__.d = function(exports, name, getter) {
|
||||||
|
/******/ if(!__webpack_require__.o(exports, name)) {
|
||||||
|
/******/ Object.defineProperty(exports, name, {
|
||||||
|
/******/ configurable: false,
|
||||||
|
/******/ enumerable: true,
|
||||||
|
/******/ get: getter
|
||||||
|
/******/ });
|
||||||
|
/******/ }
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
||||||
|
/******/ __webpack_require__.n = function(module) {
|
||||||
|
/******/ var getter = module && module.__esModule ?
|
||||||
|
/******/ function getDefault() { return module['default']; } :
|
||||||
|
/******/ function getModuleExports() { return module; };
|
||||||
|
/******/ __webpack_require__.d(getter, 'a', getter);
|
||||||
|
/******/ return getter;
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // Object.prototype.hasOwnProperty.call
|
||||||
|
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
||||||
|
/******/
|
||||||
|
/******/ // __webpack_public_path__
|
||||||
|
/******/ __webpack_require__.p = "";
|
||||||
|
/******/
|
||||||
|
/******/ // Load entry module and return exports
|
||||||
|
/******/ return __webpack_require__(__webpack_require__.s = 0);
|
||||||
|
/******/ })
|
||||||
|
/************************************************************************/
|
||||||
|
/******/ ([
|
||||||
|
/* 0 */
|
||||||
|
/***/ (function(module, exports) {
|
||||||
|
|
||||||
|
// removed by extract-text-webpack-plugin
|
||||||
|
|
||||||
|
/***/ })
|
||||||
|
/******/ ]);
|
||||||
|
//# sourceMappingURL=default.min.js.map
|
||||||
1
dist/default.min.js.map
vendored
Normal file
1
dist/default.min.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"sources":["webpack:///webpack/bootstrap e6c9d4c4d948628824e9","webpack:///./firefox.css"],"names":[],"mappings":";AAAA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA;;;;;;;AC7DA,yC","file":"default.min.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap e6c9d4c4d948628824e9","// removed by extract-text-webpack-plugin\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./firefox.css\n// module id = 0\n// module chunks = 0"],"sourceRoot":""}
|
||||||
1
dist/example.min.css
vendored
Normal file
1
dist/example.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
75
dist/example.min.js
vendored
Normal file
75
dist/example.min.js
vendored
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
/******/ (function(modules) { // webpackBootstrap
|
||||||
|
/******/ // The module cache
|
||||||
|
/******/ var installedModules = {};
|
||||||
|
/******/
|
||||||
|
/******/ // The require function
|
||||||
|
/******/ function __webpack_require__(moduleId) {
|
||||||
|
/******/
|
||||||
|
/******/ // Check if module is in cache
|
||||||
|
/******/ if(installedModules[moduleId]) {
|
||||||
|
/******/ return installedModules[moduleId].exports;
|
||||||
|
/******/ }
|
||||||
|
/******/ // Create a new module (and put it into the cache)
|
||||||
|
/******/ var module = installedModules[moduleId] = {
|
||||||
|
/******/ i: moduleId,
|
||||||
|
/******/ l: false,
|
||||||
|
/******/ exports: {}
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // Execute the module function
|
||||||
|
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
||||||
|
/******/
|
||||||
|
/******/ // Flag the module as loaded
|
||||||
|
/******/ module.l = true;
|
||||||
|
/******/
|
||||||
|
/******/ // Return the exports of the module
|
||||||
|
/******/ return module.exports;
|
||||||
|
/******/ }
|
||||||
|
/******/
|
||||||
|
/******/
|
||||||
|
/******/ // expose the modules object (__webpack_modules__)
|
||||||
|
/******/ __webpack_require__.m = modules;
|
||||||
|
/******/
|
||||||
|
/******/ // expose the module cache
|
||||||
|
/******/ __webpack_require__.c = installedModules;
|
||||||
|
/******/
|
||||||
|
/******/ // define getter function for harmony exports
|
||||||
|
/******/ __webpack_require__.d = function(exports, name, getter) {
|
||||||
|
/******/ if(!__webpack_require__.o(exports, name)) {
|
||||||
|
/******/ Object.defineProperty(exports, name, {
|
||||||
|
/******/ configurable: false,
|
||||||
|
/******/ enumerable: true,
|
||||||
|
/******/ get: getter
|
||||||
|
/******/ });
|
||||||
|
/******/ }
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
||||||
|
/******/ __webpack_require__.n = function(module) {
|
||||||
|
/******/ var getter = module && module.__esModule ?
|
||||||
|
/******/ function getDefault() { return module['default']; } :
|
||||||
|
/******/ function getModuleExports() { return module; };
|
||||||
|
/******/ __webpack_require__.d(getter, 'a', getter);
|
||||||
|
/******/ return getter;
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // Object.prototype.hasOwnProperty.call
|
||||||
|
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
||||||
|
/******/
|
||||||
|
/******/ // __webpack_public_path__
|
||||||
|
/******/ __webpack_require__.p = "";
|
||||||
|
/******/
|
||||||
|
/******/ // Load entry module and return exports
|
||||||
|
/******/ return __webpack_require__(__webpack_require__.s = 1);
|
||||||
|
/******/ })
|
||||||
|
/************************************************************************/
|
||||||
|
/******/ ([
|
||||||
|
/* 0 */,
|
||||||
|
/* 1 */
|
||||||
|
/***/ (function(module, exports) {
|
||||||
|
|
||||||
|
// removed by extract-text-webpack-plugin
|
||||||
|
|
||||||
|
/***/ })
|
||||||
|
/******/ ]);
|
||||||
|
//# sourceMappingURL=example.min.js.map
|
||||||
1
dist/example.min.js.map
vendored
Normal file
1
dist/example.min.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"sources":["webpack:///webpack/bootstrap e6c9d4c4d948628824e9","webpack:///./example/example.scss"],"names":[],"mappings":";AAAA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA;;;;;;;;AC7DA,yC","file":"example.min.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 1);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap e6c9d4c4d948628824e9","// removed by extract-text-webpack-plugin\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./example/example.scss\n// module id = 1\n// module chunks = 1"],"sourceRoot":""}
|
||||||
46
example/example.scss
Normal file
46
example/example.scss
Normal file
@ -0,0 +1,46 @@
|
|||||||
|
/* Note: Because postcss-prepend-selector is used in this project, all selectors defined in any CSS/SCSS file will have
|
||||||
|
* "#embedded.embedded " prepended to them so that all styles here will be scoped to *only* the root div. */
|
||||||
|
|
||||||
|
/* reset all element properties to initial values as defined in CSS spec (*not* browser defaults) */
|
||||||
|
* {
|
||||||
|
all: initial;
|
||||||
|
/* allow all elements to inherit these properties from the root "body" div */
|
||||||
|
font-family: inherit;
|
||||||
|
font-size: inherit;
|
||||||
|
font-weight: inherit;
|
||||||
|
line-height: inherit;
|
||||||
|
color: inherit;
|
||||||
|
text-align: left;
|
||||||
|
background-color: inherit;
|
||||||
|
cursor: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* apply Firefox's default stylesheet so that Bootstrap has some browser-like styling to work with */
|
||||||
|
// @import '../default.css';
|
||||||
|
@import '../firefox.css';
|
||||||
|
|
||||||
|
/* apply the Bootstrap reboot (normalize.css) to convert Firefox default styling to some cross-browser baseline
|
||||||
|
* then, apply the Bootstrap component styling */
|
||||||
|
// @import '~bootstrap/scss/bootstrap';
|
||||||
|
|
||||||
|
/* Since elements inside the embedded div can no longer inherit styles set on the <body>, we will apply the styles
|
||||||
|
* that the Bootstrap reboot applies to the <body> on the wrapper div instead, which containing elements can inherit.
|
||||||
|
*
|
||||||
|
* <div id="embedded" class="embedded">
|
||||||
|
* <div class="embedded-wrapper">
|
||||||
|
* <!-- ... embedded component here ... -->
|
||||||
|
* </div>
|
||||||
|
* </div>
|
||||||
|
*/
|
||||||
|
.embedded-wrapper {
|
||||||
|
font-family: sans-serif;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 16px;
|
||||||
|
color: black;
|
||||||
|
text-align: left;
|
||||||
|
background-color: rgb(255, 255, 255);
|
||||||
|
border: 2px solid red;
|
||||||
|
margin: 10px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
66
example/index.html
Normal file
66
example/index.html
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
background-color: cornsilk;
|
||||||
|
}
|
||||||
|
p, input, label, select, ul, ol, code, pre, blockquote, button {
|
||||||
|
background-color: pink;
|
||||||
|
color: black;
|
||||||
|
font-family: monospace;
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<link rel="stylesheet" type="text/css" href="../dist/example.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div>
|
||||||
|
<p>These are elements affected by the global styling on this page.</p>
|
||||||
|
<label><input type="checkbox"> A checkbox</label><br>
|
||||||
|
<input type="button" value="A button"><br>
|
||||||
|
<input type="textarea" value="Example text"><br>
|
||||||
|
<select>
|
||||||
|
<option value="1">Option 1</option>
|
||||||
|
<option value="2">Option 2</option>
|
||||||
|
<option value="3">Option 3</option>
|
||||||
|
</select>
|
||||||
|
<ul>
|
||||||
|
<li>One</li>
|
||||||
|
<li>Two</li>
|
||||||
|
</ul>
|
||||||
|
<ol>
|
||||||
|
<li>One</li>
|
||||||
|
<li>Two</li>
|
||||||
|
</ol>
|
||||||
|
<code>function () { console.log('Hello, world!'); }</code><br>
|
||||||
|
<pre>preformatted</pre><br>
|
||||||
|
<blockquote>"This is a blockquote!"</blockquote>
|
||||||
|
<button>Button!</button>
|
||||||
|
</div>
|
||||||
|
<div id="embedded" class="embedded">
|
||||||
|
<div class="embedded-wrapper">
|
||||||
|
<p>This is an embedded component isolated from the surrounding CSS cascade.</p>
|
||||||
|
<label><input type="checkbox"> A checkbox</label><br>
|
||||||
|
<input type="button" value="A button"><br>
|
||||||
|
<input type="textarea" value="Example text"><br>
|
||||||
|
<select>
|
||||||
|
<option value="1">Option 1</option>
|
||||||
|
<option value="2">Option 2</option>
|
||||||
|
<option value="3">Option 3</option>
|
||||||
|
</select>
|
||||||
|
<ul>
|
||||||
|
<li>One</li>
|
||||||
|
<li>Two</li>
|
||||||
|
</ul>
|
||||||
|
<ol>
|
||||||
|
<li>One</li>
|
||||||
|
<li>Two</li>
|
||||||
|
</ol>
|
||||||
|
<code>function () { console.log('Hello, world!'); }</code><br>
|
||||||
|
<pre>preformatted</pre><br>
|
||||||
|
<blockquote>"This is a blockquote!"</blockquote>
|
||||||
|
<button>Button!</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
2648
firefox.css
Normal file
2648
firefox.css
Normal file
File diff suppressed because it is too large
Load Diff
7411
package-lock.json
generated
Normal file
7411
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
49
package.json
Normal file
49
package.json
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
{
|
||||||
|
"name": "default-stylesheet",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"description": "Return styles to browser defaults.",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1",
|
||||||
|
"build": "./node_modules/.bin/webpack"
|
||||||
|
},
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "git+https://github.com/thallada/default-stylesheet.git"
|
||||||
|
},
|
||||||
|
"keywords": [
|
||||||
|
"css",
|
||||||
|
"unreset",
|
||||||
|
"all:initial",
|
||||||
|
"reset",
|
||||||
|
"postcss",
|
||||||
|
"browser",
|
||||||
|
"default",
|
||||||
|
"stylesheet"
|
||||||
|
],
|
||||||
|
"author": {
|
||||||
|
"name": "Tyler Hallada",
|
||||||
|
"email": "tyler@hallada.net",
|
||||||
|
"url": "https://www.hallada.net"
|
||||||
|
},
|
||||||
|
"license": "MIT",
|
||||||
|
"bugs": {
|
||||||
|
"url": "https://github.com/thallada/default-stylesheet/issues"
|
||||||
|
},
|
||||||
|
"homepage": "https://github.com/thallada/default-stylesheet#readme",
|
||||||
|
"devDependencies": {
|
||||||
|
"autoprefixer": "^8.0.0",
|
||||||
|
"bootstrap": "^4.0.0",
|
||||||
|
"css-loader": "^0.28.9",
|
||||||
|
"extract-text-webpack-plugin": "^3.0.2",
|
||||||
|
"node-sass": "^4.7.2",
|
||||||
|
"optimize-css-assets-webpack-plugin": "^3.2.0",
|
||||||
|
"postcss-initial": "^2.0.0",
|
||||||
|
"postcss-loader": "^2.1.0",
|
||||||
|
"postcss-prepend-selector": "^0.3.1",
|
||||||
|
"sass-loader": "^6.0.6",
|
||||||
|
"style-loader": "^0.20.2",
|
||||||
|
"webpack": "^3.11.0"
|
||||||
|
},
|
||||||
|
"dependencies": {}
|
||||||
|
}
|
||||||
67
webpack.config.js
Normal file
67
webpack.config.js
Normal file
@ -0,0 +1,67 @@
|
|||||||
|
const path = require('path');
|
||||||
|
const webpack = require('webpack');
|
||||||
|
const ExtractTextPlugin = require('extract-text-webpack-plugin');
|
||||||
|
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
entry: {
|
||||||
|
default: path.resolve(__dirname, 'firefox.css'),
|
||||||
|
example: path.resolve(__dirname, 'example/example.scss')
|
||||||
|
},
|
||||||
|
output: {
|
||||||
|
filename: '[name].min.js',
|
||||||
|
path: path.resolve(__dirname, 'dist'),
|
||||||
|
},
|
||||||
|
devtool: 'source-map',
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /(.scss|.css)$/,
|
||||||
|
use: ExtractTextPlugin.extract({
|
||||||
|
fallback: 'style-loader',
|
||||||
|
use: [
|
||||||
|
{
|
||||||
|
loader: 'css-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
minimize: true,
|
||||||
|
importLoaders: 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loader: 'postcss-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
ident: 'postcss',
|
||||||
|
plugins: () => [
|
||||||
|
/* eslint-disable global-require */
|
||||||
|
require('autoprefixer'),
|
||||||
|
require('postcss-initial')(),
|
||||||
|
require('postcss-prepend-selector')({ selector: '#embedded.embedded ' }),
|
||||||
|
/* eslint-enable global-require */
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loader: 'sass-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
includePaths: [
|
||||||
|
path.join(__dirname),
|
||||||
|
path.join(__dirname, 'node_modules'),
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new ExtractTextPlugin({
|
||||||
|
filename: '[name].min.css',
|
||||||
|
allChunks: true,
|
||||||
|
}),
|
||||||
|
new OptimizeCssAssetsPlugin(),
|
||||||
|
],
|
||||||
|
};
|
||||||
Loading…
Reference in New Issue
Block a user