Is it possible to center the Paper Lantern theme?

syslint

February 22, 2016 12:42

What is the resolution of your screen? PS: If you need more customization ,better to build a custom responsive theme.

0

cPanelMichael

February 23, 2016 19:05

Hello :) You may find this document helpful if you have not already viewed it:

0

kdean

February 24, 2016 08:08

Here's my Centered Paper Lantern with some other tweaks. To apply the following style changes, you need to create a style.css file in your own style folder. Steps 1, 2 & 5 from this Tutorial: Tutorial - Create a Custom cPanel Style - Software Development Kit - cPanel Documentation Then you can apply that style via cPanel's Change Style menu item or if you want to set your custom modifications as the default for Paper Lantern for all accounts do Step 6. Copy the styles below into your stylesheet and you should be good to go.



/* Overall */

#cpanel_body {
    max-width: none; /* remove width limit */
}

div#content {
    max-width: 1365px;  /* limit the widht here. Use 252px wide increments if you want icons evenly filling width at max-width  */
    margin-top: 36px;  /* slightly taller to account for Header Logo Extra Padding below */
}

#main {
    width: 100%;  /* Fill the content width */
    margin-top: 10px;  /* Extra room between top bar and content */
}

.page-header {
    margin-top: 10px;  /* Extra room between top bar and content */
}


/* Statistics and Dashboard */

div.dashboard-item {
    padding: 8px 0px;
}

ul.dashboard-list li.dashboard-item:nth-child(odd) {
    padding: 8px 8px 8px 0px;
    clear: left;
}

ul.dashboard-list li.dashboard-item:nth-child(even) {
    padding: 8px 0px 8px 8px;
}



/* Sub pages and User Manager */

.body-content {
    max-width: none;
}



/* User Manager */

div.edge {
    margin: 10px 0px;
}

div.edge > div.row {
    margin: 0px;
}

div.edge > div.row div.username {
    padding-top: 15px;
}

div.edge > div.row div.services {
    padding-left: 0px;
}   


/* Header Logo Extra Padding */

div.navbar-header {
    padding-bottom: 2px;
    padding-top: 2px;
}

@media(max-width: 768px) {  /* for Mobile */

    /* Header Logo Extra Padding */
   
    .navbar-preferences, header .navbar, header .navbar .container .navbar-header, header .navbar .container .navbar-header .navbar-preferences {
        height: 34px;
        min-height: 34px
    }
   
   
    /* Reposition Hamburger menu */
   
    .cp-nav-toggle {
        height: 34px;
    }
}


@media(max-width: 767px) { /* for Mobile */

    /* Statistics and Dashboard */
   
    ul.dashboard-list li.dashboard-item {
        padding: 0 0 15px 0 !important; 
    }
   
    /* User Manager */
    div.edge > div.row div.services {
        padding-left: 15px;
    }
}

0

Is it possible to center the Paper Lantern theme?

Comments

Didn't find what you were looking for?