Online/offline image responsive problem with

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
Post Reply
User avatar
</Solidjeuh>
Registered User
Posts: 1788
Joined: Tue Mar 29, 2016 3:45 am
Location: Aalst (Belgium)
Name: Andy Dm
Contact:

Online/offline image responsive problem with

Post by </Solidjeuh> »

Hello,

Can someone please help me with this little problem?
I'm creating a style, and the online/offline image is overlapping stuff on "-700px width".

See: https://www.solidjeuh.be/scripts/phpbbt ... hp?f=2&t=1
And make the screen smaller.

Image

https://www.solidjeuh.be/scripts/phpbbt ... esheet.css
https://www.solidjeuh.be/scripts/phpbbt ... common.css
https://www.solidjeuh.be/scripts/phpbbt ... olours.css

Also, on profile view, the info bar is dark green when logged in
https://www.solidjeuh.be/scripts/phpbbt ... rofile&u=2
Image
And when logged out, it shows correct ..
Image

Style download: https://www.solidjeuh.be/scripts/summer.zip
User avatar
pit-PL
Registered User
Posts: 3104
Joined: Sat Nov 21, 2009 12:24 pm

Re: Online/offline image responsive problem with

Post by pit-PL »

background-size: 40px; in responsive.css
User avatar
</Solidjeuh>
Registered User
Posts: 1788
Joined: Tue Mar 29, 2016 3:45 am
Location: Aalst (Belgium)
Name: Andy Dm
Contact:

Re: Online/offline image responsive problem with

Post by </Solidjeuh> »

pit-PL wrote:
Mon Oct 15, 2018 5:41 pm
background-size: 40px; in responsive.css
Oh wow, thank you! Added responsive.css in the style now, and removed that line.
Thank you !! 1 problem solved :ugeek:

====== EDIT =======

Solved the other problem myself by adding background-repeat: repeat-y; into https://www.solidjeuh.be/scripts/phpbbt ... esheet.css

Thank you 4 the help! :)
User avatar
DTMWC
Registered User
Posts: 375
Joined: Tue Jan 16, 2018 6:17 am

Re: Online/offline image responsive problem with

Post by DTMWC »

Just an idea,

You could remove the online/offline images and replace them with a border, it would save settings sizes in the responsive setup.

Example:

Code: Select all

.online {
    background-image: url("./icon_user_online.gif");
    background-repeat: repeat-y;
}
Would become:

Code: Select all

.online {
    border-right: 2px solid #01AC00;
}

and:

Code: Select all

.offline {
    background-image: url("./icon_user_offline.gif");
    background-repeat: repeat-y;
}
Would become:

Code: Select all

.offline {
    border-right: 2px solid #9C0003;
}
If you use CodePen... Give @SMKS's Thank You NHS pen a like.
User avatar
</Solidjeuh>
Registered User
Posts: 1788
Joined: Tue Mar 29, 2016 3:45 am
Location: Aalst (Belgium)
Name: Andy Dm
Contact:

Re: Online/offline image responsive problem with

Post by </Solidjeuh> »

Ahaa yes that's a great idea! Will take this to the next version. Thx Dan Stylez!
Done on test forum: https://www.solidjeuh.be/scripts/phpbbt ... hp?f=2&t=3
User avatar
Tastenplayer
Registered User
Posts: 801
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: Online/offline image responsive problem with

Post by Tastenplayer »

You just have to make sure that the online/offline border is still visible in the responsive few. In my style blackfog, this was not the case at first.
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.2
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1019
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: Online/offline image responsive problem with

Post by Hanakin »

Or implement it they way we did in 3.3 and remove the image and instead us a green circle next to the user name when they are inline
User avatar
Tastenplayer
Registered User
Posts: 801
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: Online/offline image responsive problem with

Post by Tastenplayer »

It also works with the standard online image when you redye it. Then you have a triangle at the top instead of the border right. If you make the center transparent, you get a line top and right. Instead of a long border on the right.
online standard.jpg
online standard.jpg (29.93 KiB) Viewed 505 times
However, this solution has arisen because of another problem. Since I colored the background of the postprofile differently, there was no online picture to see, because it is now behind the postprofile. I don't know where and how I could change that. :)
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.2
Post Reply

Return to “[3.2.x] Styles Support & Discussion”