diff --git a/sites/all/themes/gui/perfarttimeline/css/styles.css b/sites/all/themes/gui/perfarttimeline/css/styles.css index 9e7b029..b3e93e4 100644 --- a/sites/all/themes/gui/perfarttimeline/css/styles.css +++ b/sites/all/themes/gui/perfarttimeline/css/styles.css @@ -2122,7 +2122,7 @@ html.classic-nav body.node-type-performance #main #center #content .node.type-pe html.no-js body.node-type-performance #main #center #content .node.type-performance > .content > section.field, html.classic-nav body.node-type-performance #main #center #content .node.type-performance > .content > section.field { flex: 0 0 auto; - max-width: 45%; + max-width: calc(49% - 2em); margin: 0.5em; } html.no-js body.node-type-performance #main #center #content .node.type-performance > .content > section.field.field-name-field-images, @@ -2283,6 +2283,17 @@ html.classic-nav body.node-type-performance #main #center #content .node.type-pe font-weight: 500; font-size: 12px; } +@media (max-width: 500px) { + html.no-js body.node-type-performance #main #center #content .node.type-performance > .content > section.field, + html.classic-nav body.node-type-performance #main #center #content .node.type-performance > .content > section.field { + max-width: calc(100% - 2em); + } + html.no-js body.node-type-performance #main #center #content .node.type-performance > .content > section.field.field-name-field-images, + html.classic-nav body.node-type-performance #main #center #content .node.type-performance > .content > section.field.field-name-field-images { + flex: 1 1 100%; + max-width: 100%; + } +} html.no-js body.node-type-performance #block-perfart-perf-prevnext ul.perf-prev-next-btns, html.classic-nav body.node-type-performance #block-perfart-perf-prevnext ul.perf-prev-next-btns, html.no-js body.node-type-performance #block-perfart-perf-prevnext-bottom ul.perf-prev-next-btns, @@ -2408,3 +2419,8 @@ body.node-type-document #center #content figcaption, width: 250px; margin-bottom: 1em; } +.field-type-video-embed-field iframe { + max-width: 100%; + height: auto; + aspect-ratio: 4/3; +} diff --git a/sites/all/themes/gui/perfarttimeline/less/styles.less b/sites/all/themes/gui/perfarttimeline/less/styles.less index 8cc166f..ea93d27 100644 --- a/sites/all/themes/gui/perfarttimeline/less/styles.less +++ b/sites/all/themes/gui/perfarttimeline/less/styles.less @@ -923,7 +923,7 @@ html.no-js, html.classic-nav{ >section.field{ // outline: 1px solid #036; flex:0 0 auto; - max-width: 45%; + max-width: calc(49% - 2em); // moins padding et margin margin:0.5em; &.field-name-field-images{ flex: 1 1 100%; @@ -944,15 +944,6 @@ html.no-js, html.classic-nav{ display:block; border:none; } - // @cel:100px; - // @padd:0; - // .cel(@n){ - // width:(@cel* @n) - @padd*2; - // /* background-color:rgba(255,0,0,0.1);*/ - // padding:@padd; - // //.bl(1px, rgba(255,0,0,0.1)); - // } - h1.node-title{ .m(0); .fs-perfnode-title; @@ -965,7 +956,6 @@ html.no-js, html.classic-nav{ .fs-perfnode-personne; } - .field-type-textauthor, .field-type-text-long{ // .cel(4); .field-item{ @@ -1077,6 +1067,16 @@ html.no-js, html.classic-nav{ // .field-type-text-long{ // width:400px; // } + + @media (max-width:500px) { + >section.field{ + max-width: calc(100% - 2em); // moins padding et margin + &.field-name-field-images{ + flex: 1 1 100%; + max-width: 100%; + } + } + } } } @@ -1117,3 +1117,10 @@ body.node-type-document, .node-type-document-sonor, .node-type-object, .page-tax font-size:12px; } } + + +.field-type-video-embed-field iframe{ + max-width: 100%; + height: auto; + aspect-ratio: 4/3; +} \ No newline at end of file