forked from AkkomaGang/akkoma-fe
Cleaned up panel-footer. No longer uses header styles since those look
and work ugly.
This commit is contained in:
parent
6281241b92
commit
8a590f9269
3 changed files with 17 additions and 14 deletions
19
src/App.scss
19
src/App.scss
|
@ -548,8 +548,17 @@ main-router {
|
||||||
}
|
}
|
||||||
|
|
||||||
.panel-footer {
|
.panel-footer {
|
||||||
|
display: flex;
|
||||||
border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;
|
border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;
|
||||||
border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
|
border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
|
||||||
|
flex: none;
|
||||||
|
padding: 0.6em 0.6em;
|
||||||
|
text-align: left;
|
||||||
|
line-height: 28px;
|
||||||
|
align-items: baseline;
|
||||||
|
border-width: 1px 0 0 0;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: var(--border, $fallback--border);
|
||||||
|
|
||||||
.faint {
|
.faint {
|
||||||
color: $fallback--faint;
|
color: $fallback--faint;
|
||||||
|
@ -862,16 +871,10 @@ nav {
|
||||||
}
|
}
|
||||||
|
|
||||||
.new-status-notification {
|
.new-status-notification {
|
||||||
position:relative;
|
position: relative;
|
||||||
margin-top: -1px;
|
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
border-width: 1px 0 0 0;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: var(--border, $fallback--border);
|
|
||||||
padding: 10px;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
background-color: $fallback--fg;
|
flex: 1;
|
||||||
background-color: var(--panel, $fallback--fg);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-layout {
|
.chat-layout {
|
||||||
|
|
|
@ -37,7 +37,7 @@
|
||||||
<div class="panel-footer">
|
<div class="panel-footer">
|
||||||
<div
|
<div
|
||||||
v-if="bottomedOut"
|
v-if="bottomedOut"
|
||||||
class="new-status-notification text-center panel-footer faint"
|
class="new-status-notification text-center faint"
|
||||||
>
|
>
|
||||||
{{ $t('notifications.no_more_notifications') }}
|
{{ $t('notifications.no_more_notifications') }}
|
||||||
</div>
|
</div>
|
||||||
|
@ -46,7 +46,7 @@
|
||||||
class="button-unstyled -link -fullwidth"
|
class="button-unstyled -link -fullwidth"
|
||||||
@click.prevent="fetchOlderNotifications()"
|
@click.prevent="fetchOlderNotifications()"
|
||||||
>
|
>
|
||||||
<div class="new-status-notification text-center panel-footer">
|
<div class="new-status-notification text-center">
|
||||||
{{ minimalMode ? $t('interactions.load_older') : $t('notifications.load_older') }}
|
{{ minimalMode ? $t('interactions.load_older') : $t('notifications.load_older') }}
|
||||||
</div>
|
</div>
|
||||||
</button>
|
</button>
|
||||||
|
|
|
@ -52,13 +52,13 @@
|
||||||
<div :class="classes.footer">
|
<div :class="classes.footer">
|
||||||
<div
|
<div
|
||||||
v-if="count===0"
|
v-if="count===0"
|
||||||
class="new-status-notification text-center panel-footer faint"
|
class="new-status-notification text-center faint"
|
||||||
>
|
>
|
||||||
{{ $t('timeline.no_statuses') }}
|
{{ $t('timeline.no_statuses') }}
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-else-if="bottomedOut"
|
v-else-if="bottomedOut"
|
||||||
class="new-status-notification text-center panel-footer faint"
|
class="new-status-notification text-center faint"
|
||||||
>
|
>
|
||||||
{{ $t('timeline.no_more_statuses') }}
|
{{ $t('timeline.no_more_statuses') }}
|
||||||
</div>
|
</div>
|
||||||
|
@ -67,13 +67,13 @@
|
||||||
class="button-unstyled -link -fullwidth"
|
class="button-unstyled -link -fullwidth"
|
||||||
@click.prevent="fetchOlderStatuses()"
|
@click.prevent="fetchOlderStatuses()"
|
||||||
>
|
>
|
||||||
<div class="new-status-notification text-center panel-footer">
|
<div class="new-status-notification text-center">
|
||||||
{{ $t('timeline.load_older') }}
|
{{ $t('timeline.load_older') }}
|
||||||
</div>
|
</div>
|
||||||
</button>
|
</button>
|
||||||
<div
|
<div
|
||||||
v-else
|
v-else
|
||||||
class="new-status-notification text-center panel-footer"
|
class="new-status-notification text-center"
|
||||||
>
|
>
|
||||||
<FAIcon
|
<FAIcon
|
||||||
icon="circle-notch"
|
icon="circle-notch"
|
||||||
|
|
Loading…
Reference in a new issue