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>

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

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