Meta Box

Override Dashboard CSS correctly?

Support › MB Frontend Submission › Override Dashboard CSS correctly?Resolved

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • April 10, 2021 at 6:22 PM #27114
    Adam MAdam M
    Participant

    Hi,

    I'm trying to style the Frontend Dashboard. I notice it uses the CSS file at /wp-content/plugins/meta-box-aio/vendor/meta-box/mb-frontend-submission/assets/dashboard.css.

    When I use the Customizer's "Additional CSS" to enter overrides, I need to mark everything as !important to work, which creates internal conflicts when I need to add multiple, separate styles.

    What's the recommended way to override that CSS file?

    April 10, 2021 at 10:12 PM #27122
    Long NguyenLong Nguyen
    Moderator

    Hi,

    • You can still use the Additional CSS in the customizer to override the style of the frontend dashboard. Just need to specificity class, for example, current CSS code of the Add New button in the frontend dashboard
    .mbfs-add-new-post {
    text-decoration: none;
    padding: .5em 1em;
    color: #fff;
    background: #45cbf7;
    border-radius: .25em;
    transition: .3s;
    display: inline-block;
    margin: 1em 0;
}

    specificity class is

    body .mbfs-add-new-post {
    color: red;
}

    Get more details here https://stackoverflow.com/questions/20954715/how-to-override-the-properties-of-a-css-class-using-another-css-class.

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.