Dashboard responsive
This commit is contained in:
parent
e14c57fbc2
commit
f99eda14af
|
@ -3,11 +3,11 @@
|
||||||
---------------------------------------------------------------- */
|
---------------------------------------------------------------- */
|
||||||
|
|
||||||
.uk-width-1-4 {
|
.uk-width-1-4 {
|
||||||
width: 20% !important;
|
width: 20%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uk-width-3-4 {
|
.uk-width-3-4 {
|
||||||
width: 80% !important;
|
width: 80%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label-draft,
|
.label-draft,
|
||||||
|
@ -58,8 +58,6 @@
|
||||||
background-color: #0069BE !important;
|
background-color: #0069BE !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* CSS defaults
|
/* CSS defaults
|
||||||
---------------------------------------------------------------- */
|
---------------------------------------------------------------- */
|
||||||
body {
|
body {
|
||||||
|
@ -113,15 +111,19 @@ body {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.uk-navbar-toggle {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
/* VIEW
|
/* VIEW
|
||||||
---------------------------------------------------------------- */
|
---------------------------------------------------------------- */
|
||||||
|
|
||||||
#bl-view {
|
#bl-view {
|
||||||
margin-right: 20px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#bl-view .uk-width-2-10 {
|
#bl-view .uk-width-2-10 {
|
||||||
padding-left: 10px !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.plugin-incompatible,
|
.plugin-incompatible,
|
||||||
|
@ -154,7 +156,7 @@ div.dashboard-links {
|
||||||
background-color: #fafafa !important;
|
background-color: #fafafa !important;
|
||||||
border: 1px solid #f8f8f8;
|
border: 1px solid #f8f8f8;
|
||||||
box-shadow: 5px 1px 1px #fdfdfd;
|
box-shadow: 5px 1px 1px #fdfdfd;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 10px;
|
||||||
padding: 50px 20px;
|
padding: 50px 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -175,7 +177,7 @@ div.dashboard-links h4 {
|
||||||
font-size: 0.9em !important;
|
font-size: 0.9em !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-meta .uk-form-label {
|
.bl-publish-sidebar .uk-form-label {
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
@ -204,14 +206,41 @@ button.aslink:hover {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* OLD
|
/* RESPONSIVE
|
||||||
---------------------------------------------------------------- */
|
---------------------------------------------------------------- */
|
||||||
|
|
||||||
.bl-view {
|
@media (max-width: 960px) {
|
||||||
margin-top: 25px;
|
|
||||||
margin-bottom: 25px;
|
.uk-grid {
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#bl-container {
|
||||||
|
margin: 0 10px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#bl-view {
|
||||||
|
width: 100% !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bl-brand {
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bl-publish-sidebar {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bl-publish-view {
|
||||||
|
width: 100% !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* OLD
|
||||||
|
---------------------------------------------------------------- */
|
||||||
|
|
||||||
#logo {
|
#logo {
|
||||||
background: #f4f4f4;
|
background: #f4f4f4;
|
||||||
padding:20px 0;
|
padding:20px 0;
|
||||||
|
|
|
@ -52,6 +52,7 @@ $(document).ready(function() {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Offcanvas for Mobile -->
|
<!-- Offcanvas for Mobile -->
|
||||||
|
<a href="#offcanvas" class="uk-navbar-toggle uk-hidden-large" data-uk-offcanvas></a>
|
||||||
<div id="offcanvas" class="uk-offcanvas">
|
<div id="offcanvas" class="uk-offcanvas">
|
||||||
<div class="uk-offcanvas-bar">
|
<div class="uk-offcanvas-bar">
|
||||||
<ul class="uk-nav uk-nav-offcanvas">
|
<ul class="uk-nav uk-nav-offcanvas">
|
||||||
|
@ -86,8 +87,7 @@ $(document).ready(function() {
|
||||||
|
|
||||||
<div class="uk-grid uk-grid-small">
|
<div class="uk-grid uk-grid-small">
|
||||||
|
|
||||||
<div class="uk-width-1-4">
|
<div id="bl-sidebar" class="uk-width-1-4 uk-visible-large">
|
||||||
<div id="bl-sidebar">
|
|
||||||
|
|
||||||
<ul class="uk-nav">
|
<ul class="uk-nav">
|
||||||
|
|
||||||
|
@ -139,18 +139,15 @@ $(document).ready(function() {
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="uk-width-3-4">
|
<div id="bl-view" class="uk-width-3-4">
|
||||||
<div id="bl-view">
|
|
||||||
<?php
|
<?php
|
||||||
if( Sanitize::pathFile(PATH_ADMIN_VIEWS, $layout['view'].'.php') ) {
|
if( Sanitize::pathFile(PATH_ADMIN_VIEWS, $layout['view'].'.php') ) {
|
||||||
include(PATH_ADMIN_VIEWS.$layout['view'].'.php');
|
include(PATH_ADMIN_VIEWS.$layout['view'].'.php');
|
||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -57,7 +57,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="dashboard-panel" class="uk-grid">
|
<div id="dashboard-panel" class="uk-grid uk-grid-small">
|
||||||
|
|
||||||
<div class="uk-width-1-3">
|
<div class="uk-width-1-3">
|
||||||
|
|
||||||
|
|
|
@ -17,8 +17,8 @@ HTML::formOpen(array('class'=>'uk-form-stacked'));
|
||||||
));
|
));
|
||||||
|
|
||||||
// ---- LEFT SIDE ----
|
// ---- LEFT SIDE ----
|
||||||
echo '<div class="uk-grid">';
|
echo '<div class="uk-grid uk-grid-medium">';
|
||||||
echo '<div class="uk-width-8-10">';
|
echo '<div class="bl-publish-view uk-width-8-10">';
|
||||||
|
|
||||||
// Title input
|
// Title input
|
||||||
HTML::formInputText(array(
|
HTML::formInputText(array(
|
||||||
|
@ -36,7 +36,6 @@ echo '<div class="uk-width-8-10">';
|
||||||
'placeholder'=>''
|
'placeholder'=>''
|
||||||
));
|
));
|
||||||
|
|
||||||
|
|
||||||
// Form buttons
|
// Form buttons
|
||||||
echo '<div class="uk-form-row uk-margin-bottom">';
|
echo '<div class="uk-form-row uk-margin-bottom">';
|
||||||
echo ' <button class="uk-button uk-button-primary" type="submit">'.$L->g('Save').'</button>';
|
echo ' <button class="uk-button uk-button-primary" type="submit">'.$L->g('Save').'</button>';
|
||||||
|
@ -52,7 +51,7 @@ if(count($_Page->children())===0)
|
||||||
echo '</div>';
|
echo '</div>';
|
||||||
|
|
||||||
// ---- RIGHT SIDE ----
|
// ---- RIGHT SIDE ----
|
||||||
echo '<div class="sidebar-meta uk-width-2-10">';
|
echo '<div class="bl-publish-sidebar uk-width-2-10">';
|
||||||
|
|
||||||
// Tabs, general and advanced mode
|
// Tabs, general and advanced mode
|
||||||
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
||||||
|
|
|
@ -17,8 +17,8 @@ HTML::formOpen(array('class'=>'uk-form-stacked'));
|
||||||
));
|
));
|
||||||
|
|
||||||
// ---- LEFT SIDE ----
|
// ---- LEFT SIDE ----
|
||||||
echo '<div class="uk-grid">';
|
echo '<div class="uk-grid uk-grid-medium">';
|
||||||
echo '<div class="uk-width-8-10">';
|
echo '<div class="bl-publish-view uk-width-8-10">';
|
||||||
|
|
||||||
// Title input
|
// Title input
|
||||||
HTML::formInputText(array(
|
HTML::formInputText(array(
|
||||||
|
@ -46,7 +46,7 @@ echo '<div class="uk-width-8-10">';
|
||||||
echo '</div>';
|
echo '</div>';
|
||||||
|
|
||||||
// ---- RIGHT SIDE ----
|
// ---- RIGHT SIDE ----
|
||||||
echo '<div class="sidebar-meta uk-width-2-10">';
|
echo '<div class="bl-publish-sidebar uk-width-2-10">';
|
||||||
|
|
||||||
// Tabs, general and advanced mode
|
// Tabs, general and advanced mode
|
||||||
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
||||||
|
|
|
@ -11,8 +11,8 @@ HTML::formOpen(array('class'=>'uk-form-stacked'));
|
||||||
));
|
));
|
||||||
|
|
||||||
// ---- LEFT SIDE ----
|
// ---- LEFT SIDE ----
|
||||||
echo '<div class="uk-grid">';
|
echo '<div class="uk-grid uk-grid-medium">';
|
||||||
echo '<div class="uk-width-8-10">';
|
echo '<div class="bl-publish-view uk-width-8-10">';
|
||||||
|
|
||||||
// Title input
|
// Title input
|
||||||
HTML::formInputText(array(
|
HTML::formInputText(array(
|
||||||
|
@ -39,7 +39,7 @@ echo '<div class="uk-width-8-10">';
|
||||||
echo '</div>';
|
echo '</div>';
|
||||||
|
|
||||||
// ---- RIGHT SIDE ----
|
// ---- RIGHT SIDE ----
|
||||||
echo '<div class="sidebar-meta uk-width-2-10">';
|
echo '<div class="bl-publish-sidebar uk-width-2-10">';
|
||||||
|
|
||||||
// Tabs, general and advanced mode
|
// Tabs, general and advanced mode
|
||||||
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
||||||
|
|
|
@ -11,8 +11,8 @@ HTML::formOpen(array('class'=>'uk-form-stacked'));
|
||||||
));
|
));
|
||||||
|
|
||||||
// ---- LEFT SIDE ----
|
// ---- LEFT SIDE ----
|
||||||
echo '<div class="uk-grid">';
|
echo '<div class="uk-grid uk-grid-medium">';
|
||||||
echo '<div class="uk-width-8-10">';
|
echo '<div class="bl-publish-view uk-width-8-10">';
|
||||||
|
|
||||||
// Title input
|
// Title input
|
||||||
HTML::formInputText(array(
|
HTML::formInputText(array(
|
||||||
|
@ -39,7 +39,7 @@ echo '<div class="uk-width-8-10">';
|
||||||
echo '</div>';
|
echo '</div>';
|
||||||
|
|
||||||
// ---- RIGHT SIDE ----
|
// ---- RIGHT SIDE ----
|
||||||
echo '<div class="sidebar-meta uk-width-2-10">';
|
echo '<div class="bl-publish-sidebar uk-width-2-10">';
|
||||||
|
|
||||||
// Tabs, general and advanced mode
|
// Tabs, general and advanced mode
|
||||||
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
echo '<ul class="uk-tab" data-uk-tab="{connect:\'#tab-options\'}">';
|
||||||
|
|
Loading…
Reference in New Issue