Skip to content

Instantly share code, notes, and snippets.

@aragaer

aragaer/layout.kbd.json

Created April 4, 2019 06:09
Show Gist options
  • Save aragaer/aa3d79eaca7d7a65b8ba5d6c82657e2e to your computer and use it in GitHub Desktop.
Save aragaer/aa3d79eaca7d7a65b8ba5d6c82657e2e to your computer and use it in GitHub Desktop.
Download ZIP
Untitled Keyboard Layout
Raw
layout.kbd.json
[
[
{
"a": 7
},
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>"
],
[
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>"
],
[
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>"
],
[
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
{
"w": 2
},
"<i class='badger badger-snake'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-badger'></i>",
"<i class='badger badger-mushroom'></i>",
"<i class='badger badger-mushroom'></i>"
]
]
Raw
layout.style.css
.badger {
}
/* class for each individual glyph; note the pattern of the class names */
.badger-badger:after {
background-image: url(https://maxcdn.icons8.com/iOS7/PNG/512/Animals/badger-512.png);
background-repeat: no-repeat;
background-position: center;
content:'\00a0';
display:inline-block;
width: 2em;
height: 2em;
background-size: 2em;
}
.badger-mushroom:after {
background-image: url(https://cdn4.iconfinder.com/data/icons/food-dining-glyph-v-1/100/Mushroom-512.png);
background-repeat: no-repeat;
background-position: center;
content:'\00a0';
display:inline-block;
width: 2em;
height: 2em;
background-size: 2em;
}
.badger-snake:after {
background-image: url(https://image0.flaticon.com/icons/png/512/119/119455.png);
background-repeat: no-repeat;
background-position: center;
content:'\00a0';
display:inline-block;
width: 6em;
height: 3em;
background-size: 6em;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment