Colors and Backgroun... - Page 1 • NamelessMC

Internet Explorer is not supported. Please upgrade to a more modern browser.

Home NamelessMC General Discussion Colors and Background Image

Hello,

I have successfully installed Namelessmc and am making my website! I just have a few (nubby) questions:

-I have noticed that there aren't any themes that match my colors: is there a way I can change the colors? (for example like the Navbar color)

-I made a custom page (Rules), but when I press it, it nothing really loads. Did I do something wrong?

-How can I change the picture of the little screen on the home page that shows the ip and the players?

-Is there a way to change the background (to an image?)

Thank you so much for the help :P

Sorry for the kinda nubby questions, I already tried to install a new theme but then my website got all messed up and I had to redownload and install nameless D::

EDIT: Hahaha I found an answer to one of my questions, I'm a nub xD

blueshadow2002 · over 7 years ago · Last edited: over 7 years ago

Hi,

You can change the colours by editing your theme's custom.css file (in the styles/themes/*theme*/css directory), you can add this CSS and modify it to override the default colours.

For your custom page, double check your group has permissions to view it (you can set permissions whilst editing the custom page in the AdminCP).

You can change the image on the homepage by replacing core/assets/img/background-1920x828.jpg with an image of your choice (it must have the same name and format).

Finally, you can set a custom background by following the steps in the bottom of this post.

Hope that helps.

x1

Samerton · over 7 years ago

Thank you very much!

blueshadow2002 · over 7 years ago

Sorry, I have some more things (Sorry if it's getting annoying by now D:):

-I have changed the image of the main page thing, so thanks for that :P

-I have done most of the custom navbar, but a few issues popped up when I used that program that was in the link:

When you hover over a tab thing, the hovering is black, even though I couldn't find anything in the code that I used that had black (#000000). I tried taking out the original code to see if something was conflicting, but it was still black when I hovered over. (I edited the custom.css, by the way.) Heres what I put (sorry if this is not the right format):
.white-text {
color: #fff;
text-decoration: none;
}
.custom-nav-exclaim {
color: red;
}
/* Credit to bootsnipp.com for the social items */
#social:hover {
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-o-transform:scale(1.1);
}
#social {
-webkit-transform:scale(0.8);
/* Browser Variations: */
-moz-transform:scale(0.8);
-o-transform:scale(0.8);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
           }
/*
Only Needed in Multi-Coloured Variation
*/
.social-fb:hover {
   color: #3B5998;
}
.social-tw:hover {
   color: #4099FF;
}
.social-gp:hover {
   color: #d34836;
}
.social-em:hover {
   color: #f39c12;
}
/* Credit to bootsnipp.com for the css for the color graph */
.colorgraph {
height: 5px;
border-top: 0;
background: #c4e17f;
border-radius: 5px;
background-image: -webkit-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: -moz-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: -o-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: linear-gradient(to right, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
}
/* Bootstrap nav list from 2.3.2 */
.nav-header {
display: block;
padding: 3px 15px;
font-size: 11px;
font-weight: bold;
line-height: 1.5;
color: #000;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
text-transform: uppercase;
}
.nav li + .nav-header {
margin-top: 9px;
}
.nav-list {
padding-left: 15px;
padding-right: 15px;
margin-bottom: 0;
}
.nav-list > li > a,
.nav-list .nav-header {
margin-left: -15px;
margin-right: -15px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.nav-list > li > a {
padding: 3px 15px;
}
.nav-list > .active > a,
.nav-list > .active > a:hover,
.nav-list > .active > a:focus {
color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
background-color: #428bca;
}
.nav-list [class^="icon-"],
.nav-list [class*=" icon-"] {
margin-right: 2px;
}
.nav-list .divider {
height: 1px;
margin: 9px 0;
overflow: hidden;
background-color: #e5e5e5;
}
/* Make images responsive */
img {
   display: inline-block;
   height: auto;
   max-width: 100%;
}
body {
padding-top: 50px;
}
.btn-file {
position: relative;
overflow: hidden;
}
.btn-file input[type=file] {
position: absolute;
top: 0;
right: 0;
min-width: 100%;
min-height: 100%;
font-size: 100px;
text-align: right;
filter: alpha(opacity=0);
opacity: 0;
outline: none;
background: white;
cursor: inherit;
display: block;
}
.frame {
   height: 50px;
   width: 100%;
   position: relative;
}
.frame-sidebar {
   height: 50px;
   width: 100%;
   position: relative;
}
.img-centre {
   width: auto;
   height: auto;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
}
a {
text-decoration: none !important;
}

/* Tooltip content on one line only */
.tooltip-inner {
white-space:nowrap;
max-width:none;
}
.navbar {
background-color: #2c9634;
}
.navbar .navbar-brand {
color: #ffffff;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
color: #e1e0df;
}
.navbar .navbar-text {
color: #ffffff;
}
.navbar .navbar-nav .nav-link {
color: #ffffff;
border-radius: .25rem;
margin: 0 0.25em;
}
.navbar .navbar-nav .nav-link:not(.disabled):hover,
.navbar .navbar-nav .nav-link:not(.disabled):focus {
color: #e1e0df;
}
.navbar .navbar-nav .dropdown-menu {
background-color: #2c9634;
border-color: #0a7812;
}
.navbar .navbar-nav .dropdown-menu .dropdown-item {
color: #ffffff;
}
.navbar .navbar-nav .dropdown-menu .dropdown-item:hover,
.navbar .navbar-nav .dropdown-menu .dropdown-item:focus,
.navbar .navbar-nav .dropdown-menu .dropdown-item.active {
color: #e1e0df;
background-color: #0a7812;
}
.navbar .navbar-nav .dropdown-menu .dropdown-divider {
background-color: #0a7812;
}
.navbar .navbar-nav .nav-item.active .nav-link,
.navbar .navbar-nav .nav-item.active .nav-link:hover,
.navbar .navbar-nav .nav-item.active .nav-link:focus,
.navbar .navbar-nav .nav-item.show .nav-link,
.navbar .navbar-nav .nav-item.show .nav-link:hover,
.navbar .navbar-nav .nav-item.show .nav-link:focus {
color: #e1e0df;
background-color: #0a7812;
}
.navbar .navbar-toggle {
border-color: #0a7812;
}
.navbar .navbar-toggle:hover,
.navbar .navbar-toggle:focus {
background-color: #0a7812;
}
.navbar .navbar-toggle .navbar-toggler-icon {
color: #ffffff;
}
.navbar .navbar-collapse,
.navbar .navbar-form {
border-color: #ffffff;
}
.navbar .navbar-link {
color: #ffffff;
}
.navbar .navbar-link:hover {
color: #e1e0df;
}

@media (max-width: 767px) {
.navbar .navbar-nav .open .dropdown-menu .dropdown-item {
color: #ffffff;
}
.navbar .navbar-nav .open .dropdown-menu .dropdown-item:hover,
.navbar .navbar-nav .open .dropdown-menu .dropdown-item:focus {
color: #e1e0df;
}
.navbar .navbar-nav .open .dropdown-menu .dropdown-item.active {
color: #e1e0df;
background-color: #0a7812;
}
}
When I changed the custom.css, all of my website titles (what I set) were gone. My website was named LegitEconomy, so the LegitEconomy words on the navbar and the LegitEconomy on the Ip address thing on the main page and in the little copyright thing were all gone. I tried with the original code too, but it was still gone then. Is there a way to set it back or add it again or something?

My website is: legiteconomy.com, to help.

I have a few other questions but I can likely figure them out myself and aren't as important, but I'll post em later if I'm still stuck.

Thanks for all the help again, and sorry if this is getting annoying :)

blueshadow2002 · over 7 years ago

It looks like you'll manually need to add

to your custom CSS file, as #090909 is the current black colour.

The custom CSS file shouldn't affect the page title at all, can you try re-entering your website name in the AdminCP -> Core tab to see if that helps at all.

Samerton · over 7 years ago · Last edited: over 7 years ago

How I can edit the color background of forums list, and the color of menu button with mouse drag

Refrut · over 4 years ago

«1 »

x 1:

NamelessMC

NamelessMC

Colors and Background Image

Started by blueshadow2002

blueshadow2002

Samerton

blueshadow2002

blueshadow2002

Samerton

Refrut

NamelessMC

Links

Social

NamelessMC

NamelessMC

Colors and Background Image Started by blueshadow2002

blueshadow2002

Samerton

blueshadow2002

blueshadow2002

Samerton

Refrut

NamelessMC

Links

Social

Colors and Background Image

Started by blueshadow2002