HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Please upgrade here. These earlier versions are no longer being updated and have security issues.

How to change the css on the 404 page in "custom.css" ?

edited December 2011 in Vanilla 2.0 - 2.8

Hi, i'm trying to change the color of the "404" -page, but the changes i've set has no effect?

This is what i've added to "custom.css":

/404/
body.Home #Content {
margin: 0 auto;
}

Content .SplashInfo {

border-top: 1px solid black;
border-bottom: 1px solid black;
background: #747474;
}

Content .SplashInfo h1 {

background: #747474;
color:orange;
text-shadow:0 1px 0 black;
}

Content .SplashInfo p {

border-bottom: 1px solid black;
color: orange;
}

>

//404/

Yet, it looks like this: http://finnvegg.no/derp

Please advice.

Best Answer

Answers

  • 422422 Developer MVP

    copy error.css to your themes folder and edit that css

  • edited December 2011

    I've placed the code below in /themes/default/design/error.css

    body {

    color: orange;
    font: 75%/1.7em "Helvetica Neue",Helvetica,arial,sans-serif;
    margin: 0;
    padding: 0;
    font-size: small;
    background: #747474 url('images/slicesplash.jpg') no-repeat scroll center top;
    }
    .SplashInfo {
    margin: 80px 0;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    background: #747474;
    }
    .SplashInfo h1 {
    font-weight:bold;
    text-shadow: black 0 1px 0;
    text-align: center;
    border-top: 1px solid black;
    color:orange;
    font-size:300%;
    margin: 0 0 10px;
    padding: 20px 0 0;
    }
    .SplashInfo p {
    text-align: center;
    border-bottom: 1px solid black;
    margin: 0;
    padding: 0 0 10px;
    color: orange;
    font-size: 20px;
    line-height: 1.6em;
    }

    Still no change: http://finnvegg.no/derp

    Is the file location wrong? i also tried /themes/default/error.css

  • 422422 Developer MVP
    Accepted Answer

    wonder why its pulling admin.css and not error.css ( are you embed forum )

  • Thanks! i've now changed these parts of admin.css:

    body.Home #Content {

    margin: 0 auto;
    

    }

    Content .SplashInfo {

    margin: 80px 0 0 0;
    border-top: 1px solid black;
    border-bottom: 1px solid black
    background: #747474;
    

    }

    Content .SplashInfo h1 {

    font-family: "Helvetica Neue",Helvetica,arial,sans-serif;
    background: transparent;
    text-align: center;
    border: none;
    border-top: 1px solid black;
    color:orange;
    font-size:300%;
    text-shadow:0 1px 0 black;
    padding: 10px 0 0;
    margin: 0;
    line-height: 1;
    

    }

    Content .SplashInfo p {

    font-family: "Helvetica Neue",Helvetica,arial,sans-serif;
    text-align: center;
    border-bottom: 1px solid black;
    margin: 0;
    padding: 0 0 10px;
    color: orange;
    font-size: 20px;
    

    }

    body {

    color: #000;
    font-family: 'lucida grande','Lucida Sans Unicode', Tahoma, sans-serif;
    font-size: 75%;
    line-height: 1.7;
    margin: 0;
    padding: 0;
    font-size: small;
    background: #747474;
    }

    Panel {

    float: left;
    margin: 0;
    width: 200px;
    border-top: 1px solid #82BDDD;
    border-right: 1px solid #82bddd;
    background: #747474;
    }

    body {

    color: #000;
    font-family: 'lucida grande','Lucida Sans Unicode', Tahoma, sans-serif;
    font-size: 75%;
    line-height: 1.7;
    margin: 0;
    padding: 0;
    font-size: small;
    background: #747474;
    }

    And uploaded it to a new css file in: /themes/default/design/admin.css

    This is the result: http://finnvegg.no/derp

  • 422422 Developer MVP

    you could also.. do something like ...

    This

  • maybe later... right now i have larger fish to catch...

    Fo future reference, this is how i changed the text on the 404-page:

    Add these lines to your translation file /vanilla/locales/<insert language here/definitions.php

    $Definition['Page Not Found'] = "404, Side ikke funnet";

    $Definition['The page you were looking for could not be found.'] = "Siden du ser etter finnes ikke, vennligst sjekk adressen på nytt.";

Sign In or Register to comment.