Quantcast
Channel: Whplus Blog
Viewing all articles
Browse latest Browse all 170

Customize DirectAdmin Evolution Skin

$
0
0

In order to customize DirectAdmin Evolution Skin that looks like cpanel, Just do this step:

  1. Access Your server with root access via SSH
  2. Create a CSS File in /usr/local/directadmin/data/skins/evolution/assets/css
    For the example /usr/local/directadmin/data/skins/evolution/assets/css/myskin.css
  3. Fill the wile with this CSS code:

    header.app-header,
    .header,
    html.vue-app body.--grid-layout .app-header{
    background:#293a4a!important;
    color:#fff!important;
    box-shadow: 0 3px 3px rgba(0,0,0,0.5);
    border-bottom: none!important;
    }

    .ui-icon-counter{
    background: #0279ff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    padding: 2px;
    border: 1px solid #ccc;
    }
    .userbar > .userbar-button .userbar-button-text {
    color:#fff!important;
    }

    html.vue-app h3{
    background:#293a4a;
    color:#fff;
    padding: 12px;
    font-size: 1.5rem !important;
    }

    .icons-dashboard {
    background:#e7e7e7;
    }

    .icons-grid-category{
    background: #fff;
    }
    .icons-grid-category-entry{
    background: transparent;
    border:none!important;
    }

    html.vue-app .dashboardTab.dashboardTab.mobile > .dashboardTabHeader{
    background:#293a4a !important;
    color:#fff;
    padding:8px 15px;
    }

    thead > tr{
    background:#e0e0e0!important;
    }

    @media only screen and (max-width: 960px) {
    .icons-grid-category-entry-icon {
    width: 64px!important;
    height: 64px!important;
    }

    html.vue-app.mobile .header-top{
    background:#293a4a!important;
    }
    }

    @media only screen and (min-width: 960px) {

    .icons-grid-category-entry-icon {
    width: 48px!important;
    height: 48px!important;
    }

    .icons-grid .icons-grid-category-entries .icons-grid-category-entry {
    display:block!important;
    width: 25rem!important;
    border:none;
    }

    .icons-grid .icons-grid-category-entries .icons-grid-category-entry .icons-grid-category-entry-icon {
    float: left;
    margin-right: 5px;
    }

    .icons-grid .icons-grid-category-entries .icons-grid-category-entry .icons-grid-category-entry-name {
    float: left;
    margin-left: 10px;
    display: block;
    padding: 10px 0;
    height: 50px;
    margin-top: 10px;
    max-width:15rem!important;
    text-align:left!important;
    }

    }

  4. Save CSS file
  5. Login to your directadmin dashboard with admin access
  6. Navigate to menu “Customize Evolution Skin”
  7. Click “Misc Options” Tab
  8. Choose “Default layout” to icons grid
  9. Checked in “Forbid users changing the skin layout on user level “
  10. Fill “External CSS URL” with “/assets/css/myskin.css” or any file name regarding to step 2
  11. Click Save

source: https://forum.directadmin.com/showthread.php?t=58074&p=303371#post303371


Viewing all articles
Browse latest Browse all 170

Trending Articles


Vimeo 10.7.1 by Vimeo.com, Inc.


UPDATE SC IDOL: TWO BECOME ONE


KASAMBAHAY BILL IN THE HOUSE


Girasoles para colorear


Presence Quotes – Positive Quotes


EASY COME, EASY GO


Love with Heart Breaking Quotes


Re:Mutton Pies (lleechef)


Ka longiing longsem kaba skhem bad kaba khlain ka pynlong kein ia ka...


Vimeo 10.7.0 by Vimeo.com, Inc.


FORECLOSURE OF REAL ESTATE MORTGAGE


FORTUITOUS EVENT


Pokemon para colorear


Sapos para colorear


Smile Quotes


Letting Go Quotes


Love Song lyrics that marks your Heart


RE: Mutton Pies (frankie241)


Hato lada ym dei namar ka jingpyrshah jong U JJM Nichols Roy (Bah Joy) ngin...


Long Distance Relationship Tagalog Love Quotes