Skip to content

Instantly share code, notes, and snippets.

@greystate

greystate/dabblet.css

Created March 24, 2020 08:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save greystate/c57e0180f38124f7326700b34885d740 to your computer and use it in GitHub Desktop.
Save greystate/c57e0180f38124f7326700b34885d740 to your computer and use it in GitHub Desktop.
Download ZIP
Using currentcolor to style referenced SVG
Raw
dabblet.css
/**
* Using currentcolor to style referenced SVG
*/
html {
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;
}
#logobox {
display: block;
color: blue;
}
#logobox:hover {
color: black;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<a href="#somewhere" id="logobox">
<svg width="100" height="100" viewBox="0 0 100 100">
<use href="#logo" />
</svg>
</a>
<svg xmlns="http://www.w3.org/2000/svg">
<symbol id="logo">
<rect width="100" height="100" fill="none" stroke-width="10" stroke="currentcolor" />
<circle cx="20" cy="80" r="25" fill="currentcolor" />
</symbol>
</svg>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment