change ul to proper table, added table sorting
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
a614093c32
commit
d9221087d0
7 changed files with 624 additions and 187 deletions
|
@ -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;
|
||||
}
|
||||
|
||||
|
|
Reference in a new issue