change ul to proper table, added table sorting
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Philipp 2021-10-16 15:03:27 +02:00
parent a614093c32
commit d9221087d0
7 changed files with 624 additions and 187 deletions

View file

@ -24,6 +24,10 @@ img {
max-width: 100%;
}
th {
cursor: pointer;
}
input:focus,
textarea:focus,
button:focus {
@ -128,21 +132,18 @@ button:focus {
.content-item-inner2 {
margin-top: 20px;
margin-bottom: 40px;
border-right: 2px solid #222831;
border-left: 2px solid #222831;
border-bottom: 2px solid #222831;
border-radius: 8px 8px 0px 0px;
}
.content-item-inner3 {
display: flex;
align-items: center;
border-bottom: 2px solid #ffd018;
border-radius: 8px 8px 0px 0px;
background: #222831;
}
.content-item-inner3 th {
border-radius: 8px 8px 0px 0px;
}
.content-item-inner3 h2 {
font-weight: 700;
font-size: 20px;
@ -153,7 +154,6 @@ button:focus {
.content-item-inner4 {
width: 760px;
display: flex;
align-items: center;
justify-content: space-between;
padding-right: 10px;
@ -162,15 +162,13 @@ button:focus {
padding-left: 86px;
}
.content-item-inner4 div {
display: flex;
.content-item-inner4 th {
flex-direction: column;
justify-content: center;
}
.content-item-inner5 {
width: 320px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 10px;
@ -178,30 +176,37 @@ button:focus {
height: 60px;
}
.content-item-inner5 div {
display: flex;
.content-item-inner5 th {
flex-direction: column;
justify-content: center;
}
.content-item-inner6 {
width: 120px;
display: flex;
align-items: center;
justify-content: flex-end;
padding-right: 10px;
height: 60px;
text-align: right;
}
.content-item-inner2 ul li {
display: flex;
.content-item-inner2 table tr td {
align-items: center;
padding-left: 17px;
padding-right: 10px;
height: 60px;
border-bottom: 2px solid #222831;
}
.content-item-inner2 ul li a {
.content-item-inner2 table tr td:nth-child(1) {
border-left: 2px solid #222831;
}
.content-item-inner2 table tr td:nth-child(3) {
border-right: 2px solid #222831;
}
.content-item-inner2 table tr td a {
font-weight: 400;
font-size: 20px;
display: inline-block;
@ -209,7 +214,7 @@ button:focus {
color: #FFFFFF;
}
.content-item-inner2 ul li p {
.content-item-inner2 table tr td p {
font-weight: 400;
font-size: 20px;
display: inline-block;
@ -217,26 +222,26 @@ button:focus {
color: #FFFFFF;
}
.content-item-inner2 ul li:nth-child(even) {
.content-item-inner2 table tr:nth-child(odd) {
background: #222831;
}
.content-item-inner2 ul li div:nth-of-type(1) {
.content-item-inner2 table tr td:nth-of-type(1) {
width: 760px;
}
.content-item-inner2 ul li div:nth-of-type(1) img {
.content-item-inner2 table tr td:nth-of-type(1) img {
max-width: 32px;
margin-right: 37px;
margin-top: -5px;
}
.content-item-inner2 ul li div:nth-of-type(2) {
.content-item-inner2 table tr td:nth-of-type(2) {
width: 320px;
padding-left: 10px;
}
.content-item-inner2 ul li div:nth-of-type(3) {
.content-item-inner2 table tr td:nth-of-type(3) {
width: 120px;
padding-right: 10px;
text-align: right;
@ -294,16 +299,16 @@ Small Screen - Tablate
.content-item-inner4 {
padding-left: 76px;
}
.content-item-inner2 ul li a {
.content-item-inner2 table tr td a {
font-size: 16px;
}
.content-item-inner2 ul li p {
.content-item-inner2 table tr td p {
font-size: 16px;
}
.content-item-inner2 ul li a:nth-of-type(1) img {
.content-item-inner2 table tr td a:nth-of-type(1) img {
margin-right: 27px;
}
@ -345,15 +350,15 @@ Small Screen - Mobile
}
.content-item-inner4 {
width: 760px;
width: 720px;
padding-left: 77px;
}
.content-item-inner2 ul li div:nth-of-type(1) {
width: 760px;
.content-item-inner2 table tr td:nth-of-type(1) {
width: 720px;
}
.content-item-inner2 ul li div:nth-of-type(1) img {
.content-item-inner2 table tr td:nth-of-type(1) img {
margin-right: 28px;
}