Small mobile layout tweaks
This commit is contained in:
parent
f85085c34f
commit
6b4607e4f9
7 changed files with 35 additions and 33 deletions
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
body {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr min(80ch, 95vw) 1fr;
|
||||
grid-template-columns: 1fr min(80ch, 80vw) 1fr;
|
||||
grid-template-rows: min-content 1fr min-content;
|
||||
padding-inline: 4vw;
|
||||
|
||||
|
|
@ -30,6 +30,10 @@
|
|||
flex-direction: row;
|
||||
align-items: center;
|
||||
gap: 1ex;
|
||||
|
||||
input {
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,37 +1,35 @@
|
|||
@layer components {
|
||||
.h-feed {
|
||||
.note {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid var(--clr-border);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1ex 2ex;
|
||||
.note {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid var(--clr-border);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1ex 2ex;
|
||||
|
||||
.e-content > p:first-child {
|
||||
margin-block-start: 0;
|
||||
}
|
||||
|
||||
.syndication-links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1ex;
|
||||
|
||||
svg {
|
||||
border-radius: 4px;
|
||||
width: auto;
|
||||
height: 1lh;
|
||||
}
|
||||
}
|
||||
.e-content > p:first-child {
|
||||
margin-block-start: 0;
|
||||
}
|
||||
|
||||
.reply-to {
|
||||
font-size: 85%;
|
||||
margin-inline: 2ex;
|
||||
padding-inline: 1ex;
|
||||
border: 1px solid var(--clr-border);
|
||||
border-bottom: none;
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
.syndication-links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1ex;
|
||||
|
||||
svg {
|
||||
border-radius: 4px;
|
||||
width: auto;
|
||||
height: 1lh;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.reply-to {
|
||||
font-size: 85%;
|
||||
margin-inline: 2ex;
|
||||
padding-inline: 1ex;
|
||||
border: 1px solid var(--clr-border);
|
||||
border-bottom: none;
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -88,8 +88,8 @@
|
|||
<div class="footer-actions">
|
||||
<search>
|
||||
<form action="/search" method="get">
|
||||
<label for="search" class="sr-only">Search</label>
|
||||
<input type="search" id="search" name="q" title="Search"><button type="submit">Search</button>
|
||||
<input type="search" id="search" name="q" aria-label="Search">
|
||||
<button type="submit">Search</button>
|
||||
</form>
|
||||
</search>
|
||||
@auth()
|
||||
|
|
|
|||
Loading…
Reference in a new issue