ProCurve

[TwitchisMental]

Boss Twitch

Good lord don't call him that. It'll give him a big head. 

HA! I will keep that in mind 😂

[Steve]

 

[Gunstra]

Listed as dark/light mode both there is no dark mode with it

[Diego Andrés]

Perhaps the intention was to add Variants tag instead of Dark Mode.

[TwitchisMental]

Perhaps the intention was to add Variants tag instead of Dark Mode.

This is correct, I used the wrong tag. It simply has a blue and gray variant.

Updated the theme page with the proper tag.

[madskaizer]

Thank you TwitchisMental for a nice theme.

I wanted to add my custom icons for the boards. I found the guides here on forum on how to add to the css sheet, but its acting a bit weird. When I edit the index.css, the previewer shows my icons, but once I save its just blank spaces.

So I am a bit puzzled why that happens.

Besides commenting out the text based icons in you theme, I added these

#board_19 .board_icon a.board_on {
 background: url(../icons/generalchat_on.png);
}
#board_19 .board_icon a.board_off {
 background: url(../icons/generalchat_off.png);
}

Could you please guide me on how to add icons in your theme?

[TwitchisMental]

Thank you TwitchisMental for a nice theme.

I wanted to add my custom icons for the boards. I found the guides here on forum on how to add to the css sheet, but its acting a bit weird. When I edit the index.css, the previewer shows my icons, but once I save its just blank spaces.

So I am a bit puzzled why that happens.

Besides commenting out the text based icons in you theme, I added these

#board_19 .board_icon a.board_on {
 background: url(../icons/generalchat_on.png);
}
#board_19 .board_icon a.board_off {
 background: url(../icons/generalchat_off.png);
}

Could you please guide me on how to add icons in your theme?

You would probably need to comment out -

Code Select Expand

.board_icon a::before {
    display: inline;
    font-family: "Font Awesome 6 Free";
    font-size: 2em;
    content: "\f086";
}
.board_icon a.board_on::before {
    font-weight: 900;
}
.board_icon a.board_on2::before {
font-weight: 900;
}
.board_icon a.board_off::before {
font-weight: 400;
}
.board_icon a.board_redirect::before {
font-weight: 900;
content: "\f061";
}

[Kindred]

Also, turn off minification

[madskaizer]

Minified is found under (if someone else cant fint it ):
Admin --> Configuration --> Features and Options --> un-tick "Minimize CSS and JavaScript files"

I changed this:

Code Select Expand

/* Mads custom icon changes */
.board_icon {
   padding: 8px 4px 0px 14px;
   width: 60px;
}
.board_icon a {
   display: block;
   width: 32px;
   height: 32px;
}
/* Mads custom icon changes */
/*
.board_icon a:hover, .board_icon a:focus{
   text-decoration: none;
}
.board_icon a::before {
    display: inline;
    font-family: "Font Awesome 6 Free";
    font-size: 2em;
    content: "\f086";
}
.board_icon a.board_on::before {
    font-weight: 900;
}
.board_icon a.board_on2::before {
   font-weight: 900;
}
.board_icon a.board_off::before {
   font-weight: 400;
}
.board_icon a.board_redirect::before {
   font-weight: 900;
   content: "\f061";
}
*/
.boardindex_table .board_icon {
   width: 60px; /* Mads custom icon changes */
I added all my icons (example of some of them):

Code Select Expand

/* Mads custom icon changes */
#board_19 .board_on {
 background: url(../icons/generalchat_on.png);
}
#board_19 .board_off {
 background: url(../icons/generalchat_off.png);
}
#board_29 .board_on {
 background: url(../icons/laboratory_on.png);
}
#board_29 .board_off {
 background: url(../icons/laboratory_off.png);
}
#board_18 .board_on {
 background: url(../icons/science_on.png);
}
#board_18 .board_off {
 background: url(../icons/science_off.png);
}
#board_42 .board_on {
 background: url(../icons/admincontact_on.png);
}
#board_42 .board_off {
 background: url(../icons/admincontact_off.png);
}

and the preview looks just fine:
You cannot view this attachment.

but website shows no icons, but the changed css is in the code, I can find the exact changes in the index.css file linked:

Code Select Expand

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/ProCurve/css/index.css?smf214_1737380923">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/ProCurve/css/index_grey.css?smf214_1737380923">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/default/css/jquery.custom-scrollbar.css?smf214_1737380923">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.4.0/css/all.css">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/ProCurve/css/responsive.css?smf214_1737380923">
<style>
.postarea .bbc_img, .list_posts .bbc_img, .post .inner .bbc_img, form#reported_posts .bbc_img, #preview_body .bbc_img { max-width: min(100%,800px); }

.postarea .bbc_img, .list_posts .bbc_img, .post .inner .bbc_img, form#reported_posts .bbc_img, #preview_body .bbc_img { max-height: 800px; }

</style>
I had hope that removing minimize css would fix it, because im back at square one from yesterday
hxxp:highvoltageforum.net/index.php [nonactive]

[TwitchisMental]

Minified is found under (if someone else cant fint it ):
Admin --> Configuration --> Features and Options --> un-tick "Minimize CSS and JavaScript files"

I changed this:

Code Select Expand

/* Mads custom icon changes */
.board_icon {
   padding: 8px 4px 0px 14px;
   width: 60px;
}
.board_icon a {
   display: block;
   width: 32px;
   height: 32px;
}
/* Mads custom icon changes */
/*
.board_icon a:hover, .board_icon a:focus{
   text-decoration: none;
}
.board_icon a::before {
    display: inline;
    font-family: "Font Awesome 6 Free";
    font-size: 2em;
    content: "\f086";
}
.board_icon a.board_on::before {
    font-weight: 900;
}
.board_icon a.board_on2::before {
   font-weight: 900;
}
.board_icon a.board_off::before {
   font-weight: 400;
}
.board_icon a.board_redirect::before {
   font-weight: 900;
   content: "\f061";
}
*/
.boardindex_table .board_icon {
   width: 60px; /* Mads custom icon changes */
I added all my icons (example of some of them):

Code Select Expand

/* Mads custom icon changes */
#board_19 .board_on {
 background: url(../icons/generalchat_on.png);
}
#board_19 .board_off {
 background: url(../icons/generalchat_off.png);
}
#board_29 .board_on {
 background: url(../icons/laboratory_on.png);
}
#board_29 .board_off {
 background: url(../icons/laboratory_off.png);
}
#board_18 .board_on {
 background: url(../icons/science_on.png);
}
#board_18 .board_off {
 background: url(../icons/science_off.png);
}
#board_42 .board_on {
 background: url(../icons/admincontact_on.png);
}
#board_42 .board_off {
 background: url(../icons/admincontact_off.png);
}

and the preview looks just fine:
You cannot view this attachment.

but website shows no icons, but the changed css is in the code, I can find the exact changes in the index.css file linked:

Code Select Expand

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/ProCurve/css/index.css?smf214_1737380923">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/ProCurve/css/index_grey.css?smf214_1737380923">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/default/css/jquery.custom-scrollbar.css?smf214_1737380923">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.4.0/css/all.css">
<link rel="stylesheet" href="https://highvoltageforum.net/Themes/ProCurve/css/responsive.css?smf214_1737380923">
<style>
.postarea .bbc_img, .list_posts .bbc_img, .post .inner .bbc_img, form#reported_posts .bbc_img, #preview_body .bbc_img { max-width: min(100%,800px); }

.postarea .bbc_img, .list_posts .bbc_img, .post .inner .bbc_img, form#reported_posts .bbc_img, #preview_body .bbc_img { max-height: 800px; }

</style>
I had hope that removing minimize css would fix it, because im back at square one from yesterday
https://highvoltageforum.net/index.php

The way you have it currently it is looking for the image files in "/Themes/ProCurve/icons/"

I am assuming you put the icons in the default theme folder.

[madskaizer]

Ahh its always something simple like a missing ; or syntax, the preview simply got me fooled into thinking that the path was correct. Icons are placed in the root of domain, /icons/ folder.

But fixing the path and it now shows, also in your theme, and in preview

Thank you for the support.

[TwitchisMental]

Ahh its always something simple like a missing ; or syntax, the preview simply got me fooled into thinking that the path was correct. Icons are placed in the root of domain, /icons/ folder.

But fixing the path and it now shows, also in your theme, and in preview

Thank you for the support.

Always happy to help.