valknar/sexy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: fix admin table padding — edge-to-edge on mobile, no right pad on desktop

Browse Source 
Mobile: remove horizontal padding so tables fill full width with top/bottom
borders only. Desktop: keep left padding, table extends to right edge.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sebastian Krüger
2026-03-06 17:08:16 +01:00
parent 609f116b5d
commit ed9eb6ef22
3 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/frontend/src/routes/admin/articles/+page.svelte
View File

@@ -39,15 +39,15 @@
} }
</script> </script>
<div class="p-3 sm:p-6"> <div class="py-3 sm:py-6 sm:pl-6">
<div class="flex items-center justify-between mb-6"> <div class="flex items-center justify-between mb-6 px-3 sm:px-0">
<h1 class="text-2xl font-bold">{$_("admin.articles.title")}</h1> <h1 class="text-2xl font-bold">{$_("admin.articles.title")}</h1>
<Button href="/admin/articles/new"> <Button href="/admin/articles/new">
<span class="icon-[ri--add-line] h-4 w-4 mr-1"></span>{$_("admin.articles.new_article")} <span class="icon-[ri--add-line] h-4 w-4 mr-1"></span>{$_("admin.articles.new_article")}
</Button> </Button>
</div> </div>
<div class="rounded-lg border border-border/40 overflow-x-auto"> <div class="sm:rounded-lg border-y sm:border border-border/40 overflow-x-auto">
<table class="w-full text-sm"> <table class="w-full text-sm">
<thead class="bg-muted/30"> <thead class="bg-muted/30">
<tr> <tr>

10
packages/frontend/src/routes/admin/users/+page.svelte
View File

@@ -84,14 +84,14 @@
} }
</script> </script>
<div class="p-3 sm:p-6"> <div class="py-3 sm:py-6 sm:pl-6">
<div class="flex items-center justify-between mb-6"> <div class="flex items-center justify-between mb-6 px-3 sm:px-0">
<h1 class="text-2xl font-bold">{$_("admin.users.title")}</h1> <h1 class="text-2xl font-bold">{$_("admin.users.title")}</h1>
<span class="text-sm text-muted-foreground">{$_("admin.users.total", { values: { total: data.total } })}</span> <span class="text-sm text-muted-foreground">{$_("admin.users.total", { values: { total: data.total } })}</span>
</div> </div>
<!-- Filters --> <!-- Filters -->
<div class="flex flex-wrap gap-3 mb-4"> <div class="flex flex-wrap gap-3 mb-4 px-3 sm:px-0">
<Input <Input
placeholder={$_("admin.users.search_placeholder")} placeholder={$_("admin.users.search_placeholder")}
class="max-w-xs" class="max-w-xs"
@@ -116,7 +116,7 @@
</div> </div>
<!-- Table --> <!-- Table -->
<div class="rounded-lg border border-border/40 overflow-x-auto"> <div class="sm:rounded-lg border-y sm:border border-border/40 overflow-x-auto">
<table class="w-full text-sm"> <table class="w-full text-sm">
<thead class="bg-muted/30"> <thead class="bg-muted/30">
<tr> <tr>
@@ -204,7 +204,7 @@
<!-- Pagination --> <!-- Pagination -->
{#if data.total > data.limit} {#if data.total > data.limit}
<div class="flex items-center justify-between mt-4"> <div class="flex items-center justify-between mt-4 px-3 sm:px-0">
<span class="text-sm text-muted-foreground"> <span class="text-sm text-muted-foreground">
{$_("admin.users.showing", { values: { start: data.offset + 1, end: Math.min(data.offset + data.limit, data.total), total: data.total } })} {$_("admin.users.showing", { values: { start: data.offset + 1, end: Math.min(data.offset + data.limit, data.total), total: data.total } })}
</span> </span>

6
packages/frontend/src/routes/admin/videos/+page.svelte
View File

@@ -37,15 +37,15 @@
} }
</script> </script>
<div class="p-3 sm:p-6"> <div class="py-3 sm:py-6 sm:pl-6">
<div class="flex items-center justify-between mb-6"> <div class="flex items-center justify-between mb-6 px-3 sm:px-0">
<h1 class="text-2xl font-bold">{$_("admin.videos.title")}</h1> <h1 class="text-2xl font-bold">{$_("admin.videos.title")}</h1>
<Button href="/admin/videos/new"> <Button href="/admin/videos/new">
<span class="icon-[ri--add-line] h-4 w-4 mr-1"></span>{$_("admin.videos.new_video")} <span class="icon-[ri--add-line] h-4 w-4 mr-1"></span>{$_("admin.videos.new_video")}
</Button> </Button>
</div> </div>
<div class="rounded-lg border border-border/40 overflow-x-auto"> <div class="sm:rounded-lg border-y sm:border border-border/40 overflow-x-auto">
<table class="w-full text-sm"> <table class="w-full text-sm">
<thead class="bg-muted/30"> <thead class="bg-muted/30">
<tr> <tr>