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

adjusted bottom margin of footer; images on projects page now shrink on mobile

Browse Source
This commit is contained in:
denizk0461
2026-01-23 14:19:20 +01:00
parent 6c28a4c5f3
commit ae5e284032
19 changed files with 67 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/lib/lists/gallery.svelte
View File

@@ -28,11 +28,11 @@
<img class="gallery-img" src="{entry.img}" alt="{entry.imgAlt}">
<div class="gallery-text-container">
{#if reverseTextOrder}
<p class="gallery-date">{@html entry.subtitle}</p>
<p class="gallery-subtitle">{@html entry.subtitle}</p>
<p class="gallery-title">{entry.title}</p>
{:else}
<p class="gallery-title">{entry.title}</p>
<p class="gallery-date">{@html entry.subtitle}</p>
<p class="gallery-subtitle">{@html entry.subtitle}</p>
{/if}
</div>
</a>
@@ -62,6 +62,7 @@
.gallery-img {
width: 145px;
min-width: 145px;
height: 100%;
margin: 0;
object-fit: cover;
@@ -83,20 +84,20 @@
transition: border-color 0.1s ease-out;
}
.gallery-date, .gallery-title {
.gallery-title, .gallery-subtitle {
margin: 0;
transition: color 0.1s ease-out;
}
.gallery-date {
font-size: 1.0rem;
}
.gallery-title {
font-family: var(--font-mono);
font-weight: 700;
}
.gallery-subtitle {
font-size: 1.0rem;
}
.gallery-container:hover .gallery-text-container {
border-color: var(--color-highlight);
}
@@ -106,4 +107,21 @@
.gallery-container:hover p {
color: var(--color-highlight);
}
@media screen and (max-width: 700px) {
.gallery-title {
font-size: 1.0rem;
line-height: 1.1rem;
}
.gallery-subtitle {
font-size: 0.9rem;
line-height: 1.1rem;
}
}
@media screen and (max-width: 500px) {
.gallery-subtitle {
display: none;
}
}
</style>

0
src/lib/link-list.svelte → src/lib/lists/link-list.svelte
View File

6
src/lib/table-of-contents.svelte
View File

@@ -134,5 +134,11 @@
.toc-level-1::before, .toc-level-2::before, .toc-level-3::before {
content: "└ ";
}
@media screen and (max-width: 550px) {
.toc-container {
width: 95%;
}
}
}
</style>

0
src/lib/content-sidebar.svelte → src/lib/viewport/content-sidebar.svelte
View File

0
src/lib/content.svelte → src/lib/viewport/content.svelte
View File

1
src/lib/footer.svelte → src/lib/viewport/footer.svelte
View File

@@ -90,6 +90,7 @@
gap: 16px;
justify-content: space-evenly;
align-items: flex-start;
padding-bottom: 16px;
}
.content-box {

0
src/lib/header.svelte → src/lib/viewport/header.svelte
View File

4
src/routes/+layout.svelte
View File

@@ -1,6 +1,6 @@
<script>
import Header from "$lib/header.svelte";
import Footer from "$lib/footer.svelte";
import Header from "$lib/viewport/header.svelte";
import Footer from "$lib/viewport/footer.svelte";
let { children } = $props();
</script>

4
src/routes/+page.svelte
View File

@@ -1,9 +1,9 @@
<script lang="ts">
import { onMount } from "svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
import GamedevWebring from "$lib/webrings/gamedev.svelte";
import Gallery, { type GalleryEntry } from "$lib/lists/gallery.svelte";
import LinkList from "$lib/link-list.svelte";
import LinkList from "$lib/lists/link-list.svelte";
import { quotes, type Quote } from "./quotes";
import { posts } from "./projects/projectn5/devlog/posts";

4
src/routes/about/+page.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
import TableOfContents from "$lib/table-of-contents.svelte";
import LinkList, { type LinkEntry } from "$lib/link-list.svelte";
import LinkList, { type LinkEntry } from "$lib/lists/link-list.svelte";
let favouriteAlbums: LinkEntry[] = [
{

2
src/routes/blog/[year]/[date]/+page.svelte
View File

@@ -1,6 +1,6 @@
<script>
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
import TableOfContents from "$lib/table-of-contents.svelte";
export let data;

6
src/routes/feeds/+page.svelte
View File

@@ -1,9 +1,9 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import List, { type ListEntry } from "$lib/link-list.svelte";
import Content from "$lib/viewport/content.svelte";
import List, { type LinkEntry } from "$lib/lists/link-list.svelte";
let feeds: ListEntry[] = [
let feeds: LinkEntry[] = [
{
text: "Project N5 devlog",
link: "/projects/projectn5/devlog/feed.xml",

2
src/routes/privacy/+page.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
</script>
<svelte:head>

10
src/routes/projects/+page.svelte
View File

@@ -1,10 +1,9 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import TableOfContents from "$lib/table-of-contents.svelte";
import type { Project } from './projects';
import { projects } from './projects';
import LinkList from "$lib/link-list.svelte";
import Content from "$lib/content.svelte";
import { type Project, projects } from './projects';
import LinkList from "$lib/lists/link-list.svelte";
import Content from "$lib/viewport/content.svelte";
</script>
<svelte:head>
@@ -86,15 +85,14 @@
.project-banner-container {
position: relative;
width: fit-content;
height: 300px;
margin-left: auto;
margin-right: auto;
display: flex;
}
.project-banner {
margin: 0; /* reset left/right margins */
width: 100%;
max-height: 300px;
}
.project-icon {

2
src/routes/projects/daisyfm/+page.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
import TableOfContents from "$lib/table-of-contents.svelte";
</script>

2
src/routes/projects/projectn5/devlog/+page.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
// import type { DevlogPost } from "./devlog-posts";
import { posts, type DevlogPost } from "./posts";
import Gallery, { type GalleryEntry } from "$lib/lists/gallery.svelte";

2
src/routes/projects/projectn5/devlog/[year]/[date]/+page.svelte
View File

@@ -1,6 +1,6 @@
<script>
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
import TableOfContents from "$lib/table-of-contents.svelte";
export let data;

2
src/routes/uses/+page.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/content.svelte";
import Content from "$lib/viewport/content.svelte";
</script>
<svelte:head>

16
src/routes/what-is-this/+page.svelte Normal file
View File

@@ -0,0 +1,16 @@
<script lang="ts">
import Content from "$lib/viewport/content.svelte";
import Banner2 from "$lib/banner2.svelte";
</script>
<svelte:head>
<title>what is this space? | denizk0461</title>
</svelte:head>
<Content>
<Banner2
title="what is this space?" />
<p>Inspired by <a href="https://blog.avas.space/what-is-this/">this</a></p>
</Content>