mirror_css/css-water.css
1
0
Fork 0
mirror of https://github.com/kognise/water.css.git synced 2025-01-29 09:27:37 +01:00
Code Issues Releases Wiki Activity

Add color emojis to the base stylesheet

Browse Source
This commit is contained in:
Felix 2020-05-29 23:23:08 -05:00
parent c940d74d10
commit 7a656de78e
3 changed files with 6 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
docs/index.html
View File

@ -125,7 +125,7 @@
Paste this into the <code>&lt;head&gt;</code> of your HTML:
</h3>
<button type="button" id="copy-button">
<span id="copy-button-feedback" class="emoji"></span>
<span id="copy-button-feedback"></span>
Copy to clipboard
</button>
</header>
@ -139,13 +139,13 @@
<h3>Options</h3>
<form id="theme-form">
<input type="radio" value="auto" checked name="theme" id="theme-auto" />
<label for="theme-auto">Automatic <span class="emoji">🌙</span> / <span class="emoji">☀</span></label>
<label for="theme-auto">Automatic 🌙 / ☀</label>
<input type="radio" value="dark" name="theme" id="theme-dark" />
<label for="theme-dark">Dark theme <span class="emoji">🌙</span></label>
<label for="theme-dark">Dark theme 🌙</label>
<input type="radio" value="light" name="theme" id="theme-light" />
<label for="theme-light">Light theme <span class="emoji">☀</span></label>
<label for="theme-light">Light theme ☀</label>
</form>
<table id="version-info">
@ -339,7 +339,7 @@
<h6>Heading 6</h6>
<footer>
<a href="#">Back to top <span class="emoji">⬆</span></a>
<a href="#">Back to top ⬆</a>
</footer>
<script src="script.js" defer></script>

20
docs/style.css
View File

@ -63,23 +63,3 @@ body > footer {
align-items: center;
justify-content: space-between;
}
.emoji {
/* Use proper Emoji instead of plain Unicode chars */
font-family:
'Segoe UI Emoji',
'Apple Color Emoji',
'Noto Color Emoji',
system-ui,
-apple-system,
BlinkMacSystemFont,
Segoe UI,
Roboto,
Oxygen,
Ubuntu,
Cantarell,
Fira Sans,
Droid Sans,
Helvetica Neue,
sans-serif;
}

2
src/parts/_base.css
View File

@ -1,5 +1,5 @@
body {
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',, 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif;
line-height: 1.4;
max-width: 800px;
margin: 20px auto;