Add links to site
Grid and flexbox made this way better than they would have been otherwise. Also with cool glow-on-hover effect! type: documentation
This commit is contained in:
parent
6328118c00
commit
6d5f489f19
|
@ -1,8 +1,8 @@
|
|||
:root {
|
||||
--width-target: calc(100vw / 6);
|
||||
--height-target: calc(100vh / 3);
|
||||
--height-target: calc(100vh / 4);
|
||||
--size: min(var(--width-target), var(--height-target));
|
||||
--margin-vertical: calc((100vh - var(--size) * 2) / 2);
|
||||
--margin-vertical: calc((100vh - var(--size) * 2.5) / 2);
|
||||
--margin-horizontal: calc((100vw - var(--size) * 5) / 2);
|
||||
}
|
||||
|
||||
|
@ -36,8 +36,24 @@ a {
|
|||
}
|
||||
|
||||
#intermodal > * {
|
||||
height: var(--size);
|
||||
width: var(--size);
|
||||
width: var(--size);
|
||||
}
|
||||
|
||||
#intermodal > div {
|
||||
height: var(--size);
|
||||
}
|
||||
|
||||
#intermodal > a {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-size: calc(var(--size) / 9);
|
||||
height: calc(var(--size) / 2);
|
||||
justify-content: center;
|
||||
line-height: calc(var(--size) / 9);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-shadow: 0 0 5px #fff;
|
||||
}
|
||||
|
||||
/* intermodal is an isogram */
|
||||
|
|
|
@ -7,20 +7,25 @@
|
|||
<link href="index.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<a href="https://github.com/casey/intermodal">
|
||||
<div id="intermodal">
|
||||
<div id="i"></div>
|
||||
<div id="n"></div>
|
||||
<div id="t"></div>
|
||||
<div id="e"></div>
|
||||
<div id="r"></div>
|
||||
<div id="m"></div>
|
||||
<div id="o"></div>
|
||||
<div id="d"></div>
|
||||
<div id="a"></div>
|
||||
<div id="l"></div>
|
||||
</div>
|
||||
</a>
|
||||
<div id="intermodal">
|
||||
<div id="i"></div>
|
||||
<div id="n"></div>
|
||||
<div id="t"></div>
|
||||
<div id="e"></div>
|
||||
<div id="r"></div>
|
||||
|
||||
<div id="m"></div>
|
||||
<div id="o"></div>
|
||||
<div id="d"></div>
|
||||
<div id="a"></div>
|
||||
<div id="l"></div>
|
||||
|
||||
<a href="https://github.com/casey/intermodal"> github </a>
|
||||
<a href="https://github.com/casey/intermodal/releases"> releases </a>
|
||||
<a href="https://discordapp.com/invite/HaaT5Qz"> discord </a>
|
||||
<a href="book"> book </a>
|
||||
<a href="https://crates.io/crates/imdl"> crates.io </a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
<!-- Love, Casey -->
|
||||
|
|
Loading…
Reference in New Issue
Block a user