moon
/
pleroma-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

move definitions for timeline header buttons to Panel.scss, now called 

rightside buttons
This commit is contained in:
Henry Jameson 2022-10-09 18:50:13 +03:00
parent ce6ce4b6cd
commit 0331e42ee8
6 changed files with 41 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/conversation/conversation.vue
View File

@ -20,10 +20,12 @@
<QuickFilterSettings <QuickFilterSettings
v-if="!collapsable" v-if="!collapsable"
:conversation="true" :conversation="true"
class="rightside-button"
/> />
<QuickViewSettings <QuickViewSettings
v-if="!collapsable" v-if="!collapsable"
:conversation="true" :conversation="true"
class="rightside-button"
/> />
</div> </div>
<div class="conversation-body panel-body"> <div class="conversation-body panel-body">

21
src/components/notifications/notifications.scss
View File

@ -29,27 +29,6 @@
} }
} }
} }
.timeline-header-button {
align-self: stretch;
text-align: center;
width: var(--__panel-heading-height);
height: var(--__panel-heading-height);
margin: calc(-1 * var(--panel-heading-height-padding)) 0;
margin-right: calc(-1 * var(--__panel-heading-gap));
> button {
box-sizing: border-box;
padding: calc(1 * var(--panel-heading-height-padding)) 0;
height: 100%;
width: 100%;
text-align: center;
svg {
font-size: 1.2em;
}
}
}
} }
.notification { .notification {

4
src/components/notifications/notifications.vue
View File

@ -21,7 +21,7 @@
>{{ unseenCount }}</span> >{{ unseenCount }}</span>
</div> </div>
<div <div
class="timeline-header-button" class="rightside-button"
v-if="showScrollTop" v-if="showScrollTop"
> >
<button <button
@ -46,7 +46,7 @@
> >
{{ $t('notifications.read') }} {{ $t('notifications.read') }}
</button> </button>
<NotificationFilters class="timeline-header-button" /> <NotificationFilters class="rightside-button" />
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div <div

32
src/components/timeline/timeline.scss
View File

@ -13,38 +13,6 @@
background-color: var(--cGreen); background-color: var(--cGreen);
} }
.timeline-header-button {
align-self: stretch;
text-align: center;
width: var(--__panel-heading-height);
height: var(--__panel-heading-height);
margin: calc(-1 * var(--panel-heading-height-padding)) 0;
margin-right: calc(-1 * var(--__panel-heading-gap));
> button {
box-sizing: border-box;
padding: calc(1 * var(--panel-heading-height-padding)) 0;
height: 100%;
width: 100%;
text-align: center;
svg {
font-size: 1.2em;
}
}
}
.timeline-header-icon {
align-self: stretch;
text-align: center;
width: var(--__panel-heading-height);
margin-right: calc(-1 * var(--__panel-heading-gap));
svg {
font-size: 1.2em;
}
}
.loadmore-button { .loadmore-button {
position: relative position: relative
} }

10
src/components/timeline/timeline.vue
View File

@ -6,7 +6,7 @@
:timeline-name="timelineName" :timeline-name="timelineName"
/> />
<div <div
class="timeline-header-button" class="rightside-button"
v-if="showScrollTop && !embedded" v-if="showScrollTop && !embedded"
> >
<button <button
@ -25,7 +25,7 @@
</div> </div>
<template v-if="mobileLayout && !embedded"> <template v-if="mobileLayout && !embedded">
<div <div
class="timeline-header-button" class="rightside-button"
v-if="showLoadButton" v-if="showLoadButton"
> >
<button <button
@ -41,7 +41,7 @@
</div> </div>
<div <div
v-else-if="!embedded" v-else-if="!embedded"
class="loadmore-text faint veryfaint timeline-header-icon" class="loadmore-text faint veryfaint rightside-icon"
@click.prevent @click.prevent
> >
<FAIcon <FAIcon
@ -66,8 +66,8 @@
{{ $t('timeline.up_to_date') }} {{ $t('timeline.up_to_date') }}
</div> </div>
</template> </template>
<QuickFilterSettings v-if="!embedded" class="timeline-header-button"/> <QuickFilterSettings v-if="!embedded" class="rightside-button"/>
<QuickViewSettings v-if="!embedded" class="timeline-header-button"/> <QuickViewSettings v-if="!embedded" class="rightside-button"/>
</div> </div>
<div :class="classes.body"> <div :class="classes.body">
<div <div

32
src/panel.scss
View File

@ -196,6 +196,38 @@
} }
} }
} }
.rightside-button {
align-self: stretch;
text-align: center;
width: var(--__panel-heading-height);
height: var(--__panel-heading-height);
margin: calc(-1 * var(--panel-heading-height-padding)) 0;
margin-right: calc(-1 * var(--__panel-heading-gap));
> button {
box-sizing: border-box;
padding: calc(1 * var(--panel-heading-height-padding)) 0;
height: 100%;
width: 100%;
text-align: center;
svg {
font-size: 1.2em;
}
}
}
.rightside-icon {
align-self: stretch;
text-align: center;
width: var(--__panel-heading-height);
margin-right: calc(-1 * var(--__panel-heading-gap));
svg {
font-size: 1.2em;
}
}
} }
.panel-footer { .panel-footer {