134 lines
2.2 KiB
CSS
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);
|
|
} |