c64ref/style.css
2020-05-15 15:33:47 +02:00

252 lines
6.7 KiB
CSS

/* Colors */
:root {
--main-background: #e0f0ff;
--main-color: #004080;
--highlight-background: #006ad5;
--border-color: #0060a0;
--title-color-1: #017100;
--title-color-2: #004D7F;
--title-color-3: #99195E;
--title-color-4: #F8BA00;
--title-color-5: #B51700;
--title-color-6: #017B76;
--title-color-7: #595959;
--title-color-8: #714a00;
--dark-color-1: #D8F2CB;
--dark-color-2: #C6E2FC;
--dark-color-3: #BFB7E8;
--dark-color-4: #FCF6CD;
--dark-color-5: #F4D2E3;
--dark-color-6: #D2F6F0;
--dark-color-7: #E0E0E0;
--dark-color-8: #F2E4CB;
--light-color-1: #E5F2DF;
--light-color-2: #E3F0FC;
--light-color-3: #D5D1E8;
--light-color-4: #FCFAE6;
--light-color-5: #F5E4EC;
--light-color-6: #E1F5F2;
--light-color-7: #EDEDED;
--light-color-8: #F2EBDF;
}
/**/
body {
background: var(--main-background);
color: var(--main-color);
font-family: Helvetica;
margin: 0px;
}
a {
color: var(--border-color);
}
div {
padding: 1em;
}
div.body {
padding: 8px;
}
/* Navigation */
.topnav {
background-color: #333;
overflow: hidden;
padding: 0px;
border-bottom: solid 2px var(--main-color);
}
.topnav a, .topnav h1 {
float: left;
text-align: center;
padding: 14px 16px;
margin: 0px;
text-decoration: none;
font-size: 17px;
}
.topnav a {
color: white;
border-right:solid 1px var(--main-background);
}
.topnav h1 {
color: black;
background-color: white;
}
.topnav a:hover {
background-color: var(--main-background);
color: black;
}
.topnav a.active {
background-color: var(--highlight-background);
color: white;
}
/* Tables */
table {
border-collapse: collapse;
border: solid 1px var(--border-color);
color: black;
}
tr, td, th {
margin: 0px;
text-align:left;
vertical-align: text-top;
}
th.com {
font-weight: bold;
}
/* Overview Table */
table.checkbox_table tr, table.checkbox_table td {
padding: 4px 8px;
border: solid var(--border-color);
border-width:1px 0px 1px 0px;
}
table.checkbox_table a {
color: var(--main-background);
}
/* Overview Table: Multicolor */
table.checkbox_table tr:nth-of-type(1) { background: var(--light-color-1); }
table.checkbox_table tr:nth-of-type(1) td:nth-of-type(2) { background: var(--title-color-1);}
table.checkbox_table tr:nth-of-type(2) { background: var(--light-color-2); }
table.checkbox_table tr:nth-of-type(2) td:nth-of-type(2) { background: var(--title-color-2); }
table.checkbox_table tr:nth-of-type(3) { background: var(--light-color-3); }
table.checkbox_table tr:nth-of-type(3) td:nth-of-type(2) { background: var(--title-color-3); }
table.checkbox_table tr:nth-of-type(4) { background: var(--light-color-4); }
table.checkbox_table tr:nth-of-type(4) td:nth-of-type(2) { background: var(--title-color-4); }
table.checkbox_table tr:nth-of-type(5) { background: var(--light-color-5); }
table.checkbox_table tr:nth-of-type(5) td:nth-of-type(2) { background: var(--title-color-5); }
table.checkbox_table tr:nth-of-type(6) { background: var(--light-color-6); }
table.checkbox_table tr:nth-of-type(6) td:nth-of-type(2) { background: var(--title-color-6); }
table.checkbox_table tr:nth-of-type(7) { background: var(--light-color-7); }
table.checkbox_table tr:nth-of-type(7) td:nth-of-type(2) { background: var(--title-color-7); }
table.checkbox_table tr:nth-of-type(8) { background: var(--light-color-8); }
table.checkbox_table tr:nth-of-type(8) td:nth-of-type(2) { background: var(--title-color-8); }
/* Main Table */
table.disassembly_table {
border: solid grey;
border-width:0px 0px 1px 0px;
}
table.disassembly_table td, table.disassembly_table th {
padding: 2px 4px;
border: solid grey;
border-width:0px 1px 0px 1px;
}
table.disassembly_table th.left_column,
table.disassembly_table th.label_column,
table.disassembly_table th.decimal_column {
position: absolute;
border: 1px solid #000;
border-radius: 2px;
color: var(--main-background);
background: var(--border-color);
}
table.disassembly_table th.left_column {
left: 8px;
z-index: 11;
}
th.left_column a {
color: var(--main-background);
}
th.left_column a:target {
color: yellow;
text-shadow: 0px 1px black;
}
/*
th.left_column a:target::before {
content: "▹";
}
*/
table.disassembly_table th.top_row {
color: var(--main-background);
border-width: 1px;
}
table.disassembly_table tr { background: #f0f0f0; }
table.disassembly_table tr:nth-child(even) { background: #ffffff; }
/* Main Table: Multicolor */
table.disassembly_table th:nth-child(1 of .top_row) { background: var(--title-color-1); }
table.disassembly_table th:nth-child(2 of .top_row) { background: var(--title-color-2); }
table.disassembly_table th:nth-child(3 of .top_row) { background: var(--title-color-3); }
table.disassembly_table th:nth-child(4 of .top_row) { background: var(--title-color-4); }
table.disassembly_table th:nth-child(5 of .top_row) { background: var(--title-color-5); }
table.disassembly_table th:nth-child(6 of .top_row) { background: var(--title-color-6); }
table.disassembly_table th:nth-child(7 of .top_row) { background: var(--title-color-7); }
table.disassembly_table th:nth-child(8 of .top_row) { background: var(--title-color-8); }
table.disassembly_table tr td:nth-of-type(1) { background: var(--dark-color-1); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(1) { background: var(--light-color-1); }
table.disassembly_table tr td:nth-of-type(2) { background: var(--dark-color-2); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(2) { background: var(--light-color-2); }
table.disassembly_table tr td:nth-of-type(3) { background: var(--dark-color-3); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(3) { background: var(--light-color-3); }
table.disassembly_table tr td:nth-of-type(4) { background: var(--dark-color-4); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(4) { background: var(--light-color-4); }
table.disassembly_table tr td:nth-of-type(5) { background: var(--dark-color-5); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(5) { background: var(--light-color-5); }
table.disassembly_table tr td:nth-of-type(6) { background: var(--dark-color-6); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(6) { background: var(--light-color-6); }
table.disassembly_table tr td:nth-of-type(7) { background: var(--dark-color-7); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(7) { background: var(--light-color-7); }
table.disassembly_table tr td:nth-of-type(8) { background: var(--dark-color-8); }
table.disassembly_table tr:nth-child(even) td:nth-of-type(8) { background: var(--light-color-8); }