learn-code-the-hard-way
/
zedshaw-games
1
0
Fork 0
Code Issues 7 Pull Requests Packages Projects Releases Wiki Activity

Figured out that SVG is hot garbage and got an icon to work for the home icon.

Browse Source
main
Zed A. Shaw 22 hours ago
parent 9707e0e5f6
commit 26f61eb68b
4 changed files with 31 additions and 3 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 9
      pages/layouts/main.html
  2. 2
      static/icons/home.svg
  3. 14
      static/style.css
  4. 9
      views/layouts/main.html

9
pages/layouts/main.html
Unescape View File

@ -14,7 +14,14 @@
</head> </head>
<body data-testid="{{.PageId}}"> <body data-testid="{{.PageId}}">
<header> <header>
<a id="home" href="/">🏡</a> <a id="home" href="/">
<svg xmlns="http://www.w3.org/2000/svg"
width="2rem"
height="2rem"
viewBox="0 0 2rem 2rem">
<use href="/icons/home.svg#home" />
</svg>
</a>
<a id="live" href="/live/">Live</a> <a id="live" href="/live/">Live</a>
<a id="stream" href="/stream/">Streams</a> <a id="stream" href="/stream/">Streams</a>
<a id="game" href="/game/">Games</a> <a id="game" href="/game/">Games</a>

2
static/icons/home.svg
Unescape View File

@ -8,7 +8,7 @@
stroke-width="2" stroke-width="2"
stroke-linecap="round" stroke-linecap="round"
stroke-linejoin="round" stroke-linejoin="round"
> id="home">
<path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" /> <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
<polyline points="9 22 9 12 15 12 15 22" /> <polyline points="9 22 9 12 15 12 15 22" />
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 316 B

After

Width:  |  Height:  |  Size: 327 B

14
static/style.css
Unescape View File

@ -419,6 +419,15 @@
.bg-green-400\! { .bg-green-400\! {
background-color: var(--color-green-400) !important; background-color: var(--color-green-400) !important;
} }
.fill-gray-50 {
fill: var(--color-gray-50);
}
.stroke-gray-50 {
stroke: var(--color-gray-50);
}
.stroke-gray-50\! {
stroke: var(--color-gray-50) !important;
}
.p-0 { .p-0 {
padding: calc(var(--spacing) * 0); padding: calc(var(--spacing) * 0);
} }
@ -497,6 +506,11 @@
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration)); transition-duration: var(--tw-duration, var(--default-transition-duration));
} }
.\*\:stroke-gray-50 {
:is(& > *) {
stroke: var(--color-gray-50);
}
}
.\*\:text-nowrap { .\*\:text-nowrap {
:is(& > *) { :is(& > *) {
text-wrap: nowrap; text-wrap: nowrap;

9
views/layouts/main.html
Unescape View File

@ -14,7 +14,14 @@
</head> </head>
<body data-testid="{{.PageId}}"> <body data-testid="{{.PageId}}">
<header> <header>
<a id="home" href="/">🏡</a> <a id="home" href="/">
<svg xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24">
<use href="/icons/home.svg#home"><use>
</svg>
</a>
<a id="live" href="/live/">Live</a> <a id="live" href="/live/">Live</a>
<a id="stream" href="/stream/">Streams</a> <a id="stream" href="/stream/">Streams</a>
<a id="game" href="/game/">Games</a> <a id="game" href="/game/">Games</a>

Write Preview
Loading…
Cancel
Save