Edit Title position on slideshow Mobile view

Technical Q&A
1

Hello

1- I am currently working on Brooklyn theme. I want to have the slideshow title on right side on mobile view (I want try different positions : Right up, right down and right center).

2- Still on mobile view, Same thing for the other button below the title + have this button with smaller size + invert colors (like pc view)

Can someone help wit this issue ? I took a screenshot

Here is my url : Waterlys

Thanks

Screenshot_20210516-191511_Samsung Internet.jpg
Screenshot_20210516-191511_Samsung Internet.jpg1080×1226 160 KB

2

hello @Medy06

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file. see screenshot http://prnt.sc/130u2nd

@media only screen and  (max-width: 749px){
 #shopify-section-slideshow  #HeroWrapper-slideshow .hero__adapt-text-wrap .hero__text-content{
         text-align: right !important ;
 }
 }
3

Thanks for the solution, it works

What about the point N°2 ?

4

Hello Medy06,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss

@media only screen and (max-width: 749px){
#shopify-section-slideshow .hero__adapt-text-wrap.wrapper a.btn.hero__cta {
    background-color: #fff !important;
    color: #000 !important;
    padding: 8px 10px;
}
}
5 
@media only screen and  (max-width: 749px){

 #shopify-section-slideshow  #HeroWrapper-slideshow .hero__adapt-text-wrap .hero__text-content a.hero__cta.btn{
    background-color: #ffffff !important;
    color: #000000 !important;
    font-weight: bold !important;
    font-size: 11px !important;
}
   #shopify-section-slideshow  #HeroWrapper-slideshow .hero__adapt-text-wrap .hero__text-content .hero__title.h1{
   font-size: 40px !important;
   }
}