diff --git a/assets/pinout.css b/assets/pinout.css index 02b00df..c138535 100644 --- a/assets/pinout.css +++ b/assets/pinout.css @@ -165,6 +165,19 @@ header li:nth-child(4) a, header li:nth-child(4) a:visited, header li:nth-child( border-bottom: 0; } +table { + font-family: ui-monospace, + Menlo, Monaco, + "Cascadia Mono", "Segoe UI Mono", + "Roboto Mono", + "Oxygen Mono", + "Ubuntu Monospace", + "Source Code Pro", + "Fira Mono", + "Droid Sans Mono", + "Courier New", monospace; +} + .labels { border-collapse: collapse; } @@ -178,11 +191,9 @@ header li:nth-child(4) a, header li:nth-child(4) a:visited, header li:nth-child( display: contents; } - tr.ground td {color: #22222266;} -tr.ground:hover td {color: #fff;} - -.labels tbody tr:hover, .labels tbody tr:hover:before {color: #fff;} +tr.ground:hover td, .labels tbody tr:hover {color: #000;} +.labels tbody tr:hover:before {color: #fff;} .labels.left tr td:last-child {border-left: 5px solid transparent;} .labels.right tr td:last-child {border-right: 5px solid transparent;} @@ -215,17 +226,18 @@ tr:hover i {color: inherit;} .labels tbody tr.uart:before {background-color: #6c71c4aa;} .labels tbody tr.ground:before {background-color: #555555aa;} -.labels tbody tr:hover.gpio td {background-color: #859900cc; border-color: #859900ee;} -.labels tbody tr:hover.pwm td {background-color: #002b36cc; border-color: #002b36ee;} -.labels tbody tr:hover.supply td {background-color: #dc322fcc; border-color: #dc322fee;} -.labels tbody tr:hover.power td {background-color: #df8b2ccc; border-color: #df8b2cee;} -.labels tbody tr:hover.i2s td {background-color: #2aa198cc; border-color: #2aa198ee;} -.labels tbody tr:hover.gpclk td {background-color: #df8f8ecc; border-color: #df8f8eee;} -.labels tbody tr:hover.i2c td {background-color: #268bd2cc; border-color: #268bd2ee;} -.labels tbody tr:hover.spi td {background-color: #d33682cc; border-color: #d33682ee;} -.labels tbody tr:hover.uart td {background-color: #6c71c4cc; border-color: #6c71c4ee;} -.labels tbody tr:hover.ground td {background-color: #555555cc; border-color: #555555ee;} +.labels tbody tr:hover.gpio td {background-color: #85990033; border-color: #859900ee;} +.labels tbody tr:hover.pwm td {background-color: #002b3633; border-color: #002b36ee;} +.labels tbody tr:hover.supply td {background-color: #dc322f33; border-color: #dc322fee;} +.labels tbody tr:hover.power td {background-color: #df8b2c33; border-color: #df8b2cee;} +.labels tbody tr:hover.i2s td {background-color: #2aa19833; border-color: #2aa198ee;} +.labels tbody tr:hover.gpclk td {background-color: #df8f8e33; border-color: #df8f8eee;} +.labels tbody tr:hover.i2c td {background-color: #268bd233; border-color: #268bd2ee;} +.labels tbody tr:hover.spi td {background-color: #d3368233; border-color: #d33682ee;} +.labels tbody tr:hover.uart td {background-color: #6c71c433; border-color: #6c71c4ee;} +.labels tbody tr:hover.ground td {background-color: #55555533; border-color: #555555ee;} +.labels tbody tr:hover:before {font-weight: bold;} .labels tbody tr.gpio:hover:before {background-color: #859900cc;border-color: #859900;} .labels tbody tr.pwm:hover:before {background-color: #002b36cc;border-color: #002b36;} .labels tbody tr.supply:hover:before{background-color: #dc322fcc;border-color: #dc322f;} @@ -245,8 +257,8 @@ section, footer { body { display: grid; grid-template-columns: 480px auto; - grid-gap: 20px; - margin: 20px; + grid-gap: 20px 40px; + margin: 10px; } section, footer { margin: 0; @@ -297,4 +309,5 @@ section, footer { .labels tbody tr:before { border-color: #000000; } + tr.ground:hover td, .labels tbody tr:hover {color: #fff;} } \ No newline at end of file diff --git a/template.html b/template.html index e4f5e62..cfd03a9 100644 --- a/template.html +++ b/template.html @@ -11,7 +11,7 @@