1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Custom CSS Examples

Discussion in 'Tomato Firmware' started by andersonbc, Dec 21, 2006.

  1. andersonbc

    andersonbc LI Guru Member

    I was thinking it would be nice to see some other custom CSS! I'll start by posting my (small) modification to the tomato CSS file. I made the header narrower and altered the sidebar settings to make the hierarchy more visible.
     

    Attached Files:

  2. bokh

    bokh Network Guru Member

  3. digitalgeek

    digitalgeek Network Guru Member

    thanks, I was actually surprised how easy it was to set it up...

    for those who don't know...

    I copied the custom.css(.txt) file to the /cifs1 folder (windows file share on my server)
    used ssh(putty) to log into the router

    issued the following linux shell commands...

    mkdir /var/wwwext
    cp /cifs1/custom.css /var/wwwext/custom.css

    I then went to the adminstration - admin acces
    and chose the color scheme - "Custom ext/custom.css"

    a very easy process...


    thanks Jon once again for an amazing firmware, keep up the good work!
     
  4. andersonbc

    andersonbc LI Guru Member

    digitalgeek, I agree on the cifs1 method- I find it much easier to edit the copy on the cifs1 share.

    Here is another one I have been playing with. I'm still just playing around with the sidebar (and the narrow header). If you don't have Verdana (some Linux distros don't) you might want to change the font.
     

    Attached Files:

  5. digitalgeek

    digitalgeek Network Guru Member

    thanks andrsonbc for the two styles...

    has anybody prepared any sort of documentation or is it just trial and error for the custom.css file format
     
  6. andersonbc

    andersonbc LI Guru Member

    I think it easier to start with the default Tomato CSS file and go from there. This is how I do it from beginning to end:
    1. Telnet or SSH into your router. Copy /www/tomato.css to your cifs1 share. Rename it to custom.css.
    2. Make your modifications on /cifs1/custom.css. When you select the custom css option, Jon links the original tomato.css and the custom css file. This means that you really only need your custom file to contain the modified sections. I leave in the entire contents of the original file though (easier to edit).
    3. Bring up your routers web config. Add the following code to your "WAN Up" script (or the init script with a 5 second or so sleep):
      This loads the custom.css when you reboot your router and allows for you to perform your editing on the cifs1 copy (in your favorite OS and editor if you wish).

    There are a ton of sites that have CSS tutorials, so I won't get into that.

    If I missed something, or I'm not making any sense, please let me know.
     
  7. digitalgeek

    digitalgeek Network Guru Member

    My question was in regards to the actual css file... but from what your saying it is a standard style sheet... I will research it later.

    thanks.
    dg
     
  8. andersonbc

    andersonbc LI Guru Member

    Yeah it sure is. Jon has some default styles settings and a lot of classes and IDs that make modifying everything fairly easy.
     
  9. digitalgeek

    digitalgeek Network Guru Member

    does the default style list all the classes and IDs
     
  10. Pioneer

    Pioneer LI Guru Member

    I can't copy anything to cifs1 because it's a "read-only file system".
    What´s the matter?
     
  11. bokh

    bokh Network Guru Member

    This off topic in this thread, but anyway...
    Is your cifs1 a share-point to a Windows- or Samba-share and have you enabled it in http://192.168.1.1/admin-cifs.asp ?
    If so check your permissions on the host that shares the folder.
    If not you're using it the wrong way.
     
  12. Pioneer

    Pioneer LI Guru Member

    ok thanks...i'll have a look at it later...
    and sry for offtopic :blush:
     
  13. digitalgeek

    digitalgeek Network Guru Member

    check the permision on the share... and make sure your tomato logon credentials have "full access"
     
  14. andersonbc

    andersonbc LI Guru Member

    Jon named them pretty intuitively. I had to look at the HTML code of the rendered page a few times though (to see which class\ID was doing what).
     

Share This Page