change css, add thead
This commit is contained in:
parent
a6b0eb17e7
commit
2ca297e68c
10
cast.html
10
cast.html
@ -11,6 +11,16 @@
|
|||||||
<body>
|
<body>
|
||||||
<h1>My Readings</h1>
|
<h1>My Readings</h1>
|
||||||
<table id="table">
|
<table id="table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Image</th>
|
||||||
|
<th>Name and description</th>
|
||||||
|
<th>My opignon</th>
|
||||||
|
<th>Reading date</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
{{books}}
|
{{books}}
|
||||||
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</body>
|
</body>
|
48
style.css
48
style.css
@ -1,19 +1,47 @@
|
|||||||
body{
|
:root{
|
||||||
background-color: #586e75;
|
--bg1: #002b36;
|
||||||
|
--bg2: #073642;
|
||||||
|
--content1: #586e75;
|
||||||
|
--content2: #657b83;
|
||||||
|
--content3: #839496;
|
||||||
|
--content4: #93a1a1;
|
||||||
|
--lbg1: #eee8d5;
|
||||||
|
--lbg2: #fdf6e3;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, #table {
|
table tbody tr:nth-child(odd){
|
||||||
|
background-color: var(--content1);
|
||||||
|
}
|
||||||
|
table tbody tr:nth-child(even) {
|
||||||
|
background-color: var(--content4);
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
background-color: var(--bg1);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#table {
|
table {
|
||||||
background-color: green;
|
border-collapse:collapse;
|
||||||
|
background-color: var(--bg2);
|
||||||
|
}
|
||||||
|
|
||||||
|
thead {
|
||||||
|
background-color: var(--base1);
|
||||||
|
}
|
||||||
|
|
||||||
|
tbody {
|
||||||
|
background-color: var(--base0);
|
||||||
}
|
}
|
||||||
|
|
||||||
tr {
|
tr {
|
||||||
max-height: 250px;
|
max-height: 250px;
|
||||||
background-color: green;
|
background-color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
@ -30,9 +58,13 @@ img {
|
|||||||
width: 30%;
|
width: 30%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.reading-date {
|
||||||
|
width: 5%;
|
||||||
|
}
|
||||||
|
|
||||||
td {
|
td {
|
||||||
background-color: red;
|
text-align: center;
|
||||||
border: 2px solid;
|
background-color: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.name {
|
.name {
|
||||||
|
Loading…
Reference in New Issue
Block a user