mirror of
https://github.com/tailscale/tailscale.git
synced 2024-11-25 19:15:34 +00:00
client/web: small tweaks for small screens
Add left and right padding around entire client so that the cards don't run into the side of the screen. Also tighten up vertical spacing in couple of places. Updates #10261 Signed-off-by: Will Norris <will@tailscale.com>
This commit is contained in:
parent
c4ccdd1bd1
commit
c5208f8138
@ -8,7 +8,7 @@
|
||||
<link rel="stylesheet" type="text/css" href="/src/index.css" />
|
||||
<link rel="preload" as="font" href="/src/assets/fonts/Inter.var.latin.woff2" type="font/woff2" crossorigin />
|
||||
</head>
|
||||
<body>
|
||||
<body class="px-2">
|
||||
<noscript>
|
||||
<p class="mb-2">You need to enable Javascript to access the Tailscale web client.</p>
|
||||
<p>If you need any help, feel free to <a href="mailto:support+webclient@tailscale.com" class="link">contact us</a>.</p>
|
||||
|
@ -22,7 +22,7 @@ export default function App() {
|
||||
const { data: auth, loading: loadingAuth, newSession } = useAuth()
|
||||
|
||||
return (
|
||||
<main className="min-w-sm max-w-lg mx-auto py-14 px-5">
|
||||
<main className="min-w-sm max-w-lg mx-auto py-4 md:py-14 px-5">
|
||||
{loadingAuth || !auth ? (
|
||||
<div className="text-center py-14">Loading...</div> // TODO(sonia): add a loading view
|
||||
) : (
|
||||
@ -140,7 +140,7 @@ function Header({
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex justify-between items-center mb-12">
|
||||
<div className="flex justify-between items-center mb-9 md:mb-12">
|
||||
<div className="flex gap-3">
|
||||
<TailscaleIcon
|
||||
className="cursor-pointer"
|
||||
|
Loading…
Reference in New Issue
Block a user