mirror of
https://github.com/nicolas-cusan/destyle.css.git
synced 2025-08-30 08:20:18 +02:00
add feature list
This commit is contained in:
23
index.html
23
index.html
@@ -18,6 +18,29 @@
|
||||
your html.
|
||||
</h2>
|
||||
|
||||
<ul class="features">
|
||||
<li>
|
||||
Ensures consistency across browsers (thanks
|
||||
<a href="http://necolas.github.io/normalize.css/">normalize.css</a>)
|
||||
</li>
|
||||
<li>Resets spacing (margin & padding)</li>
|
||||
<li>Resets font-size and line-height</li>
|
||||
<li>
|
||||
Prevents the necessity of reseting defaults styles when authoring
|
||||
stylesheets
|
||||
</li>
|
||||
<li>
|
||||
Prevents style inspector bloat by only targeting what is necessary
|
||||
</li>
|
||||
<li>Contributes to the separation of presentation and semantics</li>
|
||||
<li>
|
||||
Works well with all kind of styling approaches, atomic libraries like
|
||||
<a href="https://tachyons.io/">tachyons</a>, component based styling
|
||||
like css-in-js in <a href="https://reactjs.org">React</a>, good 'ol
|
||||
css, ...
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a class="btn" href="https://github.com/nicolas-cusan/destyle.css">
|
||||
Docs / Github
|
||||
</a>
|
||||
|
34
style.css
34
style.css
@@ -12,7 +12,7 @@ body {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* General
|
||||
/* Home
|
||||
========================================================== */
|
||||
|
||||
.container {
|
||||
@@ -36,7 +36,7 @@ body {
|
||||
|
||||
.sub-title {
|
||||
font-size: 1.4em;
|
||||
margin-bottom: 70px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@@ -53,6 +53,30 @@ body {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.features {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.features li {
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.features li::before {
|
||||
content: '️️☑️';
|
||||
position: absolute;
|
||||
top: 0.2em;
|
||||
left: 0;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
.features a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Footer
|
||||
========================================================== */
|
||||
|
||||
.footer {
|
||||
background-color: #f4f4f4;
|
||||
text-align: center;
|
||||
@@ -170,6 +194,12 @@ body {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.compare-title a:active,
|
||||
.compare-title a:focus,
|
||||
.compare-title a:hover {
|
||||
color: dodgerblue;
|
||||
}
|
||||
|
||||
@media (min-width: 750px) {
|
||||
.compare-title {
|
||||
margin-bottom: 0;
|
||||
|
Reference in New Issue
Block a user