adamf/web_server
1
1
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

Fix layout so content divs fill remaining space and scroll on overflow
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 1m47s
Details

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Adam French
2026-03-13 17:52:27 +00:00
parent 81cb2bc4b5
commit f29e937307
2 changed files with 36 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
nginx/vue/src/components/util/CommitHistory.vue
View File

@@ -27,20 +27,20 @@ onMounted(() => {
</script> </script>
<template> <template>
<div class="justify-center text-center"> <div class="flex flex-col text-center h-full">
<Header class="text-left">Commits</Header> <Header class="text-left">Commits</Header>
<div v-if="isLoading"> <div v-if="isLoading" class="flex-1 overflow-y-auto">
<p>Loading latest activity...</p> <p>Loading latest activity...</p>
</div> </div>
<div v-else-if="hasError"> <div v-else-if="hasError" class="flex-1 overflow-y-auto">
<p>Could not fetch feed. Please try again later.</p> <p>Could not fetch feed. Please try again later.</p>
</div> </div>
<div <div
v-else-if="feed" v-else-if="feed"
class="flex-col justify-center flex overflow-y-scroll" class="flex-1 flex flex-col justify-center overflow-y-auto"
> >
<h3>Last git activity</h3> <h3>Last git activity</h3>
<img <img
@@ -56,7 +56,7 @@ onMounted(() => {
<small> {{ new Date(feed.created).toLocaleString() }}</small> <small> {{ new Date(feed.created).toLocaleString() }}</small>
</div> </div>
<div v-else> <div v-else class="flex-1 overflow-y-auto">
<p>No activity found.</p> <p>No activity found.</p>
</div> </div>
</div> </div>

52
nginx/vue/src/views/home/Feed.vue
View File

@@ -38,30 +38,40 @@ function deletePost() {
</script> </script>
<template> <template>
<Header>{{ post.title }}</Header> <div class="flex flex-col flex-1 min-h-0">
<div <Header>{{ post.title }}</Header>
class="flex flex-col p-1 overflow-scroll text-left items-start justify-start" <div
> class="flex flex-col flex-1 min-h-0 p-1 overflow-auto text-left items-start justify-start"
<small
>Created at: {{ new Date(post.createdAt).toLocaleString() }}</small
> >
<small>By: {{ post.author.username }}</small> <small
<Markdown class="flex-1 border-box text-wrap" :source="post.content" /> >Created at:
<div class="flex flex-row w-full"> {{ new Date(post.createdAt).toLocaleString() }}</small
<Button class="flex-1 border-box" v-if="!leftCap" @click="prevPost"> >
Prev <small>By: {{ post.author.username }}</small>
</Button> <Markdown
<Button class="flex-1 border-box text-wrap"
class="flex-1 border-box" :source="post.content"
v-if="!rightCap" />
@click="nextPost" <div class="flex flex-row w-full">
<Button
class="flex-1 border-box"
v-if="!leftCap"
@click="prevPost"
>
Prev
</Button>
<Button
class="flex-1 border-box"
v-if="!rightCap"
@click="nextPost"
>
Next
</Button>
</div>
<Button class="w-full" v-if="userOwnsPost" @click="deletePost"
>Delete</Button
> >
Next
</Button>
</div> </div>
<Button class="w-full" v-if="userOwnsPost" @click="deletePost"
>Delete</Button
>
</div> </div>
</template> </template>