Ella theme- How to change the font size and the location of the new page title

[bethchan]

 Hello ,Dev

       I create a new page, but I want to change the title font size and move it to the middle. Make it the the same as the privacy  policy page. I have added the code on the theme.scss.liquid to change the title of the privacy  policy.

code:

.shopify-policy__container {
max-width: 80% !important;
}

.shopify-policy__title{ padding-top: 30px; }

[suyash1]

@bethchan - can you please share order page link?

[bethchan]

@suyash1 

Hello, Suyash1. 
Page Link:https://lepeto.myshopify.com/pages/order-track

Password: purrfect

PS：Make it the same as the this page: https://lepeto.myshopify.com/policies/privacy-policy

[suyash1]

@bethchan - one issue is order page do not have separate class, so if we adjust header size for it thenit will be applied to all pages, add this css to the end of your theme.scss file and check 

.section-header .title--large {font-size: 1.75em; text-align: center;}

[suyash1]

@bethchan - I see this 

[bethchan]

@suyash1, Thank you so much.

[bethchan]

@suyash1 ， Do you know to reduce the height of my footer bottom?

[Kinjaldavra]

@bethchan  please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media screen and (min-width: 1024px){
   .template-index .site-footer__middle{
      padding: 42px 0 0px !important;
    }     

  .template-index .site-footer__bottom {
      padding:  0 !important;
  }
   }
             
         

[suyash1]

@bethchan - please add this css to the end of theme.scss file and check 

.site-footer__middle {padding: 42px 0 5px;}

@media (min-width: 1025px){
.site-footer__bottom {padding: 5px 0;}
}

[bethchan]

@suyash1 ,  It doesn't work. I found the code is the same as your  code in the theme.style.scss. 

[suyash1]

@bethchan - you see in selected code, number is 55 and that is the space , and I gave you edited code with number 5

you can adjust as per need, you need to change that number 55 and check what number do you want, it will work

[bethchan]

@suyash1 ， I have added it, but it doesn't work yet.

[suyash1]

@bethchan - ok it needs !important after css, so remove those last 3 lines and replace with this 

@media (min-width: 1025px){
.site-footer__bottom {padding: 5px 0 !important;}
}

[bethchan]

@suyash1 , The padding changes but not the padding of the bottom.

before

after

[suyash1]

@bethchan - I do not see the code above loading and that is the issue, when I make browser change, I see like this 

[bethchan]

@suyash1 , pls check the order track page. It change the padding between the badge and the bottom of the footer, not the height of the footer bottom.

The footer bottom of the other page : the badge is not at the middle of it.

[suyash1]

@bethchan - you can remove given css, need to check exact settings as it looks like it works differently on different pages

[bethchan]

I have removed it.