haute-garonne-cd31: adjust mobile title with background image position (#68566)

This commit is contained in:
Frédéric Péters 2022-08-30 18:51:10 +02:00
parent 2b04722c18
commit 4729931abb
3 changed files with 14 additions and 7 deletions

View File

@ -344,7 +344,6 @@ $cell_colors: ( ("bleu", $bleu),
}
body.has-picture {
#mobile-form-title,
h1.form-content--title,
div#rub_service > h2 {
color: white;
@ -359,15 +358,22 @@ body.has-picture {
position: absolute;
top: -200px;
}
#mobile-form-title {
#mobile-form-title-h1,
#mobile-form-title-h2 {
color: white;
text-transform: uppercase;
font-weight: 600;
position: relative;
font-size: 2.643rem;
top: 0;
z-index: 100;
margin-top: -150px;
min-height: 150px;
margin-bottom: 10px;
&.long-title {
margin-top: -180px;
min-height: 180px;
margin-top: -190px;
min-height: 190px;
overflow: hidden;
font-size: 2.143rem;
}
}

View File

@ -14,6 +14,7 @@ $link-color: inherit;
$primary-color: $bleu;
$mobile-limit: 800px;
$border-radius: 0px;
$width: 1135px;
$sidebar-position: right;

View File

@ -2,9 +2,9 @@ $(function() {
var mql = window.matchMedia("screen and (max-width: 800px)");
if (mql.matches) {
/* move form title on mobile */
$('body.has-picture h1.form-content--title').attr('id', 'mobile-form-title').detach().prependTo('#columns');
$('body.has-picture div#rub_service > h2').attr('id', 'mobile-form-title').detach().prependTo('#columns');
var $mobile_form_title = $('#mobile-form-title');
$('body.has-picture h1.form-content--title').attr('id', 'mobile-form-title-h1').detach().prependTo('#columns');
$('body.has-picture div#rub_service > h2').attr('id', 'mobile-form-title-h2').detach().prependTo('#columns');
var $mobile_form_title = $('#mobile-form-title-h1, #mobile-form-title-h2');
$mobile_form_title.removeClass('form-content--title');
if ($mobile_form_title.height() > 150) {
$mobile_form_title.addClass('long-title');