treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

[Glitch] Responsive design for profile directory 

Port SCSS changes from 32bd452b56 to glitch flavour
lolsob-rspec
Thibaut Girka 2018-12-18 17:03:53 +01:00
parent 720cb01715
commit c678e1906a
2 changed files with 36 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/javascript/flavours/glitch/styles/containers.scss
View File

@ -296,6 +296,12 @@
text-decoration: underline;
color: $primary-text-color;
}
@media screen and (max-width: $no-gap-breakpoint) {
&.optional {
display: none;
}
}
}
.nav-button {

43
app/javascript/flavours/glitch/styles/widgets.scss
View File

@ -229,18 +229,6 @@
margin-bottom: 10px;
}
.moved-account-widget,
.memoriam-widget,
.box-widget,
.contact-widget,
.landing-page__information.contact-widget {
@media screen and (max-width: $no-gap-breakpoint) {
margin-bottom: 0;
box-shadow: none;
border-radius: 0;
}
}
.page-header {
background: lighten($ui-base-color, 8%);
box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
@ -261,11 +249,20 @@
font-size: 15px;
color: $darker-text-color;
}
@media screen and (max-width: $no-gap-breakpoint) {
margin-top: 0;
background: lighten($ui-base-color, 4%);
h1 {
font-size: 24px;
}
}
}
.directory {
background: $ui-base-color;
border-radius: 0 0 4px 4px;
border-radius: 4px;
box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
&__tag {
@ -407,4 +404,24 @@
font-size: 14px;
}
}
@media screen and (max-width: $no-gap-breakpoint) {
tbody td.optional {
display: none;
}
}
}
.moved-account-widget,
.memoriam-widget,
.box-widget,
.contact-widget,
.landing-page__information.contact-widget,
.directory,
.page-header {
@media screen and (max-width: $no-gap-breakpoint) {
margin-bottom: 0;
box-shadow: none;
border-radius: 0;
}
}