[wwillisParticipant]

Hello, I couldn’t find a specific topic open relating to customizing the ethos alert boxes. Right now they are only outlined with a white background. I’d like to have them set up like the integrity boxes where the background color and text and outline are styled in the corresponding alert level color. To recap, I’d just like to have my alert boxes on the ethos stack look like those on the integrity stack (http://theme.co/x/demo/integrity/1/shortcodes/alert/)

[ThaiModerator]

Hi There,

Please add the following CSS under Customizer > Custom > CSS:

.x-alert {
    margin-bottom: 1.313em;
    border: 1px solid #f6dca7;
    padding: 0.786em 2.25em 1em 1.15em;
    font-size: 14px;
    line-height: 1.5;
    text-shadow: 0 1px 0 rgba(255,255,255,0.9);
    color: #c09853;
    background-color: #fcf8e3;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8),0 2px 3px rgba(0,0,0,0.065);
}
.x-alert-info  {
    background-color: #d9edf7;
    border-color: #b3d1ef;
    color: #3a87ad;
}
.x-alert-success {
    background-color: #dff0d8;
    border-color: #c1dea8;
    color: #468847;
}
.x-alert-danger {
    background-color: #f2dede;
    border-color: #e5bdc4;
    color: #b94a48;
}
.x-alert-muted {
    background-color: #eee;
    border-color: #cfcfcf;
    color: #999;
}

Hope it helps 🙂

[wwillisParticipant]

Worked like a charm, thanks!

[Prasant RaiModerator]

You are most welcome. 🙂

[Author]

Posts