Forum Thread

[Stylish] How to edit the style of PH

Forum-Index → Help → Guides → [Stylish] How to edit the style of PH

LeChatBox

OFFLINE
Trainerlevel: 78

Forum Posts: 1,361

                                                Posted: Fri, 17/02/2017 09:36                                                (7 Years ago)
                                            

I had 2 questions now It's only one :x

1) are you using hexcode or the name of the color? 0:

EDIT:

This is what I basically did (changed it up b/c I deleted the first one after screenshotting the img)

#party_field {
background: linear-gradient(palegreen, mediumseagreen, forestgreen)
}

and my browser is Chrome :x

[[NA: Iradius | League]]
~~~
[NA: LeChatBox#1244 | HotS]
[FR]
[Quests] || [Etc]
~~~

nsfw

OFFLINE
Trainerlevel: 44

Forum Posts: 1,268

                                                Posted: Fri, 17/02/2017 09:42                                                (7 Years ago)
                                            

@Morrowind
Tried it now!
You can do it with the following code as well :

#party_field {
background-image: linear-gradient(color1, color2)
}

color1 being the top color, color2 being the bottom.

example:

#party_field {
background-image: linear-gradient(#000000, #696969)
}

BritneyMc0206

OFFLINE
Trainerlevel: 39

Forum Posts: 52

                                                Posted: Wed, 22/02/2017 08:50                                                (7 Years ago)
                                            

I finally managed to completely edit my Pokeheroes view, & I found some codes that hasn't been listed yet. I've been using Stylus (another version of Stylis) so my codes might be different from others.

Show hidden content

body {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
min-height: 100%!important;
color: white!important;
}
table#battle td {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
}
font {
font-family: "Comic Sans MS";
}
a,
.uiLinkButtonInput {
font-size: 12px !important;
color: white!important;
text-shadow: 1px 1px 1px grey!important;
font-family: "Comic Sans MS";
}
#daily_reward_box {
position: fixed;
left: 50%;
margin-left: -300px;
top: 50%;
margin-top: -175px;
width: 600px;
height: 350px;
z-index: 100;
border: 1px solid white!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
opacity: 0.95;
color: white!important;
font-family: "Comic Sans MS";
}
#daily_money_box {
width: 100px;
padding: 20px 0px;
border: 1px solid white!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat) !important;
margin-left: 5px;
margin-right: 5px;
font-size: 12pt;
font-weight: bold;
text-align: center;
color: white!important;
}
#header .banner {
background: url(https://static.tumblr.com/14d67ba2617554c502858505502e1f7c/kznkqz3/1Bonkjohw/tumblr_static_4etph92tw9kwc88s0sw88osgg.gif)!important;
background-size: auto!important;
border: 1px solid white!important;
font-family: "Comic Sans MS";
border-radius: 25px!important;
}
#main {
background: url(https://orig15.deviantart.net/e53c/f/2014/191/b/d/shinyumbreon_by_theblacksavior-d7q64ol.jpg);
background-size: auto;
border: 1px solid white!important;
font-family: "Comic Sans MS";
border-radius: 25px!important;
}
#userbar {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat) !important;
border: 1px solid white!important;
font-weight: bold!important;
color: white!important;
font-size: 14px!important;
font-family: "Comic Sans MS"
}
#userp_box {
background: transparent;
color: white!important;
border: 1px solid white!important;
}
#userp_top {
position: relative;
width: 95%;
left: 2.5%;
margin-left: -15px;
padding: 15px;
border: 1.5px solid white!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif) repeat-x!important;
}
#userp_box {
position: relative;
width: 88%;
left: 6%;
margin-left: -15px;
margin-top: 15px;
padding: 15px;
padding-top: 5px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
font-size: 11px;
box-shadow: 1px 1px 1px 1px grey!important;
}
#userp_box th {
font-size: 12px;
border: 1px solid white!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
padding: 4px;
}
#userp_box td {
font-size: 11px;
border: 1px solid white!important;
background: transparent!important;
padding: 4px;
text-align: center;
vertical-align: middle;
}
#userp_feed1 {
background: transparent url(feed1_fade.png) repeat-x!important;
color: white!important;
}
#userp_feed2 {
background: transparent url(feed1_fade.png) repeat-x!important;
color: white!important;
}
#viewItemWindow {
position: absolute;
z-index: 4;
width: 450px;
height: 350px;
margin-left: 80px;
margin-top: 180px;
background: rgba(0, 0, 0, 0.8)!important;
}
#nav_button {
height: 38px;
cursor: pointer;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
min-height: 100%!important;
color: white!important;
border: 1px solid white!important;
}
#subnav {
position: absolute;
width: 425px;
padding: 8px;
padding-top: 0;
opacity: 0.5;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
font-family: "Comic Sans MS"
}
#party_box {
width: 95% !important;
position: relative!important;
left: 2.5%!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
padding: 3px!important;
min-height: 100px!important;
border-radius: 25px!important;
font-family: "Comic Sans MS"
}
td.main {
vertical-align: top;
color: white!important;
font-family: "Comic Sans MS";
font-size: 12px;
}
td {
font-size: 12px;
vertical-align: top;
}
.nav_button {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
font-size: 16pt;
color: white!important;
text-align: center;
}
.tradeUnitBox .inner {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
}
.tradeUnitBox {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
}
.widget2 {
position: absolute;
top: 0;
left: 100%;
margin-top: 5px;
margin-left: -114px;
width: 105px;
height: 52px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
border-radius: 25px!important;
cursor: pointer;
}
.widget4 {
position: absolute;
top: 0;
left: 100%;
margin-top: 70px;
margin-left: -70px;
width: 60px;
height: 52px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
border-radius: 25px!important;
cursor: pointer;
}
.rodBaitSelector {
position: absolute;
z-index: 15;
width: 80%;
height: 50%;
left: 15%;
top: 20%;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
border-radius: 25px!important;
padding: 8px;
}
.fishBag {
position: absolute;
z-index: 15;
overflow: auto;
width: 81%;
height: 70%;
left: 2%;
top: 20%;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
border-radius: 25px!important;
padding: 8px;
}
.blackfish {
background: rgba(255, 255, 255, 0.8)!important;
border-radius: 25px!important;
}
.rodcountdown {
color: black!important;
}
.rodbar {
background: yellow!important;
}
.catchInterface {
position: absolute;
z-index: 10;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8)!important;
display: block;
}
.brownBerryInterface {
display: none;
position: fixed;
z-index: 100;
height: 500px;
width: 400px;
top: 50%;
margin-top: -250px;
left: 50%;
margin-left: -200px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
color: white!important;
}
.small_rounded {
background: url(http://orig15.deviantart.net/e53c/f/2014/191/b/d/shinyumbreon_by_theblacksavior-d7q64ol.jpg) rgba(0, 0, 0, 0.8)!important;
color: white!important;
border: 1px solid white!important;
}
.sellInterface {
float: right;
width: 45%;
background: rgba(0, 0, 0, 0.8)!important;
margin-top: 30px;
padding: 10px;
line-height: 14pt;
}
.inbox_button {
width: 40%;
position: relative;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
float: left;
margin-left: 20px;
padding: 7px;
border: 1px solid;
line-height: 18px;
margin-top: 15px;
cursor: pointer;
}
.inbox_button:hover {
display: block;
opacity: 1;
}
.retrieve_screen {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
z-index: 2;
text-align: center;
font-weight: bold;
font-size: 20pt;
line-height: normal;
}
img#userp_thumbnail {
border: 1.5px solid;
margin-left: 5px;
box-shadow: 2px 2px 2px grey!important;
}
img#userp_thumbnail e {
height: 110 !important;
width: 75 !important;
padding-left: 125px !important;
padding-top: 25px !important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat) no-repeat!important;
border-radius: 25px;
color: red!important;
}
span.userp_username {
font-size: 22px;
font-weight: bold;
color: white!important;
}
h2.userp_box {
font-size: 18px;
border-bottom: 2px solid;
color: white!important;
}
div.subnav {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
background-repeat: no-repeat!important;
background-size: contain!important;
color: white!important;
font-size: 11pt;
}
div.slim_scroll {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
}
div.dropDownFeed {
position: absolute;
right: 2px;
border: 1px solid white!important;
border-radius: 25px!important;
margin-top: 15px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
min-width: 180px;
display: none;
opacity: 1!important;
}
div.dropDownFeed div.inner {
border: none!important;
border-radius: 25px!important;
padding: 6px;
cursor: pointer;
}
div.dropDownFeed div.inner:hover {
background: rgba(0, 0, 0, 1);
border-radius: 25px!important;
}
td#navelement:hover #subnav {
display: block;
opacity: 1;
}
td#navelement:hover #nav_button {
-webkit-opacity: 0.98;
-moz-opacity: 0.98;
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-ms-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
transition: opacity 0.5s ease;
opacity: 0.5;
height: 38px;
}
#friend_bar {
position: fixed;
width: 200px;
height: 100%;
left: 100%;
top: 0;
margin-left: -200px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif);
z-index: 75;
overflow-x: hidden;
overflow-y: auto;
border-left: 1px solid white!important;
display: none;
font-family: "Comic Sans MS"
}
#friend_bar::-webkit-scrollbar {
width: 0px;
}
#friend_bar a {
display: inline-block;
width: 100%;
height: 40px;
padding: 5px;
text-decoration: none;
vertical-align: middle;
border-bottom: 1px solid white!important;
background: transparent;
}
#friend_bar a:hover {
background: black;
}
#friend_bar a img {
max-width: 40px;
max-height: 40px;
font-size: 8pt;
}
#friend_bar span.img {
width: 50px;
float: left;
}
#friend_bar a span.last_msg {
font-weight: normal;
color: white!important;
font-size: 7pt;
font-style: italic;
}
#friend_bar input {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
position: fixed;
top: 100%;
left: 100%;
margin-left: -200px;
height: 24px;
margin-top: -30px;
width: 200px;
}
#private_chat {
position: fixed;
top: 100%;
left: 100%;
width: 300px;
margin-left: -650px;
height: 350px;
margin-top: -350px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif);
background-size: auto;
border: 1px solid white!important;
z-index: 70;
overflow: hidden;
display: none;
}
#private_chat div.chat_head {
width: 100%;
height: 16px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
position: absolute;
top: 0;
left: 0;
font-weight: bold;
color: white!important;
padding: 6px;
padding-top: 10px;
}
#private_chat div.chat_inner {
margin-top: 32px;
height: 274px;
overflow-y: auto;
overflow-x: hidden;
position: relative;
}
#private_chat div.chat_msg {
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
padding: 4px;
font-size: 8pt;
color: white!important;
min-height: 25px;
position: relative;
margin-top: 3px;
line-height: 18px;
}
#private_chat div.user_ava {
position: absolute;
left: 0;
top: 0;
margin-left: 4px;
float: left;
height: auto;
}
#private_chat div.user_ava img {
max-width: 25px;
max-height: 25px;
}
#private_chat div.chat_txt {
position: relative;
margin-left: 30px;
}
#private_chat textarea {
margin-top: 4px;
margin-left: 4px;
height: 24px;
width: 85%;
background: transparent!important;
color: white!important;
}
#party_field {
position: relative;
width: 150px;
height: 200px;
margin-left: 20px;
margin-top: 10px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
border: 1px solid white!important;
padding: 7px;
text-align: center;
}
#greenfield {
width: 90%;
position: relative;
left: 5%;
padding: 6px;
font-weight: bold;
margin-bottom: 7px;
text-align: center;
}
#redfield {
width: 90%;
position: relative;
left: 5%;
border-radius: 25px;
padding: 6px;
font-weight: bold;
margin-bottom: 7px;
text-align: center;
}
table#blue_table th {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px outset white!important;
padding: 2px;
text-align: center;
color: white!important;
}
table#blue_table td {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif);
border: 1px outset white!important;
padding: 2px;
padding-top: 2px;
padding-bottom: 2px;
text-align: center;
vertical-align: middle;
color: white!important;
font-family: "Comic Sans MS";
}
#pkmn_select_fixed {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white;
}
#storage_box {
width: 100%;
height: 500px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
padding-top: 15px;
color: white!important;
}
#storage_box #pkmn_sel_list {
width: 100%;
height: 100%;
max-height: 460px;
background: transparent!important;
overflow-y: scroll;
overflow-x: hidden;
}
#storage_box #st_headline {
height: 100%;
width: 90%;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
border-radius: 25px;
font-weight: bold;
font-size: 12pt;
padding: 5px;
padding-left: 15px;
}
#box_select {
width: 170px;
height: 348px;
padding: 5px;
border: 1px solid white!important;
border-radius: 25px;
background: transparent!important;
color: white!important;
overflow-y: auto;
line-height: 19px;
margin-left: 5px;
}
#pkmn_storage_small {
position: relative;
width: 280px;
height: 350px;
padding: 5px;
border: 1px solid white!important;
background: transparent!important;
color: white!important;
}
#pkmn_storage_info {
position: relative;
margin-top: 3px;
width: 95%;
min-height: 100px;
padding: 5px;
padding-top: 10px;
padding-left: 20px;
border: 1px solid white!important;
background: transparent!important;
color: white!important;
text-align: left;
}
#pkmn_profile {
width: 270px;
padding: 10px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
}
#pkmn_pic {
position: absolute;
width: 96px;
height: 96px;
border: 1px solid white!important;
z-index: 2;
text-align: center;
}
#storage_box button {
border-radius: 25px;
font-weight: bold;
color: red;
text-shadow: 1px 1px grey!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)repeat-x!important;
border: 1px solid white!important;
cursor: pointer;
font-family: "Comic Sans MS"
}
#profile_bar {
position: absolute;
margin-left: 80px;
padding: 5px 0px;
padding-left: 25px;
width: 150px;
height: 18px;
border: 1px double white!important;
background: transparent!important;
z-index: 1;
font-weight: bold;
color: white!important;
font-size: 10px;
}
td.poketable1 {
font-size: 11px;
font-weight: bold;
padding: 4px;
width: 110px;
height: 20px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
color: white!important;
background: transparent!important;
}
td.poketable2 {
font-size: 11px;
font-weight: bold;
padding: 4px;
width: 110px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
color: white!important;
background-color: transparent!important;
}
td.feed_text {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
min-height: 50px;
padding: 2px;
color: white!important;
font-size: 8pt;
border-radius: 25px;
}
div.right_box {
width: 100%!important;
position: relative!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
padding: 3px!important;
margin-top: 15px!important;
min-height: 80px!important;
border-radius: 25px!important;
}
li.filter {
border-radius: 25px;
border: 1px outset white!important;
list-style: none outside none;
margin: 0!important;
padding: 6px!important;
margin-left: -40px!important;
margin-bottom: 5px!important;
font-size: 14px!important;
font-weight: bold!important;
cursor: pointer!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
}
user agent stylesheetli {
display: list-item;
text-align: match-parent;
}
.tabcontent {
display: none;
border: 1px solid white;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
z-index: 2;
margin-top: -2px;
padding: 10px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
behavior: url(border-radius.htc);
position: relative;
}
.tabselect {
border: 1px solid white;
border-bottom: 0;
-moz-border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
z-index: 1;
cursor: pointer;
display: inline-block;
padding: 5px;
padding-bottom: 10px;
font-weight: bold;
margin-left: 5px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
position: relative;
opacity: 0.7;
}
#blue_box {
width: 90%;
left: 5%;
padding: 15px;
margin-left: -7.5px;
position: relative;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
box-shadow: 2px 2px 2px grey!important;
}
div#wondercard {
background: #77acec;
width: 290px;
height: 160px;
position: relative;
overflow: hidden;
color: white;
cursor: pointer;
border-radius: 25px;
}
div.wondercardInnerLayer {
position: absolute;
width: 100%;
height: 100%;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
}
div.wondercardStatistic {
width: 125px;
height: 100px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
text-align: center;
padding: 10px;
font-weight: bold;
border-radius: 25px;
border: 1px solid white!important;
}
div.cardNumberWrapper {
border-radius: 100px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
width: 70px;
height: 70px;
margin-left: -30px;
margin-top: -30px;
position: absolute;
line-height: 25px;
border: 1px solid white!important;
}
.tradebox {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
display: inline-block;
padding: 8px;
width: 285px;
min-height: 145px;
margin-right: 8px;
margin-bottom: 8px;
border-radius: 25px;
border: 1px solid white!important;
}
.tradebox a.button {
display: inline-block;
padding: 4px 10px;
margin: 0px 6px;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
text-decoration: none;
min-width: 50px;
border: 1px solid white!important;
}
#golden_slot {
background-image: url(img/golden_slot/golden_slot_bg.png);
background-repeat: no-repeat;
width: 500px;
height: 300px;
position: relative;
left: 50%;
margin-left: -250px;
margin-top: 15px;
border: 1px solid white!important;
}
#ranklist th {
font-size: 12px;
border: 1px solid white!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
padding: 4px;
}
#ranklist td {
font-size: 11px;
border: 1px solid white!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
padding: 4px;
text-align: center;
vertical-align: middle;
}
table#feeds {
margin-top: -21px;
margin-left: -2%;
width: 102%;
position: relative;
color: white!important;
}
button {
box-shadow: 1px 1px 1px 1px grey!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
border-radius: 25px;
text-indent: 0px;
border: 1px solid white!important;
display: inline-block;
color: white!important;
font-size: 14px;
font-weight: bold;
font-style: normal;
height: 28px;
line-height: 28px;
padding: 0px 16px;
text-decoration: none;
text-align: center;
text-shadow: 1px 1px 1px grey!important;
cursor: pointer;
}
.button:hover {
background: transparent!important;
}
button:active {
position: relative;
top: 1px;
}
#left_box input[type="submit"] {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border-radius: 25px!important;
border: 1px solid white!important;
color: white!important;
font-family: "Comic Sans MS";
}
input[type="submit"] {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border-radius: 25px;
border: 1px solid white!important;
color: white!important;
text-align: center;
font-family: "Comic Sans MS";
cursor: pointer;
}
input[type="submit"]:active {
position: relative;
top: 1px;
}
input:not([type="submit"]):focus {
background: transparent!important;
}
input[type="text"],
input[type="number"],
input[type="password"],
select,
textarea {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
padding: 4px;
font-family: inherit;
color: #4286f4;
border: 1px solid white!important;
border-radius: 25px!important;
}
textarea {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white;
border: 1px solid white!important;
border-radius: 25px!important;
}
table#battle_table td.pkmn_field {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px inset white!important;
padding: 2px;
}
div.battle_add {
width: 85%;
height: 95%;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
margin: 8px;
float: right;
border: 1px outset white!important;
}
#big_button {
width: 130px;
height: 130px;
background: url(https://media.giphy.com/media/lRiOzVJtAEWFa/giphy.gif);
background-size: cover;
padding: 10px;
text-align: center;
color: white!important;
font-size: 18pt;
font-weight: bold;
display: table-cell;
vertical-align: middle;
border-radius: 25px;
border: none;
}
#pokedex {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
width: 600px;
height: 350px;
position: relative;
left: 50%;
margin-left: -300px;
border: 1px solid white!important;
padding: 10px;
padding-top: 0;
color: white!important;
border-radius: 25px!important;
}
#pokedex_info {
width: 620px;
margin-left: -10px;
background: transparent!important;
height: 23px;
position: absolute;
top: 100%;
margin-top: -30px;
text-align: center;
font-weight: bold;
padding-top: 7px;
}
.pkdx_button {
background: transparent!important;
margin-top: 5px;
padding: 4px;
opacity: 0.9;
border-radius: 25px;
}
#pkdx_entry {
display: none;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
top: 0;
left: 0;
border-radius: 25px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
}
#pkdx_entry td {
border-radius: 25px;
color: white;
background: transparent;
}
#pkdx_img {
width: 120px;
height: 120px;
background: transparent!important;
border: 1px solid white!important;
border-radius: 25px;
position: relative;
left: 50%;
margin-left: -60px;
margin-top: 20px;
text-align: center;
}
div.poll_selector {
width: 0;
padding: 6px;
background: white!important;
border: 1px solid white!important;
cursor: pointer;
}
td.poll_selector {
background: none !important;
border-width: 0px !important;
}
rounded.poll_selector {
color: red;
background: yellow;
position: relative;
white-space: nowrap;
padding: 3px;
text-align: left;
}
textarea:focus {
background: transparent;
}
a.sidebar {
text-decoration: none!important;
color: white!important;
}
li.sidebar_nav:hover {
background: black;
color: white;
}
h1.headline1 {
text-align: right;
padding-right: 60px;
margin-left: 50px;
margin-right: 40px;
border-bottom: 3px solid;
color: white!important;
}
h2.headline1 {
text-align: right;
margin-right: 60px;
margin-top: -10px;
opacity: 0.6;
color: white;
}
h3.headline1 {
text-align: left;
padding-left: 40px;
margin-right: 120px;
margin-left: 10px;
border-bottom: 2px solid;
color: white;
}
fieldset.quote {
border: 1px solid white;
background-color: transparent;
width: 90%;
position: relative;
left: 2.5%;
padding: 4px;
margin-left: 2px;
color: white;
}
table#forum {
width: 96%;
position: relative;
left: 2%;
border: 1px solid white!important;
}
table#forum th {
text-align: left!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
color: white!important;
padding: 4px !important;
font-size: 15pt !important;
border: 1px solid white!important;
}
table#forum tr.subforum {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white!important;
padding: 4px !important;
border: 1px solid white!important;
}
table#forum tr.thread td {
padding-left: 5px;
padding-top: 4px;
padding-bottom: 8px;
font-size: 8pt;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white!important;
border: 1px solid white!important;
}
table.post_table td.post_info {
width: 150px !important;
text-align: center!important;
border: 1px white!important;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
padding-bottom: 10px!important;
border-radius: 25px;
}
#feed_comments {
position: fixed;
z-index: 120;
width: 550px;
left: 50%;
margin-left: -275px;
height: 80%;
top: 10%;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif);
border: 1px solid white;
opacity: 0.9;
padding: 15px;
overflow-y: scroll;
}
#post_field {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
border: 1px solid white!important;
border-radius: 25px!important;
}
#footer {
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat);
color: white!important;
border-radius: 25px!important;
}
#content {
margin: 6px;
padding: 5px;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
font-size: 10pt;
border: 1px solid white!important;
border-radius: 25px!important;
}
iframe {
border-width: 2px;
border-style: inset;
border: white;
border-image: initial;
border-radius: 25px!important;
}
.y2 {
position: fixed;
height: 100%;
right: 1%;
width: 18%;
overflow: hidden;
background: transparent;
color: white!important;
border-left: 1px solid white!important;
white-space: nowrap;
}
.b {
color: white!important;
background: transparent;
font-size: 14px;
font-weight: bold;
padding: 12px;
border-bottom: 1px solid grey!important;
}
.z {
color: white!important;
background: black!important;
background-image: url(bg.png);
border-top: 1px solid white!important;
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
height: 30px;
overflow: hidden;
}
h3.thread_headline {
color: white!important;
opacity: 0.9;
border-bottom: 1px solid;
width: 100%;
padding-left: 15px;
font-size: 10pt;
}
hr {
border: 0;
color: white!important;
background: white!important;
height: 1px;
}
.spoiler_content {
display: none;
border: 1px solid white;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
margin-top: 5px;
padding: 8px;
border-radius: 25px;
}
#chat_head {
background: black!important;
color: white!important;
}
#lovebox {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white!important;
border: 1px solid white!important;
box-shadow: 1px 1px 1px 1px grey!important;
}
#newsbox {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white!important;
border: 1px solid white!important;
box-shadow: 1px 1px 1px 1px grey!important;
}
#post_text {
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white!important;
border: 1px solid white!important;
}
.garden_interface {
width: 400px;
height: 256px;
position: relative;
left: 50%;
margin-left: -200px;
margin-top: 8px;
border: 1px solid white!important;
padding: 0;
}
.gardenNavigation {
width: 90%;
position: relative;
margin: auto auto;
background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcShrbanM98aUKWLIIQFJMEUQIFXvopneLx4sFY6JYSE3SILmiat)!important;
border: 1px solid white!important;
text-align: center;
padding: 10px 3px;
}
.orangeBerryWindow {
display: none;
position: fixed;
width: 700px;
height: 500px;
left: 50%;
margin-left: -350px;
top: 50%;
margin-top: -250px;
border: 1px solid white!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
z-index: 100;
color: white!important;
overflow-y: hidden;
}
.greenBerryWindow {
display: none;
position: fixed;
width: 550px;
height: 550px;
left: 50%;
margin-left: -275px;
top: 50%;
margin-top: -275px;
z-index: 100;
color: white!important;
border: 1px solid white!important;
background: url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
}
img.feed_ava {
width: 50px;
background: transparent!important;
border: 1px solid white;
border-radius: 25px!important;
}
.cheat_valid {
background-image: radial-gradient(rgba(255, 255, 255, .5), rgba(255, 255, 255, .5)), url(http://www.da-files.com/artnetwork/realm-of-fantasy/bg-stars.gif)!important;
color: white!important;
opacity: .90;
left: 0;
top: 0;
width: 100%;
height: 100%;
font-size: 24pt;
font-weight: bold;
text-align: center;
padding-top: 30px;
}
::-webkit-scrollbar-track {
background: black;
border-radius: 25px;
border: none;
}

nsfw

OFFLINE
Trainerlevel: 44

Forum Posts: 1,268

                                                Posted: Wed, 22/02/2017 09:02                                                (7 Years ago)
                                            

@Britney

1. The codes won't be different I guess, because the coding language is basically the same.
2. The author has only written those codes which are necessary for the basic change of appearance of a page, they didn't go into that much detail.

BritneyMc0206

OFFLINE
Trainerlevel: 39

Forum Posts: 52

                                                Posted: Wed, 22/02/2017 09:08                                                (7 Years ago)
                                            

@food

1. That's good.
2. S'all good. I just decided to post the codes to help bring more attention to what can be done.

Puru

OFFLINE
Trainerlevel: 31

Forum Posts: 100

                                                Posted: Fri, 03/03/2017 04:36                                                (7 Years ago)
                                            

BritneyMc0206,
The codes you shared with us are exceptional. Thank you for the contribution.

Question: How many among you by-heart know CSS?

nsfw

OFFLINE
Trainerlevel: 44

Forum Posts: 1,268

                                                Posted: Fri, 03/03/2017 04:51                                                (7 Years ago)
                                            

@Puru
me. but I fail at Positioning elements ><

BritneyMc0206

OFFLINE
Trainerlevel: 39

Forum Posts: 52

                                                Posted: Sun, 05/03/2017 14:08                                                (7 Years ago)
                                            

@Puru
Yay~ I helps. :3
I'm still learning. Finding a new way to code almost everyday. (PS, the codes I shared will change when I find another code to add, so don't be surprised if something is different)

Kety

OFFLINE
Trainerlevel: 76

Forum Posts: 1,756

                                                Posted: Wed, 17/05/2017 19:37                                                (6 Years ago)
                                            

Edited

I got it now

Verenka

OFFLINE
Trainerlevel: 63

Forum Posts: 8

                                                Posted: Sun, 23/07/2017 09:14                                                (6 Years ago)
                                            

The page looks really awesome now, thank you so much for making this guide!

Littlefoxxx

OFFLINE
Trainerlevel: 14

Forum Posts: 6

                                                Posted: Wed, 23/08/2017 20:19                                                (6 Years ago)
                                            

Title: Er

Confused QwQ

Ashlynne

OFFLINE
Trainerlevel: 25

Forum Posts: 30

                                                Posted: Thu, 01/03/2018 03:13                                                (6 Years ago)
                                            

Thank you so much for this amazing guide! I'm still working on it, but my theme currently looks like this!

Buying undexed pokemon! Pal Pad or message me offers.

RivaHakushia

OFFLINE
Trainerlevel: 28

Forum Posts: 58

                                                Posted: Wed, 21/03/2018 15:38                                                (6 Years ago)
                                            

I started working on using this to restyle ph on my end today, However I chose a dark red theme with White font, on the Bulletin board in the Berry garden this is a big hard to read white on light images, can anyone help me with changing just that part back to Black font?

I did try using the Inspection tool that comes with Chrome however I couldn't quite figure it out :S

:) Feel free to add me :)

CrystalChrissy

OFFLINE
Trainerlevel: 23

Forum Posts: 295

                                                Posted: Thu, 26/09/2019 07:49                                                (4 Years ago)
                                            

Hey, I'm having a little trouble with the custom background code as it doesn't work for me. In the code, the place where it says 'YOUR IMAGE HERE', I put in the image's image address, I really want to know what I'm doing wrong, thanks!

(Also I did the specify URL thing too)

Ephenia

OFFLINE
Trainerlevel: 101

Forum Posts: 1,149

                                                Posted: Thu, 26/09/2019 16:22                                                (4 Years ago)
                                            

@CrystalChrissy

Use this code instead:

body {
background: url(INSERT IMAGE URL HERE) no-repeat center center fixed !important;
}

This if you want your image to repeat for example:

body {
background: url(INSERT IMAGE URL HERE) repeat center center fixed !important;
}

This if you don't want that white background behind transparent images while you still want your background to repeat for example:

body {
background: url(INSERT IMAGE URL HERE), rgba(100,100,100) repeat center center fixed !important;
}

For that rgba(100,100,100), then you can use a HEX to RGBA converter if you want something different for a color.

I'm going to subscribe to this thread in case anyone needs else needs help, but you can always PalPad me if you would want some help with anything code related.

Click either to send ♥

CrystalChrissy

OFFLINE
Trainerlevel: 23

Forum Posts: 295

                                                Posted: Thu, 26/09/2019 23:19                                                (4 Years ago)
                                            

I figured what I was doing wrong, I did it so it applies to URLs starting with http://pokeheroes.com/ but I was at https://pokeheroes.com/ so yeah.

The repeated one works but when I try the no-repeat on, it comes up as a blank background?

;-;

Ephenia

OFFLINE
Trainerlevel: 101

Forum Posts: 1,149

                                                Posted: Thu, 26/09/2019 23:55                                                (4 Years ago)
                                            

That's because the image you're using as a background is small enough in its dimensions to where it is behind all of the other content displaying on pages, but it's still displaying^^

Not to mention the background is also centered in the middle of the page so yeah :p

You'd have to increase the background size, or the image size to make it appear on the outer sides of the page.

You could add say this for example inside that body tag and you'll see the image that you're using as a background will stretch and cover the whole page:

background-size: cover !important;

So, all the code would look like this:

body {
background: url(INSERT IMAGE URL HERE) no-repeat center center fixed !important;
background-size: cover !important;
}

Try that, and you'll see better as to what I'm talking about. The image will maybe be pixelated and or blurry, but it's to better help you understand :3

Click either to send ♥

CrystalChrissy

OFFLINE
Trainerlevel: 23

Forum Posts: 295

                                                Posted: Fri, 27/09/2019 02:23                                                (4 Years ago)
                                            

Thanks, it works!

Coding is hard...

Furret

ONLINE
Trainerlevel: 117

Forum Posts: 2,896

                                                Posted: Tue, 15/09/2020 03:51                                                (3 Years ago)
                                            

Hi guys!! Upon trying this out again I noticed that the code for the banner doesn't work anymore, so thanks to React here is a new updated code!!

#header {
background: url(YOUR LINK HERE) no-repeat;
background-size:cover;
border-radius: 10px;
}
#header div.banner img {
opacity: 0;
}

Just copy paste, it works as is! 🥰

MY_IRENE

OFFLINE
Trainerlevel: 44

Forum Posts: 296

                                                Posted: Thu, 24/09/2020 20:20                                                (3 Years ago)
                                            

i'm currently trying to make everything purple, and i can't find a way to change the color of the side of a forum post (where the avatar and username is). i went into the code and into inspect element, and found that it's only named "div," so is there any way to only get this specific one?

update: i've decided to make the whole forum post the same color, but if anyone has any idea it would be appreciated!