Register box
WSC 3.X.X
With this plugin will the "Register" and "Registered as" box get a different look.
A hover over the Register Box changes the icon.
The colors of the "registered as" box are controlled in Woltlab Core by the Status Infobox (see spoiler). We have maintained this.
The following code can be customized for the "Register" box.
If the colors deviate, can you adjusted them by an adjustment in the Theme settings.
The customization must be inserted in [tt]ACP > Customization > Theme > Your Style > Advanced Setting[/ tt].
The following code can be customized for the "Register" box.
.box[data-box-identifier="com.woltlab.wcf.RegisterButton"] {
background: rgba($wcfStatusInfoBackground, 1); // < changes the box background color
p::before {
content: "\f023"; // < changes the Icon
color: rgba($wcfStatusInfoBackground, 1);
background: rgba(darken($wcfStatusInfoBackground, 15%), 1); // < changes the icon background color
}
&:hover p::before {
content: "\f09c"; // < changes the Icon on hover
}
}The colors of the "registered as" box are controlled in Woltlab Core by the SideBar background color. We have maintained this.
The following code can be customized for the "Registered as" box.
.box[data-box-identifier="com.woltlab.wcf.SignedInAs"] {
.box96 {
&::before {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAPElEQVQoU2NkIA5IMRKhToqBgeEZIYVgRSDD8CmEK8KnEEURLoUYirApxKoIXSFORcgK8SqCKSSoCKQQAJD/CSUFonnJAAAAAElFTkSuQmCC) repeat, rgba(darken($wcfSidebarBackground, 20%), 1); // < change the box background color and the pattern
}
.userAvatarImage {
border: 5px solid rgba($wcfSidebarBackground, 1); // < change the Avatar border color
background: rgba($wcfSidebarBackground, 1); // < change the Avatar background color
}
.containerHeadline > h3 {
background: rgba(darken($wcfSidebarBackground, 15%), 1); // < change the Username background color
}
}
}
