[Glitch] Various improvements to single column layout
Port 84dc21d55d
to glitch-soc
Signed-off-by: Thibaut Girka <thib@sitedethib.com>
This commit is contained in:
@ -11,6 +11,39 @@
|
||||
justify-content: flex-start;
|
||||
overflow-x: auto;
|
||||
position: relative;
|
||||
|
||||
&__panels {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
&__pane {
|
||||
flex: 1 1 auto;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
&__inner {
|
||||
pointer-events: auto;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&__main {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@media screen and (min-width: 360px) {
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.react-swipeable-view-container {
|
||||
@ -496,4 +529,8 @@
|
||||
&:active {
|
||||
background: lighten($ui-highlight-color, 7%);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 630px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
@ -608,7 +608,6 @@
|
||||
.columns-area--mobile {
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
|
||||
.column,
|
||||
@ -624,7 +623,7 @@
|
||||
}
|
||||
|
||||
@media screen and (min-width: 360px) {
|
||||
padding: 10px;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 630px) {
|
||||
@ -685,8 +684,7 @@
|
||||
.tabs-bar {
|
||||
margin: 10px auto;
|
||||
margin-bottom: 0;
|
||||
width: calc(100% - 20px);
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.react-swipeable-view-container .columns-area--mobile {
|
||||
|
Reference in New Issue
Block a user