mirror of
https://github.com/eugene-serb/wavelovers.git
synced 2023-09-09 23:41:16 +03:00
Added styles for tables, deleted navigation from header, deleted controls buttons
This commit is contained in:
parent
e30da21dc4
commit
15de6a9a12
@ -37,9 +37,9 @@
|
||||
--color-link-hover: var(--color-a);
|
||||
--color-border: var(--color-a);
|
||||
--color-selection: var(--color-b);
|
||||
--color-table-header-background: transparent;
|
||||
--color-table-header-text: transparent;
|
||||
--color-table-item: transparent;
|
||||
--color-table-header-background: var(--color-b);
|
||||
--color-table-header-text: var(--color-white);
|
||||
--color-table-item: var(--color-c);
|
||||
--color-anotation: var(--color-coal);
|
||||
--color-pattern-button: var(--color-c);
|
||||
--color-pattern-text: var(--color-white);
|
||||
@ -57,9 +57,9 @@
|
||||
--color-link-hover: var(--color-a);
|
||||
--color-border: var(--color-a);
|
||||
--color-selection: var(--color-b);
|
||||
--color-table-header-background: transparent;
|
||||
--color-table-header-text: transparent;
|
||||
--color-table-item: transparent;
|
||||
--color-table-header-background: var(--color-b);
|
||||
--color-table-header-text: var(--color-white);
|
||||
--color-table-item: var(--color-c);
|
||||
--color-anotation: var(--color-milk);
|
||||
--color-pattern-button: var(--color-milk);
|
||||
--color-pattern-text: var(--color-black);
|
||||
@ -179,6 +179,40 @@ legend {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* ------ */
|
||||
/* TABLES */
|
||||
/* ------ */
|
||||
|
||||
table, th, td {
|
||||
width: 100%;
|
||||
padding: 8px;
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.table_pink thead {
|
||||
border-bottom: 4px solid var(--color-table-item);
|
||||
}
|
||||
|
||||
.table_pink thead > tr {
|
||||
background-color: var(--color-table-header-background);
|
||||
color: var(--color-table-header-text);
|
||||
}
|
||||
|
||||
.table_pink thead > tr > th {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.table_pink tbody > tr:nth-child(even) {
|
||||
background-color: var(--color-table-item);
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
.table_pink tfoot {
|
||||
border-top: 4px solid var(--color-table-header-background);
|
||||
}
|
||||
|
||||
/* ------------- */
|
||||
/* SERVICE RULES */
|
||||
/* ------------- */
|
||||
@ -469,50 +503,3 @@ legend {
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
.controls-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
.controls-box__item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.controls-box__item > span {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.gamepad-button-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.gamepad-button {
|
||||
width: 4ch;
|
||||
height: 4ch;
|
||||
border: 1px solid black;
|
||||
border-radius: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: grey;
|
||||
color: white;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gamepad-button > span { color: var(--color-white); }
|
||||
|
||||
.gamepad-button_a { background: green; }
|
||||
.gamepad-button_b { background: red; }
|
||||
.gamepad-button_x { background: blue; }
|
||||
.gamepad-button_y { background: orange; }
|
||||
|
||||
|
16
index.html
16
index.html
@ -77,22 +77,6 @@
|
||||
<div class="logo-wrapper">
|
||||
<span class="logo-wrapper__logo">Wavelovers</span>
|
||||
</div>
|
||||
<nav class="menu-wrapper hidden">
|
||||
<ul class="navigation">
|
||||
<li class="navigation__item">
|
||||
<a href="https://eugene-serb.github.io/wavelovers/" target="_self" class="navigation__link">Home</a>
|
||||
</li>
|
||||
<li class="navigation__item">
|
||||
<a href="https://eugene-serb.github.io/wavelovers/#faq" target="_self" class="navigation__link">FAQ</a>
|
||||
</li>
|
||||
<li class="navigation__item">
|
||||
<a href="https://eugene-serb.github.io/wavelovers/#buy" target="_self" class="navigation__link">Buy Pro</a>
|
||||
</li>
|
||||
<li class="navigation__item">
|
||||
<a href="https://eugene-serb.github.io/wavelovers/#donate" target="_self" class="navigation__link">Donate</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user