From 302c1dd472bf53fa086f598160a8988cdc914be0 Mon Sep 17 00:00:00 2001
From: Georg Krause <mail@georg-krause.net>
Date: Wed, 17 Nov 2021 15:21:26 +0100
Subject: [PATCH] Make mobile about page banner full width
---
front/src/components/AboutPod.vue | 4 ++--
front/src/style/pages/_about.scss | 12 ++++++++++++
2 files changed, 14 insertions(+), 2 deletions(-)
diff --git a/front/src/components/AboutPod.vue b/front/src/components/AboutPod.vue
index c53a3bc87..ad5fbe8bc 100644
--- a/front/src/components/AboutPod.vue
+++ b/front/src/components/AboutPod.vue
@@ -1,12 +1,12 @@
<template>
<main class="main pusher page-about" v-title="labels.title">
- <div class="ui container">
+ <div class="ui">
<div class="ui horizontally fitted stripe basic segment">
<div class="ui basic vertically fitted stripe segment content">
<section :class="['ui', 'head', {'with-background': banner}, 'vertical', 'center', 'aligned', 'stripe', 'segment']" :style="headerStyle">
</section>
</div>
- <div class="ui basic vertically fitted stripe segment content">
+ <div class="ui basic vertically fitted stripe segment content container">
<!-- See layout in _about.scss -->
<div class="about-pod-info-container">
<!-- TODO: Table of contents -->
diff --git a/front/src/style/pages/_about.scss b/front/src/style/pages/_about.scss
index 02eaee16f..40e929ca0 100644
--- a/front/src/style/pages/_about.scss
+++ b/front/src/style/pages/_about.scss
@@ -150,6 +150,18 @@
}
@include media('<tablet') {
+ .about-pod-info-container {
+ padding: 0 2em;
+ }
+ .ui.horizontally.fitted.stripe.basic.segment {
+ padding-top: 0px;
+ }
+ .ui.basic.vertically.fitted.stripe.segment.content {
+ padding: 0px;
+ }
+ .ui.head.vertical.center.aligned.stripe.segment {
+ border-radius: 0 !important;
+ }
.statistics-container {
.statistics-statistic {
flex-basis: 50%;
--
GitLab