Ticket #5619: 0003-Override-skeleton-s-container-size-for-better-respon.patch

File 0003-Override-skeleton-s-container-size-for-better-respon.patch, 2.6 KB (added by Olivier Mehani, 4 years ago)

  • mediagoblin/static/css/base.css 

    From e2f91036c069b5baadd01373aceae21327d6abfa Mon Sep 17 00:00:00 2001
From: Olivier Mehani <shtrom+mediagoblin@ssji.net>
Date: Sun, 31 May 2020 00:17:33 +1000
Subject: [PATCH 3/5] Override skeleton's container size for better
 responsiveness

Signed-off-by: Olivier Mehani <shtrom+mediagoblin@ssji.net>
---
 mediagoblin/static/css/base.css             | 30 +++++++++++++++++++++
 mediagoblin/themes/airy/assets/css/airy.css |  1 -
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css
index 466b0b85..65e33ceb 100644
    a b pre {  
    960960/* Media queries and other responsivisivity */
    961961/* initial GMG max 940 */
    962962@media screen and (max-width: 960px) {
     963  .container {
     964    width: 99%;
     965  }
    963966
    964967  .profile_sidebar {
    965968    width: 100%;
    … … pre {  
    993996}
    994997/* desktop resolutions */
    995998@media screen and (min-width: 960px) {
     999  .container {
     1000    width: 99%;
     1001  }
     1002
    9961003  #thingy_view {
    9971004    width:640px;
    9981005    height:640px;
    … … pre {  
    10021009
    10031010/* Tablet Portrait size to standard 960 (devices and browsers) */
    10041011@media only screen and (min-width: 768px) and (max-width: 959px) {
     1012  .container {
     1013    width: 99%;
     1014  }
     1015
    10051016  .navigation_button {
    10061017  }
    10071018  #thingy_view {
    … … pre {  
    10121023
    10131024/* All Mobile Sizes (devices and browser) */
    10141025@media screen and (max-width: 767px) {
     1026  .container {
     1027    width: 99%;
     1028  }
     1029
    10151030  h1,h2,h3,p {
     1031    text-align: center;
    10161032    margin-bottom: 10px !important;
    10171033  }
    10181034
    … … pre {  
    10421058  .media_comments {
    10431059    border-bottom: 1px solid #333333;
    10441060  }
     1061
     1062  .mediagoblin_content .button_action {
     1063    display: block;
     1064    text-align: center;
     1065  }
     1066
    10451067}
    10461068
    10471069/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
    10481070@media only screen and (min-width: 480px) and (max-width: 767px) {
     1071  .container {
     1072    width: 99%;
     1073  }
     1074
    10491075  #thingy_view {
    10501076    width:420px;
    10511077    height:420px;
    … … pre {  
    10541080
    10551081/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
    10561082@media only screen and (max-width: 479px) {
     1083  .container {
     1084    width: 99%;
     1085  }
     1086
    10571087  #thingy_view {
    10581088    width:300px;
    10591089    height:300px;

  • mediagoblin/themes/airy/assets/css/airy.css 

    diff --git a/mediagoblin/themes/airy/assets/css/airy.css b/mediagoblin/themes/airy/assets/css/airy.css
index 34bf7a8d..f5bf6bb4 100644
    a b p.navigation_button {  
    2929header {
    3030  background-color: #f7f7f7;
    3131  border-bottom: 1px solid #e4e4e4;
    32   width: 940px;
    3332  margin-left: auto;
    3433  margin-right: auto;
    3534}