diff options
| author | Ewout Wieten <ewout@ewy.one> | 2023-01-10 14:09:13 +0100 |
|---|---|---|
| committer | Ewout Wieten <ewout@ewy.one> | 2023-01-10 14:09:13 +0100 |
| commit | 26d498fb85ac1301fc0933d64250a0d48d3e0880 (patch) | |
| tree | beaaae1418439c45ab3e4bfba3f2dcdf2c6881cf /entry/theme | |
Initial commit
Diffstat (limited to 'entry/theme')
| -rw-r--r-- | entry/theme/index.html | 164 | ||||
| -rw-r--r-- | entry/theme/table.css | 13 |
2 files changed, 177 insertions, 0 deletions
diff --git a/entry/theme/index.html b/entry/theme/index.html new file mode 100644 index 0000000..012c6ff --- /dev/null +++ b/entry/theme/index.html @@ -0,0 +1,164 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <title>Colors | ewy.one</title> + <meta charset="UTF-8"/> + <link rel="stylesheet" type="text/css" href="/reset.css"/> + <link rel="stylesheet" type="text/css" href="/terminal.css"/> + <link rel="stylesheet" type="text/css" href="table.css"/> + <meta content="Thought: color schemes | ewy.one" property="og:title" /> + <meta content="Borrow the way I look." property="og:description" /> + <meta content="https://blog.ewy.one/entry/to-be-continued" property="og:url" /> + <meta content="#3E3B37" data-react-helmet="true" name="theme-color" /> +</head> +<body> +<header> + <h1>Why does this website look so good?</h1> +</header> +<main> + <p> + Here is my homebrew color palette. The goal is to incorporate beautiful pastel + colors in a high-contrast, fuzzy medley. + I will eventually update this page with more information, but for now here's a + color table. + </p> + <details> + <summary>Color scheme</summary> + <table> + <thead> + <tr> + <td> + + </td> + <td> + Black + </td> + <td> + Blue + </td> + <td> + Green + </td> + <td> + Cyan + </td> + <td> + Red + </td> + <td> + Magenta + </td> + <td> + Yellow + </td> + <td> + White + </td> + </tr> + </thead> + <tbody> + <tr class="fg-black"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-blue"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-green"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-cyan"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-red"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-magenta"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-yellow"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + <tr class="fg-white"> + <td>Black</td> + + <td class="bg-black">Word</td> + <td class="bg-blue">Word</td> + <td class="bg-green">Word</td> + <td class="bg-cyan">Word</td> + <td class="bg-red">Word</td> + <td class="bg-magenta">Word</td> + <td class="bg-yellow">Word</td> + <td class="bg-white">Word</td> + </tr> + </tbody> + </table> + </details> +</main> +<footer> + <a href="/"><< Return</a> +</footer> +</body> +</html>
\ No newline at end of file diff --git a/entry/theme/table.css b/entry/theme/table.css new file mode 100644 index 0000000..6b5fc4b --- /dev/null +++ b/entry/theme/table.css @@ -0,0 +1,13 @@ +table { + table-layout: fixed; + width: 100%; +} + +td { + width: calc(100% / 11); + text-align: center; + overflow: hidden; +} +tr { + width: 100%; +}
\ No newline at end of file |