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: 1084
Joined: Tue Mar 29, 2016 3:45 am
Location: Aalst (Belgium)
Name: Andy Dm
Contact:

Online/offline image responsive problem with

Post by </Solidjeuh> » Mon Oct 15, 2018 3:17 pm

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
We offer fun HTML5 games for young and old.
Register a free account & enjoy all functions!
Save your score, challenge other members or play along with our tournaments.


~~~ https://www.solidjeuh.be ~~~

User avatar
pit-PL
Registered User
Posts: 3069
Joined: Sat Nov 21, 2009 12:24 pm

Re: Online/offline image responsive problem with

Post by pit-PL » Mon Oct 15, 2018 5:41 pm

background-size: 40px; in responsive.css

User avatar
</Solidjeuh>
Registered User
Posts: 1084
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> » Mon Oct 15, 2018 5:53 pm

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! :)
We offer fun HTML5 games for young and old.
Register a free account & enjoy all functions!
Save your score, challenge other members or play along with our tournaments.


~~~ https://www.solidjeuh.be ~~~

User avatar
Dan Stylez
Registered User
Posts: 183
Joined: Tue Jan 16, 2018 6:17 am
Contact:

Re: Online/offline image responsive problem with

Post by Dan Stylez » Mon Oct 15, 2018 8:15 pm

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;
}

User avatar
</Solidjeuh>
Registered User
Posts: 1084
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> » Mon Oct 15, 2018 9:42 pm

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
We offer fun HTML5 games for young and old.
Register a free account & enjoy all functions!
Save your score, challenge other members or play along with our tournaments.


~~~ https://www.solidjeuh.be ~~~

User avatar
Tastenplayer
Registered User
Posts: 148
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: Online/offline image responsive problem with

Post by Tastenplayer » Thu Nov 01, 2018 12:34 pm

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.
Startpage to my forum and portal:https://www.my-tastenworld.ch
Fun experiment: Simple 3D Style [BETA] https://www.forum.my-tastenworld.ch/vie ... 244&t=3205
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. The best online Translator

User avatar
Hanakin
Infrastructure Team Member
Infrastructure Team Member
Posts: 740
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: Online/offline image responsive problem with

Post by Hanakin » Thu Nov 01, 2018 3:51 pm

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: 148
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: Online/offline image responsive problem with

Post by Tastenplayer » Tue Nov 13, 2018 5:51 pm

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 111 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. :)
Startpage to my forum and portal:https://www.my-tastenworld.ch
Fun experiment: Simple 3D Style [BETA] https://www.forum.my-tastenworld.ch/vie ... 244&t=3205
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. The best online Translator

Post Reply

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

Who is online

Users browsing this forum: No registered users and 77 guests