4724 -
TUTORIAL Upgrade Page Responsive
Pages (2): 1 2
#1
Preview
MOBILE: https://i.imgur.com/kaxRnFr.png

Hidden Content
Please like this post in order to reveal the hidden contents.


PHP Code:
@media only screen and (max-width925px) {
.
mobilevrs1 {
    flexnone!important;
    width100%;
}
}

.
Username-1-style{
   color#FFDF00 ;
    
font-size16px;
}

.
Username-2-style{
   color#c8378d;
    
font-size16px
    
background-imageurl(/images/Carbonblue/bg1.gif);
}

.
Username-3-style{
   color#57a1d4;
    
font-size16px;
    
background-imageurl(/images/Carbonblue/bg1.gif);
}

.
groupimagebg{
   background-color#222222; 
    
padding12px;
    
text-aligncenter;
}

.
redeemcodethead{
    color#fff;    
    padding12px;
    border-radius2px
    background-color#2f2f2f !important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    text-aligncenter;
    font-size1.2rem;
    font-weightbold;
}

.
redeemcodeinputbg{
    background-color#282828;
    
padding12px;
    
border-bottom1px solid #303030;
    
color#fff;
}

.
paymentsbg{
    background-color#2f2f2f; 
    
padding10px;colorgrey;
    
text-aligncenter;
}

.
paymentslistbg{
    background-color#282828; 
    
padding12px;
    
text-aligncenter;
}

.
userperksbf{
   background-color#2f2f2f; 
   padding10px;colorgrey;
   text-aligncenter;
}

.
perklistbg{
   background-color#242424;
   padding12px;
   border-top1px solid #2a2a2a;
   border-bottom1px solid #1B1B1B;
}

.
Firstgroupthead{
    color#fff;
    padding12px;
    border-radius2px
    backgroundlinear-gradient(90deg,rgba(43,44,50,10%,rgba(255235590.2740%,#FFEB3B 100%)!important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    font-size1.2rem;
    font-weightbold;
}

.
firstgroupprice{
    background-colorrgba(0000.2);
    
padding12px;floatright;
    
margin: -12px;
}

.
periodtimeg{
background-color#242424; 
    
padding12px;
    
border-bottom1px solid #303030;
    
color#fff;
}

.
Secondgroupthead{
    color#fff;    
    padding12px;
    border-radius2px
    backgroundlinear-gradient(90deg,rgba(43,44,50,10%,rgba(255592490.4440%,#ea3bff 100%)!important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    font-size1.2rem;
    font-weightbold;
}

.
secondgroupprice{
    background-colorrgba(0000.2);
    
padding12px;
    
floatright;
    
margin: -12px;
}


.
thirdgroupthead{
    color#fff;    
    padding12px;
    border-radius2px
    backgroundlinear-gradient(90deg,rgba(43,44,50,10%,rgba(591372550.4140%,#3b89ff 100%)!important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    font-size1.2rem;
    font-weightbold;
}

.
thirdgroupprice{
    background-colorrgba(0000.2);
    
padding12px;
    
floatright;
    
margin: -12px;
}

.
usernamebg{
    background-color#242424;
    
padding10px;colorgrey;
    
text-aligncenter;
}

.
fa-check:before{
color#03c123;
}

.
fa-times:before{
color#ff2626;
}

.
purchasebutt{
    padding13px;
    background-color#282828;
    text-aligncenter;
    font-size17px;
}

.
purchasebutt:hover{
    padding13px;
    background-color#8d3838;
    text-aligncenter;
    font-size17px;
    color#fff;

Discord:Lobos#8684
4 users Like this post
#2
Thanks mate its for all themes? or only specific theme?
Reply
#3
(12-26-2020, 05:24 PM)SobiTech Wrote: Thanks mate its for all themes? or only specific theme?

All themes
Discord:Lobos#8684
Reply
#4
but on my theme its not working, i am using Emerald theme
Reply
#5
Are you using Page manager?
PM me on discord to help you
Discord:Lobos#8684
Reply
#6
yes i am using page manager, can you please guide me where i shell put this CSS code? in global.css, or any other css file?
Reply
#7
Yeah, Add that css in global.css and html in page manager
Discord:Lobos#8684
Reply
#8
yes i did the same thing, but still its not working on my testing purpose theme "Emerald"
Reply
#9
Pm me on discord
Discord:Lobos#8684
Reply
#10
(12-25-2020, 05:19 PM)lobos Wrote:
Preview
MOBILE: https://i.imgur.com/kaxRnFr.png


[/size]

PHP Code:
@media only screen and (max-width925px) {
.
mobilevrs1 {
    flexnone!important;
    width100%;
}
}

.
Username-1-style{
   color#FFDF00 ;
    
font-size16px;
}

.
Username-2-style{
   color#c8378d;
    
font-size16px
    
background-imageurl(/images/Carbonblue/bg1.gif);
}

.
Username-3-style{
   color#57a1d4;
    
font-size16px;
    
background-imageurl(/images/Carbonblue/bg1.gif);
}

.
groupimagebg{
   background-color#222222; 
    
padding12px;
    
text-aligncenter;
}

.
redeemcodethead{
    color#fff;    
    padding12px;
    border-radius2px
    background-color#2f2f2f !important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    text-aligncenter;
    font-size1.2rem;
    font-weightbold;
}

.
redeemcodeinputbg{
    background-color#282828;
    
padding12px;
    
border-bottom1px solid #303030;
    
color#fff;
}

.
paymentsbg{
    background-color#2f2f2f; 
    
padding10px;colorgrey;
    
text-aligncenter;
}

.
paymentslistbg{
    background-color#282828; 
    
padding12px;
    
text-aligncenter;
}

.
userperksbf{
   background-color#2f2f2f; 
   padding10px;colorgrey;
   text-aligncenter;
}

.
perklistbg{
   background-color#242424;
   padding12px;
   border-top1px solid #2a2a2a;
   border-bottom1px solid #1B1B1B;
}

.
Firstgroupthead{
    color#fff;
    padding12px;
    border-radius2px
    backgroundlinear-gradient(90deg,rgba(43,44,50,10%,rgba(255235590.2740%,#FFEB3B 100%)!important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    font-size1.2rem;
    font-weightbold;
}

.
firstgroupprice{
    background-colorrgba(0000.2);
    
padding12px;floatright;
    
margin: -12px;
}

.
periodtimeg{
background-color#242424; 
    
padding12px;
    
border-bottom1px solid #303030;
    
color#fff;
}

.
Secondgroupthead{
    color#fff;    
    padding12px;
    border-radius2px
    backgroundlinear-gradient(90deg,rgba(43,44,50,10%,rgba(255592490.4440%,#ea3bff 100%)!important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    font-size1.2rem;
    font-weightbold;
}

.
secondgroupprice{
    background-colorrgba(0000.2);
    
padding12px;
    
floatright;
    
margin: -12px;
}


.
thirdgroupthead{
    color#fff;    
    padding12px;
    border-radius2px
    backgroundlinear-gradient(90deg,rgba(43,44,50,10%,rgba(591372550.4140%,#3b89ff 100%)!important;
    background-imagelinear-gradient(to bottomrgba(2552552550.030%, rgba(2552552550100%);
    box-shadow0px 1px 0px rgba(2552552550.1inset;
    text-shadowrgba(0,0,0,0.40px -1px 0px;
    border-radius3px;
    font-size1.2rem;
    font-weightbold;
}

.
thirdgroupprice{
    background-colorrgba(0000.2);
    
padding12px;
    
floatright;
    
margin: -12px;
}

.
usernamebg{
    background-color#242424;
    
padding10px;colorgrey;
    
text-aligncenter;
}

.
fa-check:before{
color#03c123;
}

.
fa-times:before{
color#ff2626;
}

.
purchasebutt{
    padding13px;
    background-color#282828;
    text-aligncenter;
    font-size17px;
}

.
purchasebutt:hover{
    padding13px;
    background-color#8d3838;
    text-aligncenter;
    font-size17px;
    color#fff;

thanks!
Reply
Pages (2): 1 2