mirror_css/destyle
1
0
Fork 0
mirror of https://github.com/nicolas-cusan/destyle.css.git synced 2025-09-02 01:22:42 +02:00
Code Issues Releases Wiki Activity

update docs

Browse Source
This commit is contained in:
Nicolas Cusan
2020-08-12 14:15:30 +02:00
parent 4b8d777a4a
commit e0ec26d308
2 changed files with 130 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

249
destyle.css
View File

@@ -1,7 +1,7 @@
/*! destyle.css v1.0.13 | MIT License | https://github.com/nicolas-cusan/destyle.css */ /*! destyle.css v1.0.13 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model /* Reset box-model */
========================================================================== */ /* ============================================ */
* { * {
box-sizing: border-box; box-sizing: border-box;
@@ -12,14 +12,14 @@
box-sizing: inherit; box-sizing: inherit;
} }
/* Document /* Document */
========================================================================== */ /* ============================================ */
/** /**
* 1. Correct the line height in all browsers. * 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS. * 2. Prevent adjustments of font size after orientation changes in iOS.
* 3. Remove gray overlay on links for iOS. * 3. Remove gray overlay on links for iOS.
*/ */
html { html {
line-height: 1.15; /* 1 */ line-height: 1.15; /* 1 */
@@ -27,27 +27,27 @@ html {
-webkit-tap-highlight-color: transparent; /* 3*/ -webkit-tap-highlight-color: transparent; /* 3*/
} }
/* Sections /* Sections */
========================================================================== */ /* ============================================ */
/** /**
* Remove the margin in all browsers. * Remove the margin in all browsers.
*/ */
body { body {
margin: 0; margin: 0;
} }
/** /**
* Render the `main` element consistently in IE. * Render the `main` element consistently in IE.
*/ */
main { main {
display: block; display: block;
} }
/* Vertical rhythm /* Vertical rhythm */
========================================================================== */ /* ============================================ */
p, p,
table, table,
@@ -61,8 +61,8 @@ dl {
margin: 0; margin: 0;
} }
/* Headings /* Headings */
========================================================================== */ /* ============================================ */
h1, h1,
h2, h2,
@@ -76,8 +76,8 @@ h6 {
margin: 0; margin: 0;
} }
/* Lists (enumeration) /* Lists (enumeration) */
========================================================================== */ /* ============================================ */
ul, ul,
ol { ol {
@@ -86,8 +86,8 @@ ol {
list-style: none; list-style: none;
} }
/* Lists (definition) /* Lists (definition) */
========================================================================== */ /* ============================================ */
dt { dt {
font-weight: bold; font-weight: bold;
@@ -97,13 +97,13 @@ dd {
margin-left: 0; margin-left: 0;
} }
/* Grouping content /* Grouping content */
========================================================================== */ /* ============================================ */
/** /**
* 1. Add the correct box sizing in Firefox. * 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE. * 2. Show the overflow in Edge and IE.
*/ */
hr { hr {
box-sizing: content-box; /* 1 */ box-sizing: content-box; /* 1 */
@@ -117,9 +117,9 @@ hr {
} }
/** /**
* 1. Correct the inheritance and scaling of font size in all browsers. * 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers. * 2. Correct the odd `em` font sizing in all browsers.
*/ */
pre { pre {
font-family: monospace, monospace; /* 1 */ font-family: monospace, monospace; /* 1 */
@@ -130,12 +130,12 @@ address {
font-style: inherit; font-style: inherit;
} }
/* Text-level semantics /* Text-level semantics */
========================================================================== */ /* ============================================ */
/** /**
* Remove the gray background on active links in IE 10. * Remove the gray background on active links in IE 10.
*/ */
a { a {
background-color: transparent; background-color: transparent;
@@ -144,9 +144,9 @@ a {
} }
/** /**
* 1. Remove the bottom border in Chrome 57- * 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/ */
abbr[title] { abbr[title] {
border-bottom: none; /* 1 */ border-bottom: none; /* 1 */
@@ -155,8 +155,8 @@ abbr[title] {
} }
/** /**
* Add the correct font weight in Chrome, Edge, and Safari. * Add the correct font weight in Chrome, Edge, and Safari.
*/ */
b, b,
strong { strong {
@@ -164,9 +164,9 @@ strong {
} }
/** /**
* 1. Correct the inheritance and scaling of font size in all browsers. * 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers. * 2. Correct the odd `em` font sizing in all browsers.
*/ */
code, code,
kbd, kbd,
@@ -176,17 +176,17 @@ samp {
} }
/** /**
* Add the correct font size in all browsers. * Add the correct font size in all browsers.
*/ */
small { small {
font-size: 80%; font-size: 80%;
} }
/** /**
* Prevent `sub` and `sup` elements from affecting the line height in * Prevent `sub` and `sup` elements from affecting the line height in
* all browsers. * all browsers.
*/ */
sub, sub,
sup { sup {
@@ -204,12 +204,12 @@ sup {
top: -0.5em; top: -0.5em;
} }
/* Embedded content /* Embedded content */
========================================================================== */ /* ============================================ */
/** /**
* Remove the border on images inside links in IE 10. * Remove the border on images inside links in IE 10.
*/ */
img { img {
border-style: none; border-style: none;
@@ -223,16 +223,15 @@ iframe {
vertical-align: bottom; vertical-align: bottom;
} }
/* Forms /* Forms */
========================================================================== */ /* ============================================ */
/** /**
* Reset form fields to make them styleable * Reset form fields to make them styleable
* 1. Reset radio and checkbox to preserve their look in iOS. */
*/
button, button,
input, input:not([type="radio"]):not([type="checkbox"]),
optgroup, optgroup,
select, select,
textarea { textarea {
@@ -250,22 +249,10 @@ textarea {
text-align: inherit; text-align: inherit;
} }
[type="checkbox"] {
/* 1 */
-webkit-appearance: checkbox;
appearance: checkbox;
}
[type="radio"] {
/* 1 */
-webkit-appearance: radio;
appearance: radio;
}
/** /**
* Show the overflow in IE. * Show the overflow in IE.
* 1. Show the overflow in Edge. * 1. Show the overflow in Edge.
*/ */
button, button,
input { input {
@@ -274,9 +261,9 @@ input {
} }
/** /**
* Remove the inheritance of text transform in Edge, Firefox, and IE. * Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox. * 1. Remove the inheritance of text transform in Firefox.
*/ */
button, button,
select { select {
@@ -285,8 +272,8 @@ select {
} }
/** /**
* Correct the inability to style clickable types in iOS and Safari. * Correct the inability to style clickable types in iOS and Safari.
*/ */
button, button,
[type="button"], [type="button"],
@@ -305,8 +292,8 @@ button[disabled],
} }
/** /**
* Remove the inner border and padding in Firefox. * Remove the inner border and padding in Firefox.
*/ */
button::-moz-focus-inner, button::-moz-focus-inner,
[type="button"]::-moz-focus-inner, [type="button"]::-moz-focus-inner,
@@ -317,8 +304,8 @@ button::-moz-focus-inner,
} }
/** /**
* Restore the focus styles unset by the previous rule. * Restore the focus styles unset by the previous rule.
*/ */
button:-moz-focusring, button:-moz-focusring,
[type="button"]:-moz-focusring, [type="button"]:-moz-focusring,
@@ -328,16 +315,24 @@ button:-moz-focusring,
} }
/** /**
* Remove padding * Remove arrow in IE10 & IE11
*/ */
select::-ms-expand {
display: none;
}
/**
* Remove padding
*/
option { option {
padding: 0; padding: 0;
} }
/** /**
* Reset to invisible * Reset to invisible
*/ */
fieldset { fieldset {
margin: 0; margin: 0;
@@ -347,11 +342,11 @@ fieldset {
} }
/** /**
* 1. Correct the text wrapping in Edge and IE. * 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE. * 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out * 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers. * `fieldset` elements in all browsers.
*/ */
legend { legend {
color: inherit; /* 2 */ color: inherit; /* 2 */
@@ -362,33 +357,35 @@ legend {
} }
/** /**
* Add the correct vertical alignment in Chrome, Firefox, and Opera. * Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/ */
progress { progress {
vertical-align: baseline; vertical-align: baseline;
} }
/** /**
* Remove the default vertical scrollbar in IE 10+. * Remove the default vertical scrollbar in IE 10+.
*/ */
textarea { textarea {
overflow: auto; overflow: auto;
} }
/** /**
* 1. Remove the padding in IE 10. * Remove margin, padding & outline.
*/ */
[type="checkbox"], [type="checkbox"],
[type="radio"] { [type="radio"] {
padding: 0; /* 1 */ padding: 0;
margin: 0;
outline: 0;
} }
/** /**
* Correct the cursor style of increment and decrement buttons in Chrome. * Correct the cursor style of increment and decrement buttons in Chrome.
*/ */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button { [type="number"]::-webkit-outer-spin-button {
@@ -396,25 +393,25 @@ textarea {
} }
/** /**
* 1. Correct the outline style in Safari. * 1. Correct the outline style in Safari.
*/ */
[type="search"] { [type="search"] {
outline-offset: -2px; /* 1 */ outline-offset: -2px; /* 1 */
} }
/** /**
* Remove the inner padding in Chrome and Safari on macOS. * Remove the inner padding in Chrome and Safari on macOS.
*/ */
[type="search"]::-webkit-search-decoration { [type="search"]::-webkit-search-decoration {
-webkit-appearance: none; -webkit-appearance: none;
} }
/** /**
* 1. Correct the inability to style clickable types in iOS and Safari. * 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari. * 2. Change font properties to `inherit` in Safari.
*/ */
::-webkit-file-upload-button { ::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */ -webkit-appearance: button; /* 1 */
@@ -422,34 +419,42 @@ textarea {
} }
/** /**
* Clickable labels * Clickable labels
*/ */
label[for] { label[for] {
cursor: pointer; cursor: pointer;
} }
/* Interactive /* Interactive */
========================================================================== */ /* ============================================ */
/* /*
* Add the correct display in Edge, IE 10+, and Firefox. * Add the correct display in Edge, IE 10+, and Firefox.
*/ */
details { details {
display: block; display: block;
} }
/* /*
* Add the correct display in all browsers. * Add the correct display in all browsers.
*/ */
summary { summary {
display: list-item; display: list-item;
} }
/* Table /*
========================================================================== */ * Remove outline for editable content.
*/
[contenteditable] {
outline: none;
}
/* Table */
/* ============================================ */
table { table {
border-collapse: collapse; border-collapse: collapse;
@@ -471,20 +476,20 @@ th {
font-weight: bold; font-weight: bold;
} }
/* Misc /* Misc */
========================================================================== */ /* ============================================ */
/** /**
* Add the correct display in IE 10+. * Add the correct display in IE 10+.
*/ */
template { template {
display: none; display: none;
} }
/** /**
* Add the correct display in IE 10. * Add the correct display in IE 10.
*/ */
[hidden] { [hidden] {
display: none; display: none;

6
index.html
View File

@@ -60,8 +60,8 @@
<div class="install-links"> <div class="install-links">
<a <a
class="install-link install-link-first" class="install-link install-link-first"
href="https://github.com/nicolas-cusan/destyle.css/" href="https://github.com/nicolas-cusan/destyle.css/blob/master/destyle.css"
>Source on GitHub</a >View source on GitHub</a
> >
<a <a
@@ -286,7 +286,7 @@
</main> </main>
<footer class="footer"> <footer class="footer">
©2019 — Made with love by ©2020 — Made with love by
<a href="https://twitter.com/n_cusan">Nicolas Cusan</a> <a href="https://twitter.com/n_cusan">Nicolas Cusan</a>
</footer> </footer>