diff options
-rw-r--r-- | img/favicon.svg | 38 | ||||
-rw-r--r-- | index.html | 1 |
2 files changed, 39 insertions, 0 deletions
diff --git a/img/favicon.svg b/img/favicon.svg new file mode 100644 index 0000000..96b4eab --- /dev/null +++ b/img/favicon.svg @@ -0,0 +1,38 @@ +<svg width='100' height='100' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'> + <style> + :root { + --dark-stroke: 1; + --stroke-lightness: calc(100% - calc(var(--dark-stroke) * 100%)); + --x-color: hsl(300, 100%, 50%); + --o-color: hsl(180, 100%, 50%); + --stroke-color: hsl(0, 0%, var(--stroke-lightness)); + --stroke-width: 6; + } + + .board { + stroke-width: var(--stroke-width); + stroke: var(--stroke-color); + } + + .x { + stroke-width: var(--stroke-width); + stroke: var(--x-color); + } + + .o { + stroke-width: var(--stroke-width); + stroke: var(--o-color); + fill-opacity: 0; + } + </style> + + <path class='board' d='M33 0, 33 100'/> + <path class='board' d='M66 0, 66 100'/> + <path class='board' d='M0 33, 100 33'/> + <path class='board' d='M0 66, 100 66'/> + + <path class='x' d='M3 3, 27 27'/> + <path class='x' d='M27 3, 3 27'/> + + <circle class='o' cx='85' cy='85' r='12'/> +</svg>
\ No newline at end of file @@ -4,6 +4,7 @@ <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Tit Tac Toe</title> <link rel="stylesheet" href="style.css"> + <link rel="icon" href="img/favicon.svg"> <script src="https://cdn.jsdelivr.net/npm/mathjs@9.0.0/lib/browser/math.js"></script> <script defer src="app.js"></script> </head> |