UI improvements.

This commit is contained in:
Daniel 2022-06-26 16:57:55 +04:30
parent 371eb3c181
commit 8240b3e80e
3 changed files with 26 additions and 9 deletions

View File

@ -67,7 +67,7 @@ const List = ({ SetPath, data, tags, collections, reFetch, SetLoader, lightMode
<img alt="" src={favicon} /> <img alt="" src={favicon} />
<div className="list-entity-content"> <div className="list-entity-content">
<div className="row-name"> <div className="row-name">
<span className="num">{i + 1}.</span> <span className="num">{i + 1}</span>
{e.name} {e.name}
<a <a
className="link" className="link"

View File

@ -1,6 +1,7 @@
@media (min-width: 650px) { @media (min-width: 650px) {
.list-entity-content { .list-entity-content {
margin-left: 70px; margin-left: 70px;
padding: 20px;
} }
.tags { .tags {
@ -36,6 +37,13 @@
@media (max-width: 650px) { @media (max-width: 650px) {
.list-entity-content { .list-entity-content {
margin-top: 50px; margin-top: 50px;
padding-left: 20px;
padding-right: 20px;
}
.link {
display: block;
margin-left: 10px;
} }
.tags { .tags {
@ -97,7 +105,6 @@
.list-entity-content { .list-entity-content {
z-index: 0; z-index: 0;
padding: 20px;
justify-content: space-between; justify-content: space-between;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -155,13 +162,10 @@
.tags a { .tags a {
padding: 10px; padding: 10px;
background-color:rgb(49, 114, 204); border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px,
rgba(0, 0, 0, 0.3) 0px 7px 13px -3px,
rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
text-shadow: none; text-shadow: none;
margin: 5px; margin: 5px;
color: #ffffff; color: inherit;
} }
.tags a::before { .tags a::before {
@ -171,6 +175,9 @@
.num { .num {
font-size: 1rem; font-size: 1rem;
margin-right: 10px;
opacity: 80%;
display: inline;
} }
.delete { .delete {
@ -234,8 +241,8 @@
} }
.list-collection-label a { .list-collection-label a {
color: rgb(166, 166, 166); opacity: 80%;
text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3); color: inherit;
} }
.return-btn { .return-btn {

View File

@ -27,6 +27,11 @@ body {
background-color: #1f2c38; background-color: #1f2c38;
} }
.tags a {
background: #273949;
box-shadow: 6px 6px 11px #21303e, -6px -6px 11px #2d4254;
}
.send-btn, .send-btn,
.apply-btn { .apply-btn {
background-color: #273949; background-color: #273949;
@ -97,6 +102,11 @@ body {
background-color: lightyellow; background-color: lightyellow;
} }
.light .tags a {
background: #ffffe0b2;
box-shadow: 6px 6px 11px #d9d9be, -6px -6px 11px #ffffff;
}
.light .btn { .light .btn {
background-color: lightyellow; background-color: lightyellow;
color: gray; color: gray;