Wolf Play : Custom Palette CSS styles
Chatbox
 Demmy-Lord
08:04:33 
Induce labor and make it the minimum labor time would be rad
 Rogue Wildfires
08:04:27 Mac and Cheese
Pixie,
Isn't labor between 80 and 96 hours?
 Existence
08:02:46 Exist / Kuskyn
-WP Click-
Oh I forgot you existed c.c
 Vulpixles
08:02:28 Pixie, Vul | ♈
Rogue

No, not send them into labor early. They have to be in the labor window. But I want to be able to send them into labor at the beginning of the labor window so I'm not waiting an extra 10 hours for them to give birth
 Boo
08:02:20 Chrissy
an induce labour item would be cool.
 Rogue Wildfires
08:00:58 Mac and Cheese
Pixie,
Like if your wolf is at 80 hours you just send it into labor early?
 Cortex
08:00:55 Tex,Core,Shade,They
Hey chat!
 Vulpixles
08:00:54 Pixie, Vul | ♈
I hate my girls make me want until they are 90+ hours before finally going into labor. I want to be able to force them into labor at 82 hours
 Existence
07:59:33 Exist / Kuskyn
Toucan feathers are my saving grace when I don't want to wait out labors xxD
 Vulpixles
07:59:29 Pixie, Vul | ♈
That makes your wolf give birth when they are already in labor. I want to be able to send my wolves INTO labor
 Rogue Wildfires
07:59:08 Mac and Cheese
Toucan Feather

This feather will cause a wolf to give birth if she is in labor. Who needs labor pains? Found in the Jungle.
 Rogue Wildfires
07:58:46 Mac and Cheese
Pixie,
Toucan Feathers
 Vulpixles
07:58:28 Pixie, Vul | ♈
Rogue

No, that just makes your wolf give birth at any time. I want an item that sends your wolf into labor when they are in the labor window
 Rogue Wildfires
07:57:45 Mac and Cheese
Pixie,

Fertility Figurine
Your pregnant wolf gives birth now.

2 apples
 Vulpixles
07:56:46 Pixie, Vul | ♈
Dragon

This is why I want an item that sends wolves into labor
 Dragons Blood
07:56:02 Yong-sun (he/him)
-WP Click-

release the pups now
 Rogue Wildfires
07:54:33 Mac and Cheese
*Good
 Rogue Wildfires
07:54:27 Mac and Cheese
Someone give me a god name for a wolf OC
 Existence
07:52:07 Exist / Kuskyn
Golden I like the middle outfit classy~~
 Golden Meadows
07:48:14 Ollie, Gold
Thoughts so far? :)
-Click-

Refresh

You must be a registered member for more
than 1 day before you can use our chatbox.
Quests
Alliance Battles
Challenges

Hourly Damage Variances
Red Fox : +1
Bobcat : -2
Black Bear : +2
    Fall   Day  Weather:  Sunny
 


Forums

→ Wolf Play is a fun game! Sign Up Now!

My Subscriptions
My Bookmarks
My Topics
Latest Topics
Following
Forums > Member Help > Guides
   1    2    3    4   ..   40 

   Custom Palette CSS stylesFebruary 8, 2020 02:55 PM


Vennenum

Game Moderator
Darkseeker
 
Posts: 5702
#1822533
Give Award

11

This is not a guide on how to code CSS. The internet has plenty of CSS guides if you'd like to learn how it works.

I've added a description of the different selectors and tags listed in the default palette template. Some of this code has also been re-arranged so similar things are located next to each other. If you understand a tad bit of CSS, this should help you code some palettes.

Let me know if you'd like me to supply some of my favorite apps/websites to code. I'm happy to help!


/*--------------------------------------------------
Set overall site colors
--------------------------------------------------*/
/*Primary = Navbar & Sidebar Colors,*/
.primary {
background-color:#455b2e;
}

/*Secondary = Weather & Mushrooms Infobar Color */
.secondary {
background-color:#667f4d;
}

/*Tertiary = Denpage Buttons & Folders; Forum Trim*/
.tertiary {
background-color:#8aa275;
}

/*Forum Alternate Colors*/
.quatro {
background-color:#efecc8;
}

.forumalt {
background-color:#000000
}

/*--------------------------------------------------
For Quotes in the Forums
--------------------------------------------------*/

blockquote {
background-color:#efecc8;
border-left: 3px solid #8aa275;
}

/*--------------------------------------------------
Chat Colors
--------------------------------------------------*/

.main {
background-color:#b8cca7;
}

.sales {
background-color:#efecc8;
}

/*--------------------------------------------------
Den colors for the Wolf listing
--------------------------------------------------*/

/* Box that contains Wolf Name & Dom */
.wolfheader {
background-color:#fffbcd;
}

/* Box that includes Health/Hunger Bar */
.wolfinfo {
background-color:#beb26c;
}

/*--------------------------------------------------
Page background color
--------------------------------------------------*/

.pgbg {
background-color:#f8f5da;
}

/*--------------------------------------------------
Page Name text
--------------------------------------------------*/

/* Titles on each page including "DEN", "EXPLORE", "FORUMS" */

.headline {
color:#263408;
}

/*--------------------------------------------------
Color setting for decor/gear/food boxes
--------------------------------------------------*/
.imgcustom {
background-color:#f6edb7;
}

/*--------------------------------------------------
Set the tab color in your Den
--------------------------------------------------*/

/* Navigation Menu Color */
.navbar a:hover, .dropdown:hover .dropbtn {
background-color: #8aa275;
}

/*--------------------------------------------------
Set the color and font of the menu bar text
--------------------------------------------------*/

/* Navigation Bar Text Color */
.navbar a {
font-family:arial,sans-serif;
color:#f8f5da;
}

/* Navigation DropDown Text Color */
.dropdown .dropbtn {
color:#f8f5da;
}

/* Dropdown Menu Text Color */
.dropdown-content a {
color:#000;
}

/*--------------------------------------------------
Set the tab color for the tabs under your Mailbox
--------------------------------------------------*/
/* Unselected Tabs Colors */
ul.tabbernav li a {
background: #92a882;
}

/* Container BG*/
.tabberlive .tabbertab {
background-color: #efecc8;
}

/* Unselected Tab Hover Colors */
ul.tabbernav li a:hover {
background: #efecc8;
}

/* Active Tab Color */
ul.tabbernav li.tabberactive a {
background-color: #efecc8;
}

/* Active Tab Hover Color */
ul.tabbernav li.tabberactive a:hover {
background-color: #efecc8;
}

/*--------------------------------------------------
Set the form color {includes chat textbox and mailpage textbox}
--------------------------------------------------*/

.iclass {background-color:#c8d4bd; color:#000000; -moz-border-radius: 7px;
border-radius: 7px;}


/*--------------------------------------------------
Set the color of the text in the side bar
--------------------------------------------------*/

.sidebartext { font-family:arial,sans-serif; font-size:15px; color:#dfdcbd; }

/*Links*/
.sidebartext a:link { font-family:arial,sans-serif; font-size:15px; color:#dfdcbd;}
.sidebartext a:hover { font-family:arial,sans-serif; font-size:15px; color:#bdb570;}
.sidebartext a:visited { font-family:arial,sans-serif; font-size:15px; color:#dfdcbd;}

/*--------------------------------------------------
Set the color of the text on the site
--------------------------------------------------*/

.mainlineblack{ font-family:arial,sans-serif; font-size:15px; color:#000; }

.mainlineblack a:link { font-family:arial,sans-serif; font-size:15px; color:#000;}
.mainlineblack a:hover { font-family:arial,sans-serif; font-size:15px; color:#4f2907;}
.mainlineblack a:visited { font-family:arial,sans-serif; font-size:15px; color:#000;}


/*--------------------------------------------------
Set the color of error/valid message after you submit an action
--------------------------------------------------*/

.errormsg {
background-color:#f3d1cc;
}

.validmsg {
background-color:#d7e8d2;
}

/*--------------------------------------------------

WP Buttons

--------------------------------------------------*/

.wpbutton { font-family:arial,sans-serif; font-size:15px; color:#000000; background-color:rgba(0,0,0,0); padding:0px; border:0px; border-radius:0px; border: 0px solid #000000; }
.wpbutton a:link { font-family:arial,sans-serif; font-size:15px; color:#000000; background-color:rgba(0,0,0,0); padding:0px; }

.wpbutton a:visited { font-family:arial,sans-serif; font-size:15px; color:#000000; background-color:rgba(0,0,0,0); padding:0px; }
.wpbutton a:hover { font-family:arial,sans-serif; font-size:15px; color:#000000; background-color:rgba(0,0,0,0); padding:0px; }

Edited at October 20, 2022 01:38 AM by Vennenum
   Custom Palette CSS stylesMarch 19, 2020 01:58 AM


Vennenum

Game Moderator
Darkseeker
 
Posts: 5702
#1877776
Give Award

1

Additional Fun Codes:

What it does: Code:
Denpage Buttons Hover Color .tertiary button:hover {
background-color:#F4acb7;}
Change your chat text color: .smalltextblack {
color: #055474 }
Changing tree background (daytime BG) .daybody {
background: #262936;
}
Changing tree background (nighttime BG) .nightbody {
background: #2e3141;
}
Wolfplay Header Image .mainscreen5 {
background: #000000;
}
Changing pack name style in chat .bsmalltext a:link {
color: # }
Changing link colors in chat .smalltextblack a:link {
color: #03384D;
Hide an element visibility:hidden;
OR
display:none;
All of these are just a fun collection of things everyone has found over the years. You can definitely do more than this, but I would only recommend using them when you've become more advanced with CSS. And by that time, you probably don't even need this guide. ;D

Edited at September 8, 2024 07:19 PM by Vennenum
Custom Palette CSS stylesMarch 19, 2020 09:12 AM


teddy

Lightbringer
 
Posts: 1649
#1878000
Give Award
Thank you! May I ask how to change the header image and the hind trees?
Custom Palette CSS stylesApril 8, 2020 08:45 PM


Pandemonium

Darkseeker
 
Posts: 434
#1924698
Give Award
Curious as to how to get the gradient in the headings as you do on your palette Venn? Also how do I change the colour of the background on the Info, About this Pack, Featured Wolf, Wolves and such?
Custom Palette CSS stylesApril 9, 2020 12:59 AM


Vennenum

Game Moderator
Darkseeker
 
Posts: 5702
#1925225
Give Award
Pandemonium said:
Curious as to how to get the gradient in the headings as you do on your palette Venn?

For gradients:

.primary {
background-color: #05668D;
background-image: linear-gradient(rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 1));
}

For this code: rgba(0, 0, 0, 0.25)

The first three values are your color's RGB values. The fourth value is your opacity.

rgba(R, G, B, 0.25)

Pandemonium said:
How do I change the colour of the background on the Info, About this Pack, Featured Wolf, Wolves and such?

As far as I know, there's no option to do that right now. You're welcome to make the suggestion though.


Edited at April 9, 2020 01:00 AM by Vennenum
Custom Palette CSS stylesApril 9, 2020 05:35 AM


Pandemonium

Darkseeker
 
Posts: 434
#1925399
Give Award
Thanks Venn!
Custom Palette CSS stylesApril 9, 2020 03:01 PM


Dash Attacked

Lightbringer
 
Posts: 5580
#1926480
Give Award
Edit: Ignore, I figured it out :)

Edited at April 9, 2020 03:04 PM by Dash Attacked
Custom Palette CSS stylesApril 12, 2020 02:16 PM


Wilverbeast

Lightbringer
 
Posts: 5822
#1934703
Give Award
.bsmalltext {
font-family:
color: # }

Is the coding to change the text of people's nicknames/message time in chat :)

.mainline {
font-family:
color: #}
Is the coding to change the info on your den page like pack number, join date, active date, membership, etc.

Edited at April 12, 2020 02:25 PM by Wilverbeast
Custom Palette CSS stylesApril 21, 2020 05:05 PM


Ciao

Darkseeker
 
Posts: 4519
#1961486
Give Award
What would the coding be for the wording under your wolves name? (So the rank, amount of dominance, gender and age)
I cant seem to figure it out <.<

Custom Palette CSS stylesApril 21, 2020 07:55 PM


Vennenum

Game Moderator
Darkseeker
 
Posts: 5702
#1961945
Give Award
Ciao!- Try
.mainlinegr {
color: #000000;
}

Forums > Member Help > Guides
   1    2    3    4   ..   40 

Refresh










Copyright ©2013-2024 Go Go Gatsby Designs, LLC    All Rights Reserved
Terms Of Use  |   Privacy Policy   |   DMCA   |   Contact Us