Files
linkwarden/src/styles/List.css
T
2022-06-05 21:42:49 +04:30

134 lines
2.2 KiB
CSS

.list {
width: 100%;
text-align: left;
border-spacing: 10px 10px;
}
.list img {
pointer-events: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
position: absolute;
filter: blur(5px);
opacity: 50%;
margin: 20px;
width: 100px;
height: 100px;
transition: opacity 0.3s;
}
.img-content-grp {
display: flex;
align-items: center;
}
.list-row {
display: flex;
justify-content: space-between;
align-items: center;
background-color:#273949;
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;
margin: 20px;
}
.list-row:hover img {
opacity: 90%;
}
.list-entity-content {
z-index: 0;
margin-left: 70px;
padding: 20px;
justify-content: space-between;
display: flex;
flex-direction: column;
}
.list a {
white-space: nowrap;
font-family: 'Font Awesome 5 Free';
pointer-events: all;
text-decoration: none;
color: rgb(194, 193, 193);
font-size: 1rem;
}
.list a::after {
content: " ";
opacity: 0%;
transition: opacity 0.1s;
}
.list a:hover::after {
opacity: 100%;
}
.edit-btn {
position: relative;
border-radius: 100%;
margin: 20px 20px 20px 0px;
font-family: 'Font Awesome 5 Free';
width: 50px;
height: 50px;
padding: 10px;
font-size: 1.3rem;
cursor: pointer;
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;
color: #ffffffb6;
background-color: #1f2c38;
border: none;
transition: background-color 0.1s;
}
.edit-btn:hover {
background-color: rgb(76, 117, 170);
}
.edit-btn:active {
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}
.row-name {
font-size: 2rem;
}
.tags {
display: flex;
margin: 10px;
border-width: 1px;
width: fit-content;
padding: 10px;
font-size: 1rem;
border-radius: 5px;
}
.tags div {
margin-right: 10px;
color: rgb(126, 208, 255);
}
.tags div::before {
content: "#";
}
.num {
font-size: 1rem;
}
.etc {
display: flex;
align-items: center;
}
.delete {
float: right;
font-size: 1.1rem;
width: 40px;
height: 40px;
}
.delete:hover {
background-color: rgba(255, 65, 65, 0.8);
}