denizk0461/pages
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added filter tags to projects; added zoom-out animation when hovering over a project page

Browse Source
This commit is contained in:
denizk0461
2026-04-10 22:05:26 +02:00
parent 2067516591
commit b447adec0c
5 changed files with 90 additions and 174 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/routes/+layout.svelte
View File

@@ -454,5 +454,61 @@
font-family: var(--font-sans-serif);
padding: 4px;
}
/* TODO this should be in a component! */
.post-tag {
font-family: var(--font-mono);
font-size: 0.8rem;
background-color: var(--color-background-highlight-alt);
margin: 0;
padding: 4px;
border-radius: 8px;
line-height: 1rem;
font-weight: 600;
}
.tag-filter-header {
font-family: var(--font-mono);
font-size: 0.9rem;
/* margin-left: 10px;
margin-right: 10px; */
margin: 12px 10px 4px;
color: var(--color-text-highlight-alt);
}
.tag-filter-container {
display: flex;
gap: 8px 12px;
margin: 0 10px 8px;
flex-wrap: wrap;
}
.tag-filter {
width: fit-content;
font-size: 0.9rem;
color: var(--color-text);
padding: 8px;
border-radius: 12px;
cursor: pointer;
transition: background-color var(--duration-animation) var(--anim-curve);
}
.tag-filter-selected {
background-color: var(--color-highlight-alt);
}
.tag-filter:hover {
background-color: var(--color-background-highlight-hover-alt);
}
@media screen and (max-width: 600px) {
.tag-filter-container {
gap: 8px;
}
.tag-filter {
font-size: 0.8rem;
}
}
}
</style>