Discussion Forums  >  Self Hosted Control Panels

Replies: 9    Views: 121

chadh0130
Apple Fan
Profile
Posts: 352
Reg: Nov 05, 2011
Rhode Island
4,020
11/22/13 06:29 PM (12 years ago)

Spice up your Self Hosted CP - Scrolling Nav Bar + CSS

Just wanted to post this nifty trick for whomever would like to spice up their CP with a scrolling NavBar. Follow these 3 steps and you'll be good to go. 1. Go to your files/theme/style.css 2. On line or around line95 under "page level" - change "padding-top: 0px;" to padding-top: 100px; 3. Now go down to .topNavBar (on or around line 112)-- Add these two lines at the end (under width) position: fixed; z-index: 1; save and upload new CSS files to your server and refresh your browser. Viola!
 
Cakebit
Code is Art
Profile
Posts: 502
Reg: Dec 15, 2010
In your local b...
16,520
like
11/22/13 06:35 PM (12 years ago)
Thanks!
 
chadh0130
Apple Fan
Profile
Posts: 352
Reg: Nov 05, 2011
Rhode Island
4,020
like
11/22/13 06:38 PM (12 years ago)
You're quite welcome :)
 
Sandeep
Android Fan
Profile
Posts: 1260
Reg: Feb 01, 2012
Miraj, India
25,250
like
11/22/13 07:40 PM (12 years ago)
This is amazing! Thanks for sharing.
 
chadh0130
Apple Fan
Profile
Posts: 352
Reg: Nov 05, 2011
Rhode Island
4,020
like
11/22/13 10:18 PM (12 years ago)
Welcome! Thought ppl might like it.
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
11/23/13 03:30 AM (12 years ago)
Nice! Can I use this in a tutorial I'm making on CSS training for Self-Hosting?
 
farcat
buzztouch Evangelist
Profile
Posts: 1008
Reg: Jan 27, 2012
France
13,230
like
11/23/13 08:28 AM (12 years ago)
Thanks @WaYsTiiD TIME!
 
EdReyes
Lost but trying
Profile
Posts: 574
Reg: Oct 21, 2013
location unknow...
17,640
like
11/23/13 08:46 AM (12 years ago)
cool thanks
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
11/23/13 09:00 AM (12 years ago)
I'm finding small problems with this. It seems to be cutting the top off, as you can see from this image: http://annandaleapps.com/App_Files/4 I am looking into the CSS, but please do post a reply if you find a solution!
 
chadh0130
Apple Fan
Profile
Posts: 352
Reg: Nov 05, 2011
Rhode Island
4,020
like
11/23/13 09:55 AM (12 years ago)
@thomas Boyd- play around with the padding-top: value..instead of 100px..try using 125px. As you increase the number, the more the "site" is being pushed down so it isn't cut off. Let me know the results
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.