mirror of
https://akkoma.dev/AkkomaGang/akkoma-fe.git
synced 2024-11-08 09:29:10 +00:00
mobile-newline (#226)
Allows the handle of users to drop down onto the next line if there isn't enough room in order to improve useability on mobile Reviewed-on: https://akkoma.dev/AkkomaGang/pleroma-fe/pulls/226 Co-authored-by: Beefox <bee@beefox.xyz> Co-committed-by: Beefox <bee@beefox.xyz>
This commit is contained in:
parent
f8a796b234
commit
684894aee3
3 changed files with 25 additions and 13 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
@ -9,3 +9,4 @@ selenium-debug.log
|
||||||
config/local.json
|
config/local.json
|
||||||
config/local.*.json
|
config/local.*.json
|
||||||
docs/site/
|
docs/site/
|
||||||
|
.vscode/
|
|
@ -130,6 +130,13 @@
|
||||||
.heading-left {
|
.heading-left {
|
||||||
display: flex;
|
display: flex;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
img {
|
||||||
|
aspect-ratio: 1 / 1;
|
||||||
|
}
|
||||||
|
.nowrap{
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.heading-right {
|
.heading-right {
|
||||||
|
@ -140,6 +147,8 @@
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
margin: -5px;
|
margin: -5px;
|
||||||
|
|
||||||
|
height: min-content;
|
||||||
|
|
||||||
&:hover svg {
|
&:hover svg {
|
||||||
color: $fallback--lightText;
|
color: $fallback--lightText;
|
||||||
color: var(--lightText, $fallback--lightText);
|
color: var(--lightText, $fallback--lightText);
|
||||||
|
|
|
@ -166,12 +166,13 @@
|
||||||
>
|
>
|
||||||
{{ status.user.name }}
|
{{ status.user.name }}
|
||||||
</h4>
|
</h4>
|
||||||
|
<span class="nowrap">
|
||||||
<router-link
|
<router-link
|
||||||
class="account-name"
|
class="account-name"
|
||||||
:title="status.user.screen_name_ui"
|
:title="status.user.screen_name_ui"
|
||||||
:to="userProfileLink"
|
:to="userProfileLink"
|
||||||
>
|
>
|
||||||
{{ status.user.screen_name_ui }}
|
@{{ status.user.screen_name_ui }}
|
||||||
</router-link>
|
</router-link>
|
||||||
<img
|
<img
|
||||||
v-if="!!(status.user && status.user.favicon)"
|
v-if="!!(status.user && status.user.favicon)"
|
||||||
|
@ -179,6 +180,7 @@
|
||||||
:src="status.user.favicon"
|
:src="status.user.favicon"
|
||||||
:title="faviconAlt(status)"
|
:title="faviconAlt(status)"
|
||||||
>
|
>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<span class="heading-right">
|
<span class="heading-right">
|
||||||
|
|
Loading…
Reference in a new issue