plakken/front/_recents.scss

65 lines
1.1 KiB
SCSS

@use 'colors' as *;
section#recent-plaks {
bottom: 1rem;
display: flex;
flex-flow: column wrap;
gap: 9px;
position: absolute;
right: 1rem;
transition: .15s ease-in-out;
user-select: none;
.title {
align-items: center;
gap: 18px;
transition: .15s ease-in-out;
&:hover {
border-color: #555;
}
}
.recent-plak {
align-items: center;
border: 3px solid $border;
font-weight: 500;
justify-content: space-between;
outline: none;
padding: 8px 18px;
text-decoration: none;
transition: .15s ease-in-out;
width: 12rem;
&:focus-visible {
border: 2px solid #bbb;
}
svg {
border-radius: 15px;
cursor: pointer;
height: 22px;
padding: 5px;
stroke: $text;
stroke-width: 2.25;
width: 22px;
transition: .1s ease-in-out;
&:hover {
background-color: $border;
}
}
}
a {
color: inherit;
text-decoration: none;
}
}
h3 {
font-size: 1.5rem;
margin: 0;
transition: .15s ease-in-out;
width: fit-content;
}