From 44791ccf96ede8f92c84f0dc3699e08585e47c3e Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Mon, 13 Mar 2017 14:51:46 +0100 Subject: [PATCH] fixed responsive for medium --- .../clameurs/css/dist/styles.css | 26 +++++++++---------- .../figureslibres/clameurs/css/styles.scss | 26 +++++++++---------- 2 files changed, 26 insertions(+), 26 deletions(-) diff --git a/sites/all/themes/figureslibres/clameurs/css/dist/styles.css b/sites/all/themes/figureslibres/clameurs/css/dist/styles.css index 651ae1f5..7bec5f06 100755 --- a/sites/all/themes/figureslibres/clameurs/css/dist/styles.css +++ b/sites/all/themes/figureslibres/clameurs/css/dist/styles.css @@ -333,7 +333,7 @@ input { letter-spacing: normal; } .node-thematique .content article.main { overflow: hidden; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content article.main { display: inline-block; vertical-align: top; @@ -368,7 +368,7 @@ input { transition: height 0.5s ease-in-out; background-color: #fff; overflow: hidden; } - @media only screen and (min-width: 85.4375em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content article.main .field-name-body .value { display: block; } } .node-thematique .content article.main .field-name-body .value p { @@ -377,7 +377,7 @@ input { line-height: 1.3; margin: 0; background-color: #fff; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content article.main .field-name-body:hover .value { height: 700px; } } .node-thematique .content article.main .group-video { @@ -426,18 +426,18 @@ input { font-weight: 500; font-size: 2em; margin: 0; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content article.main .group-video:hover .group-description .field-name-field-description { opacity: 1; } } .node-thematique .content aside.right { margin-top: 1.2em; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.right { display: inline-block; vertical-align: top; width: 30.5%; margin-top: 0; } } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.right .field-name-field-eclairages { padding-left: 1em; } } .node-thematique .content aside.right .field-name-field-eclairages .field-items { @@ -447,14 +447,14 @@ input { flex-flow: row wrap; -ms-flex-pack: start; justify-content: flex-start; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.right .field-name-field-eclairages .field-items { display: block; } } .node-thematique .content aside.right .field-name-field-eclairages .field-items > .field-item { display: block; background-color: #fff; width: 33%; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.right .field-name-field-eclairages .field-items > .field-item { width: auto; } .node-thematique .content aside.right .field-name-field-eclairages .field-items > .field-item:not(:last-child) { @@ -475,7 +475,7 @@ input { width: 90%; height: 80%; margin: 5px; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.right .node-documentair .content .group-txt { margin: 15px; } } .node-thematique .content aside.right .node-documentair .content .group-txt .field-name-field-doc { @@ -507,7 +507,7 @@ input { .node-thematique .content aside.right .node-documentair .content .group-video a { display: block; line-height: 0; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.right .node-documentair:not(.en_attente):hover .group-txt .field-name-field-doc { background-color: transparent; } .node-thematique .content aside.right .node-documentair:not(.en_attente):hover .group-txt .field-name-title-field { @@ -526,7 +526,7 @@ input { opacity: 0.8; } .node-thematique .content aside.bottom { padding-top: 1.2em; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.bottom { padding-top: 0.6em; } } .node-thematique .content aside.bottom .field-name-field-episodes .field-label { @@ -546,7 +546,7 @@ input { flex-flow: row wrap; -ms-flex-pack: start; justify-content: flex-start; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.bottom .field-name-field-episodes > .field-items { -ms-flex-flow: row nowrap; flex-flow: row nowrap; @@ -556,7 +556,7 @@ input { display: block; background-color: #fff; width: 50%; } - @media only screen and (min-width: 64.0625em) { + @media only screen and (min-width: 40.0625em) { .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item { width: 19%; } } .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode .content { diff --git a/sites/all/themes/figureslibres/clameurs/css/styles.scss b/sites/all/themes/figureslibres/clameurs/css/styles.scss index 36f7d23c..15186676 100755 --- a/sites/all/themes/figureslibres/clameurs/css/styles.scss +++ b/sites/all/themes/figureslibres/clameurs/css/styles.scss @@ -449,7 +449,7 @@ $header_height_large:400px; // /_/ /_/ /_/\__,_/_/_/ /_/ article.main{ - @media #{$large-up} { + @media #{$medium-up} { display: inline-block; vertical-align: top; width:$main_w; @@ -480,7 +480,7 @@ $header_height_large:400px; } .value{ display:none; - @media #{$xlarge-up} { + @media #{$medium-up} { display: block; } position:absolute; @@ -493,7 +493,7 @@ $header_height_large:400px; background-color: #fff; } } - @media #{$large-up} { + @media #{$medium-up} { &:hover{ // .summary{background-color: #fff;} .value{ @@ -541,7 +541,7 @@ $header_height_large:400px; } } } - @media #{$large-up} { + @media #{$medium-up} { &:hover .group-description{ // background-color: rgba(255,255,255,0.9); // .field-name-field-ecouter{ @@ -561,28 +561,28 @@ $header_height_large:400px; aside.right{ margin-top:$gouttiere; - @media #{$large-up} { + @media #{$medium-up} { display: inline-block; vertical-align: top; width: $right_w; margin-top: 0; } .field-name-field-eclairages{ - @media #{$large-up} { + @media #{$medium-up} { padding-left:1em; } .field-items{ display: flex; flex-flow: row wrap; justify-content: flex-start; - @media #{$large-up} { + @media #{$medium-up} { display: block; } &>.field-item{ display: block; background-color: #fff; width:33%; - @media #{$large-up} { + @media #{$medium-up} { width:auto; &:not(:last-child){ padding-bottom: $gouttiere; @@ -604,7 +604,7 @@ $header_height_large:400px; position:absolute; z-index: 2; overflow: hidden; top:0; left:0; width:90%; height:80%; margin:5px; - @media #{$large-up} { + @media #{$medium-up} { margin:15px; } // opacity: 0; @@ -627,7 +627,7 @@ $header_height_large:400px; .group-video img{ width:100%; height:auto;} .group-video a{ display: block; line-height: 0;} } - @media #{$large-up} { + @media #{$medium-up} { &:not(.en_attente):hover .group-txt{ .field-name-field-doc{background-color: transparent;} .field-name-title-field{opacity: 1;} @@ -657,7 +657,7 @@ $header_height_large:400px; // /_/ aside.bottom{ padding-top: $gouttiere; - @media #{$large-up} { + @media #{$medium-up} { padding-top: $gouttiere*0.5; } .field-name-field-episodes{ @@ -671,7 +671,7 @@ $header_height_large:400px; display: flex; flex-flow: row wrap; justify-content: flex-start; - @media #{$large-up} { + @media #{$medium-up} { flex-flow: row nowrap; justify-content: space-between; } @@ -679,7 +679,7 @@ $header_height_large:400px; display: block; background-color: #fff; width:50%; - @media #{$large-up} { + @media #{$medium-up} { width:19%; } .node-episode{