forked from AkkomaGang/akkoma-fe
cleanup, fix some things, try to disable scrollbars on mobile
This commit is contained in:
parent
c71cf72eea
commit
6109fab14e
5 changed files with 18 additions and 23 deletions
|
@ -116,7 +116,7 @@ nav {
|
||||||
|
|
||||||
#content {
|
#content {
|
||||||
overscroll-behavior-y: none;
|
overscroll-behavior-y: none;
|
||||||
overflow-y: auto;
|
overflow-y: scroll;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
}
|
}
|
||||||
|
@ -198,6 +198,9 @@ nav {
|
||||||
margin-left: -2em;
|
margin-left: -2em;
|
||||||
padding-left: 2.5em;
|
padding-left: 2.5em;
|
||||||
|
|
||||||
|
// Only show custom scrollbars on devices which
|
||||||
|
// have a cursor/pointer to operate them
|
||||||
|
@media (pointer: fine) {
|
||||||
&:not(.-show-scrollbar) {
|
&:not(.-show-scrollbar) {
|
||||||
scrollbar-width: none;
|
scrollbar-width: none;
|
||||||
margin-right: -2em;
|
margin-right: -2em;
|
||||||
|
@ -214,6 +217,7 @@ nav {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&.-no-sticky-headers {
|
&.-no-sticky-headers {
|
||||||
.column {
|
.column {
|
||||||
|
|
|
@ -41,8 +41,8 @@
|
||||||
<router-view />
|
<router-view />
|
||||||
</div>
|
</div>
|
||||||
<div id="notifs-column" class="column -scrollable" :class="{ '-show-scrollbar': showScrollbars }"/>
|
<div id="notifs-column" class="column -scrollable" :class="{ '-show-scrollbar': showScrollbars }"/>
|
||||||
<media-modal />
|
|
||||||
</div>
|
</div>
|
||||||
|
<media-modal />
|
||||||
<shout-panel
|
<shout-panel
|
||||||
v-if="currentUser && shout && !hideShoutbox"
|
v-if="currentUser && shout && !hideShoutbox"
|
||||||
:floating="true"
|
:floating="true"
|
||||||
|
|
|
@ -133,18 +133,9 @@
|
||||||
.chat-view-heading {
|
.chat-view-heading {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
position: static;
|
position: static;
|
||||||
z-index: 9999;
|
|
||||||
top: 0;
|
top: 0;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|
||||||
/* This practically overlays the panel heading color over panel background
|
|
||||||
* color. This is needed because we allow transparent panel background and
|
|
||||||
* it doesn't work well in this "disjointed panel header" case
|
|
||||||
*/
|
|
||||||
background:
|
|
||||||
linear-gradient(to top, var(--panel), var(--panel)),
|
|
||||||
linear-gradient(to top, var(--bg), var(--bg));
|
|
||||||
height: 50px;
|
height: 50px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -121,7 +121,7 @@ $modal-view-button-icon-width: 3em;
|
||||||
$modal-view-button-icon-margin: 0.5em;
|
$modal-view-button-icon-margin: 0.5em;
|
||||||
|
|
||||||
.modal-view.media-modal-view {
|
.modal-view.media-modal-view {
|
||||||
z-index: 1001;
|
z-index: 9000;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
.modal-view-button-arrow,
|
.modal-view-button-arrow,
|
||||||
|
|
|
@ -35,7 +35,7 @@ export default {
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.modal-view {
|
.modal-view {
|
||||||
z-index: 1000;
|
z-index: 2000;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
|
Loading…
Reference in a new issue