Advertisement:

Author Topic: Lifestyle [Responsive]  (Read 3311 times)

Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Lifestyle [Responsive]
« on: July 06, 2020, 03:06:46 PM »
Link to the theme


"Lifestyle SMF Theme"
Lifestyle is a clean and crisp, responsive theme for SMF 2.0  It has the big four social media buttons as well as a Hero image with button and description. Our style is clean, flat and professional. When you see our design out there, you'll know where it came from, idesignSMF.com This theme is free for personal and commercial use. You are allowed to use it in your projects, change it and adapt for your purposes. You are not allowed to remove the authorship and link to idesignsSMF.com


**Demo

**download









In theme Hero image by: https://unsplash.com/

Offline Deaks

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 22,533
  • Gender: Male
    • trekkiesforyes on Facebook
    • pouvik on GitHub
    • @trekkies4yes on Twitter
    • YES
Re: Lifestyle [Responsive]
« Reply #1 on: July 07, 2020, 03:32:17 PM »
an amazing theme as always :)  Personally not fan of the colours but thats just me

Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Re: Lifestyle [Responsive]
« Reply #2 on: July 07, 2020, 04:44:03 PM »
an amazing theme as always :)  Personally not fan of the colours but thats just me
Ty bro ;)

Offline Antechinus

  • SMF Friend
  • SMF Master
  • *
  • Posts: 25,651
  • Master of BBC Abuse
Re: Lifestyle [Responsive]
« Reply #3 on: July 08, 2020, 12:14:15 AM »
I happened to hit this first topic this morning, without adequate coffee levels and with my brain adjusted for a dark theme.

Warning: Do not do that. This theme is seriously scary if caffeine levels are low and brain is wanting soothing darkness. :D

However, having got myself up to speed later in the day, and with brain adjusted to deal with sunshine, it's actually pretty damned good. :)

Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Re: Lifestyle [Responsive]
« Reply #4 on: July 08, 2020, 08:19:40 AM »
I happened to hit this first topic this morning, without adequate coffee levels and with my brain adjusted for a dark theme.

Warning: Do not do that. This theme is seriously scary if caffeine levels are low and brain is wanting soothing darkness. :D

However, having got myself up to speed later in the day, and with brain adjusted to deal with sunshine, it's actually pretty damned good. :)
it can be scary at times lol. Thanx bro

Offline Wellwisher

  • Full Member
  • ***
  • Posts: 448
  • Gender: Male
Re: Lifestyle [Responsive]
« Reply #5 on: July 08, 2020, 01:45:00 PM »
Love your work, great looking theme Mick.


Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Re: Lifestyle [Responsive]
« Reply #7 on: July 08, 2020, 02:48:38 PM »
Love your work, great looking theme Mick.
thank you!!

Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Re: Lifestyle [Responsive]
« Reply #8 on: July 08, 2020, 02:49:00 PM »
nice one....other than all of the pink  :P  :laugh:
what? Pink is hot! Hahaha

Offline Mr.Truckman

  • Semi-Newbie
  • *
  • Posts: 66
  • Gender: Male
    • motorbike.th on Facebook
    • @hugmove on Twitter
    • Motorcycle Movers
Re: Lifestyle [Responsive]
« Reply #9 on: August 28, 2020, 09:39:07 AM »
hello, I want to change the wallpaper, how do I do it?

Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Re: Lifestyle [Responsive]
« Reply #10 on: August 28, 2020, 05:57:01 PM »
hello, I want to change the wallpaper, how do I do it?


In thee theme css file near the bottom, find:

.hero {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   text-align: center;
   width: 100%;
   height: 50vh;
   overflow: hidden;
   background-size: cover;
   background: linear-gradient(-45deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 37%, rgba(0,0,0,0.65) 100%), url(https://images.unsplash.com/photo-1491956142110-8a4226a12077?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1950&q=80) no-repeat center center scroll;
}


Replace this bit with your own image url.

https://images.unsplash.com/photo-1491956142110-8a4226a12077?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1950&q=80

Then clear browser cache

Offline Rock Lee

  • Native Language Support Specialist
  • SMF Hero
  • *
  • Posts: 3,873
  • Gender: Male
  • Learning more every day!
    • BomberCode.Oficial on Facebook
    • RockLee-BC on GitHub
    • @Bomber_Code on Twitter
    • Bomber Code ~ La nueva era del conocimiento
Re: Lifestyle [Responsive]
« Reply #11 on: August 28, 2020, 06:29:11 PM »
I have time jumps again ::), because I remember commenting, the design was great I liked it and I was going to test it on a test site. Great job @Mick!


Regards!
¡Regresando como cual Fenix! ~ Bomber Code © 2020
Ayudas - Aportes - Tutoriales - Y mucho mas!!!

Offline LVMuse

  • Newbie
  • *
  • Posts: 6
Re: Lifestyle [Responsive]
« Reply #12 on: August 28, 2020, 08:30:24 PM »
Hi Mick! First, it's been 15 years since I set up a forum and I was pleasantly surprised to find your Lifestyle theme! Man, talk about fresh! I love it. Great job. It really stands out from everyone else.

My question is, what do I need to do to make the customizable "lifestyle.png" responsive? I changed the size on the regular desktop view and it looks really good, but I can't get it to shrink or show a smaller version when it reduces down to for a mobile device. I thought putting in a link to a background image might work and it did nothing. Any advice?

Thanks again, and keep up the good work!

Offline barnaby jonez

  • Semi-Newbie
  • *
  • Posts: 21
Re: Lifestyle [Responsive]
« Reply #13 on: August 29, 2020, 02:12:23 PM »
You could probably just make media queries for specific viewports (mobile/template) then update the background-image CSS to show a different image instead.

@media (max-width: 600px) {
// show mobile image
.hero{
background-url: your image url here;
}
}

something like that.

Offline LVMuse

  • Newbie
  • *
  • Posts: 6
Re: Lifestyle [Responsive]
« Reply #14 on: August 29, 2020, 03:41:15 PM »
I'll give that a shot. Thanks!

Offline LVMuse

  • Newbie
  • *
  • Posts: 6
Re: Lifestyle [Responsive]
« Reply #15 on: August 29, 2020, 03:43:16 PM »
And where would that go in the css?

Offline Antechinus

  • SMF Friend
  • SMF Master
  • *
  • Posts: 25,651
  • Master of BBC Abuse
Re: Lifestyle [Responsive]
« Reply #16 on: August 29, 2020, 06:16:41 PM »
At the end should work.

Offline LVMuse

  • Newbie
  • *
  • Posts: 6
Re: Lifestyle [Responsive]
« Reply #17 on: August 29, 2020, 06:19:46 PM »
Thanks!

Offline LVMuse

  • Newbie
  • *
  • Posts: 6
Re: Lifestyle [Responsive]
« Reply #18 on: August 29, 2020, 06:30:01 PM »
Nope, didn't work. It's not the hero image, that one is fine, it's the logo. Tried putting in #logo where .hero was and still no luck.

Offline Mick.

  • Customizer
  • SMF Hero
  • *
  • Posts: 5,423
  • Gender: Male
    • idesignSMF on Facebook
    • @idesign360 on Twitter
    • idesignSMF.com
Re: Lifestyle [Responsive]
« Reply #19 on: August 29, 2020, 06:32:55 PM »
It is a "cover" image. Meaning that the image will not shrink.....only the frame shrinks while the image stays centered. I've not tried @media when using background-size: cover;

Try it and see if it works out for ya.