Online/Offline border

[bennybernaer]

I have replaced my online icon with an online/offline border.

Now I only have the problem that my online/offiline border is always shown on the right.
And these should be alternating just like the messages.

Code: Select all

<!-- IF S_ONLINE --> online <!-- ELSE --> offline<!-- ENDIF -->

Code: Select all

.online, .offline {
    background-image: none;
    background-position: 100% 0;
    background-repeat: no-repeat;
}

Code: Select all

online {
    border-right: 5px solid #01AC00;
}
.offline {
    border-right: 5px solid #9C0003;
}

.

[Tastenplayer]

The stylesheet.css in theme language: en, nl, de etc. must be empty.

viewtopic_body.html

Code: Select all

<div id="p{postrow.POST_ID}" class="post has-profile <!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF postrow.S_POST_DELETED --> deleted<!-- ENDIF --><!-- IF postrow.S_ONLINE and not postrow.S_POST_HIDDEN --> online<!-- ELSE --> offline<!-- ENDIF --><!-- IF postrow.POSTER_WARNINGS --> warned<!-- ENDIF -->">

memberlist_view.html

Code: Select all

<div class="panel bg1<!-- IF S_ONLINE --> online<!-- ELSE --> offline<!-- ENDIF -->">

ucp_pm_viewmessage.html

Code: Select all

<div id="post-{MESSAGE_ID}" class="post pm has-profile<!-- IF S_POST_UNAPPROVED or S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF S_ONLINE --> online<!-- ELSE --> offline<!-- ENDIF -->">

remove in prosilver - colours.css

Code: Select all

.online {
	background-image: url("./en/icon_user_online.gif");
}

(hash in prosilver - stylesheet.css - colours - must be changed)

[bennybernaer]

The stylesheet.css in theme language: en, nl, de etc. must be empty.

viewtopic_body.html

Code: Select all

<div id="p{postrow.POST_ID}" class="post has-profile <!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF postrow.S_POST_DELETED --> deleted<!-- ENDIF --><!-- IF postrow.S_ONLINE and not postrow.S_POST_HIDDEN --> online<!-- ELSE --> offline<!-- ENDIF --><!-- IF postrow.POSTER_WARNINGS --> warned<!-- ENDIF -->">

memberlist_view.html

Code: Select all

<div class="panel bg1<!-- IF S_ONLINE --> online<!-- ELSE --> offline<!-- ENDIF -->">

ucp_pm_viewmessage.html

Code: Select all

<div id="post-{MESSAGE_ID}" class="post pm has-profile<!-- IF S_POST_UNAPPROVED or S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF S_ONLINE --> online<!-- ELSE --> offline<!-- ENDIF -->">

If I apply that rule in viewtopic then all my posts are on the same side again. They are meant to be alternated. But my online border must also be varied. Which is not the case now.

[Tastenplayer]

Oh, so you want the profile once on the left and once on the right. I misunderstood, sorry. I thought the profile on the left was wrong.
Unfortunately, I don't know what the code has to be, in this case.

[Brf]

is always shown on the right.

Code: Select all

.online, .offline {
   
    background-position: 100% 0;
 
}

Yes. That is what the 100% is -- right.
If you are using bg1 and bg2 to alternate your profiles, you should use the same class to change your online/offline.

[bennybernaer]

And how am I supposed to do that?

Code: Select all

	<div id="p{postrow.POST_ID}" class="post <!-- IF postrow.POST_NUMBER is odd --> switch-profile<!-- ENDIF --> has-profile <!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF postrow.S_POST_DELETED --> deleted<!-- ENDIF --><!-- IF postrow.S_ONLINE and not postrow.S_POST_HIDDEN --> online <!-- ELSE --> offline <!-- ENDIF --><!-- IF postrow.POSTER_WARNINGS --> warned<!-- ENDIF -->">

Code: Select all

.post .postprofile {
	margin: -5px -10px 10px 0;
	padding-top: 10px;
	padding-right: 10px;
}

.switch-profile .postbody {
	float: right;
}

.switch-profile .postprofile {
	float: left;
	padding-right: 0;
	border-width: 0 1px 0 0;
}

.post.switch-profile .postprofile dd, .post.switch-profile .postprofile dt {
	margin-left: 0;
	margin-right: 8px;
}

.post.online, .post.offline {
	background-image: none;
}

.post.online .postprofile {
	background-position: 100% 0;
	background-repeat: no-repeat;
}

Code: Select all

.online {
    border-right: 5px solid #01AC00;
}
.offline {
    border-right: 5px solid #E72E29;
}

[Brf]

If you are using .switch-profile, I am assuming you would want a ".switchprofile .online, .switchprofile .offline" and use 0, rather than 100%
If you don't understand how your left/right posts work, you should ask whomever gave you that style

[pit-PL]

Put this

Code: Select all

.switch-profile.online {
	border-right: 0;
    border-left: 5px solid #01AC00;
}
.switch-profile.offline {
	border-right: 0;
    border-left: 5px solid #01AC00;
}

after

Code: Select all

.offline {
    border-right: 5px solid #E72E29;
}

[bennybernaer]

Put this

Code: Select all

.switch-profile.online {
	border-right: 0;
    border-left: 5px solid #01AC00;
}
.switch-profile.offline {
	border-right: 0;
    border-left: 5px solid #01AC00;
}

after

Code: Select all

.offline {
    border-right: 5px solid #E72E29;
}

Thank you again!
Also is there a way to switch this not in the responsive part

[pit-PL]

Change

Code: Select all

.switch-profile.online {
	border-right: 0;
    border-left: 5px solid #01AC00;
}
.switch-profile.offline {
	border-right: 0;
    border-left: 5px solid #01AC00;
}

to

Code: Select all

@media (min-width: 700px) {
	.switch-profile.online {
		border-right: 0;
		border-left: 5px solid #01AC00;
	}

	.switch-profile.offline {
		border-right: 0;
		border-left: 5px solid #01AC00;
	}
}

@media (max-width: 700px) {
	.post.switch-profile .postprofile {
		margin: 0 0 5px 0;
		border-width: 0 0 1px 0;
	}

	.switch-profile .postbody, .switch-profile .postprofile {
		float: none;
	}
}

[bennybernaer]

They will now alternate, but on the left side they will always show as online. (Even if that person is not online.)

Because a subject from the same person is online in the first message on the left, the second message on the right is offline.

contenst.css

Code: Select all

/* Profielvelden wisselen 
----------------------------------------*/
.post .postprofile {
	margin: -5px -10px 10px 0;
	padding-top: 10px;
	padding-right: 10px;
}

.switch-profile .postbody {
	float: right;
}

.switch-profile .postprofile {
	float: left;
	padding-right: 0;
	border-width: 0 1px 0 0;
}

.post.switch-profile .postprofile dd, .post.switch-profile .postprofile dt {
	margin-left: 0;
	margin-right: 8px;
}

.post.online, .post.offline {
	background-image: none;
}

.post.online .postprofile {
	background-position: 100% 0;
	background-repeat: no-repeat;
}

colours.css

Code: Select all

.online {
    border-right: 5px solid #01AC00;
}
.offline {
    border-right: 5px solid #E72E29;
}
@media (min-width: 700px) {
	.switch-profile.online {
		border-right: 0;
		border-left: 5px solid #01AC00;
	}

	.switch-profile.offline {
		border-right: 0;
		border-left: 5px solid #01AC00;
	}
}

@media (max-width: 700px) {
	.post.switch-profile .postprofile {
		margin: 0 0 5px 0;
		border-width: 0 0 1px 0;
	}

	.switch-profile .postbody, .switch-profile .postprofile {
		float: none;
	}
}

If the border has not been changed, they are displayed correctly online/offline.

[pit-PL]

Code: Select all

@media (min-width: 700px) {
	.switch-profile.online {
		border-right: 0;
		border-left: 5px solid #01AC00;
	}

	.switch-profile.offline {
		border-right: 0;
		border-left: 5px solid #01AC00;
	}
}

Border color is the same for online and offline, sorry.

[bennybernaer]

Haha I hadn't even seen it. Thank you!