From 71859b6fb000f6b047bd4a79084ce205386110f4 Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Wed, 6 Mar 2019 17:40:26 +0100
Subject: [PATCH] Fix too wide padding on small screens
---
front/src/components/library/Home.vue | 4 ++--
front/src/style/_main.scss | 7 +++++--
2 files changed, 7 insertions(+), 4 deletions(-)
diff --git a/front/src/components/library/Home.vue b/front/src/components/library/Home.vue
index 7e44a46d..42653c3a 100644
--- a/front/src/components/library/Home.vue
+++ b/front/src/components/library/Home.vue
@@ -19,8 +19,8 @@
</div>
</div>
<div class="ui section hidden divider"></div>
- <div class="ui grid">
- <div class="ui row">
+ <div class="ui stackable one column grid">
+ <div class="column">
<album-widget :filters="{playable: true, ordering: '-creation_date'}">
<template slot="title"><translate :translate-context="'Content/Home/Title'">Recently added</translate></template>
</album-widget>
diff --git a/front/src/style/_main.scss b/front/src/style/_main.scss
index 7dda3b26..ebd63d27 100644
--- a/front/src/style/_main.scss
+++ b/front/src/style/_main.scss
@@ -143,9 +143,12 @@ body {
}
.ui.stripe.segment,
#footer {
- padding: 2em;
+ padding: 1em;
@include media(">tablet") {
- padding: 4em;
+ padding: 2em;
+ }
+ @include media(">desktop") {
+ padding: 3em;
}
}
--
GitLab