mirror of
https://github.com/alextselegidis/easyappointments.git
synced 2024-12-26 08:33:21 +03:00
Re-designed the backend header in order to be responsive.
This commit is contained in:
Alex Tselegidis
parent
7280a5d0c2
commit
38e2955273
2 changed files with 104 additions and 79 deletions
|
|
@ -70,68 +70,94 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div id="header">
|
<nav id="header" class="navbar">
|
||||||
<div id="header-logo">
|
<div class="container-fluid">
|
||||||
<img src="<?php echo $base_url; ?>/assets/img/logo.png">
|
<div class="navbar-header">
|
||||||
<span><?php echo $company_name; ?></span>
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-menu"
|
||||||
|
aria-expanded="false" aria-controls="navbar">
|
||||||
|
<span class="sr-only">Toggle navigation</span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div id="header-logo" class="navbar-brand">
|
||||||
|
<img src="<?php echo $base_url; ?>/assets/img/logo.png">
|
||||||
|
<span><?php echo $company_name; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div id="header-menu" class="collapse navbar-collapse">
|
||||||
|
<ul class="nav navbar-nav navbar-right">
|
||||||
|
<?php // CALENDAR MENU ITEM
|
||||||
|
// ------------------------------------------------------ ?>
|
||||||
|
<?php $hidden = ($privileges[PRIV_APPOINTMENTS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
||||||
|
<?php $active = ($active_menu == PRIV_APPOINTMENTS) ? 'active' : ''; ?>
|
||||||
|
<li class="<?php echo $active . $hidden; ?>">
|
||||||
|
<a href="<?php echo site_url('backend'); ?>" class="menu-item"
|
||||||
|
title="<?php echo $this->lang->line('manage_appointment_record_hint'); ?>">
|
||||||
|
<?php echo $this->lang->line('calendar'); ?>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<?php // CUSTOMERS MENU ITEM
|
||||||
|
// ------------------------------------------------------ ?>
|
||||||
|
<?php $hidden = ($privileges[PRIV_CUSTOMERS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
||||||
|
<?php $active = ($active_menu == PRIV_CUSTOMERS) ? 'active' : ''; ?>
|
||||||
|
<li class="<?php echo $active . $hidden; ?>">
|
||||||
|
<a href="<?php echo site_url('backend/customers'); ?>" class="menu-item"
|
||||||
|
title="<?php echo $this->lang->line('manage_customers_hint'); ?>">
|
||||||
|
<?php echo $this->lang->line('customers'); ?>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<?php // SERVICES MENU ITEM
|
||||||
|
// ------------------------------------------------------ ?>
|
||||||
|
<?php $hidden = ($privileges[PRIV_SERVICES]['view'] == TRUE) ? '' : 'hidden'; ?>
|
||||||
|
<?php $active = ($active_menu == PRIV_SERVICES) ? 'active' : ''; ?>
|
||||||
|
<li class="<?php echo $active . $hidden; ?>">
|
||||||
|
<a href="<?php echo site_url('backend/services'); ?>" class="menu-item"
|
||||||
|
title="<?php echo $this->lang->line('manage_services_hint'); ?>">
|
||||||
|
<?php echo $this->lang->line('services'); ?>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<?php // USERS MENU ITEM
|
||||||
|
// ------------------------------------------------------ ?>
|
||||||
|
<?php $hidden = ($privileges[PRIV_USERS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
||||||
|
<?php $active = ($active_menu == PRIV_USERS) ? 'active' : ''; ?>
|
||||||
|
<li class="<?php echo $active . $hidden; ?>">
|
||||||
|
<a href="<?php echo site_url('backend/users'); ?>" class="menu-item"
|
||||||
|
title="<?php echo $this->lang->line('manage_users_hint'); ?>">
|
||||||
|
<?php echo $this->lang->line('users'); ?>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<?php // SETTINGS MENU ITEM
|
||||||
|
// ------------------------------------------------------ ?>
|
||||||
|
<?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE
|
||||||
|
|| $privileges[PRIV_USER_SETTINGS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
||||||
|
<?php $active = ($active_menu == PRIV_SYSTEM_SETTINGS) ? 'active' : ''; ?>
|
||||||
|
<li class="<?php echo $active . $hidden; ?>">
|
||||||
|
<a href="<?php echo site_url('backend/settings'); ?>" class="menu-item"
|
||||||
|
title="<?php echo $this->lang->line('settings_hint'); ?>">
|
||||||
|
<?php echo $this->lang->line('settings'); ?>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<?php // LOGOUT MENU ITEM
|
||||||
|
// ------------------------------------------------------ ?>
|
||||||
|
<li>
|
||||||
|
<a href="<?php echo site_url('user/logout') ?>" class="menu-item"
|
||||||
|
title="<?php echo $this->lang->line('log_out_hint'); ?>">
|
||||||
|
<?php echo $this->lang->line('log_out'); ?>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</nav>
|
||||||
<div id="header-menu">
|
|
||||||
<?php // CALENDAR MENU ITEM
|
|
||||||
// ------------------------------------------------------ ?>
|
|
||||||
<?php $hidden = ($privileges[PRIV_APPOINTMENTS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
|
||||||
<?php $active = ($active_menu == PRIV_APPOINTMENTS) ? 'active' : ''; ?>
|
|
||||||
<a href="<?php echo site_url('backend'); ?>" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>"
|
|
||||||
title="<?php echo $this->lang->line('manage_appointment_record_hint'); ?>">
|
|
||||||
<?php echo $this->lang->line('calendar'); ?>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<?php // CUSTOMERS MENU ITEM
|
|
||||||
// ------------------------------------------------------ ?>
|
|
||||||
<?php $hidden = ($privileges[PRIV_CUSTOMERS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
|
||||||
<?php $active = ($active_menu == PRIV_CUSTOMERS) ? 'active' : ''; ?>
|
|
||||||
<a href="<?php echo site_url('backend/customers'); ?>" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>"
|
|
||||||
title="<?php echo $this->lang->line('manage_customers_hint'); ?>">
|
|
||||||
<?php echo $this->lang->line('customers'); ?>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<?php // SERVICES MENU ITEM
|
|
||||||
// ------------------------------------------------------ ?>
|
|
||||||
<?php $hidden = ($privileges[PRIV_SERVICES]['view'] == TRUE) ? '' : 'hidden'; ?>
|
|
||||||
<?php $active = ($active_menu == PRIV_SERVICES) ? 'active' : ''; ?>
|
|
||||||
<a href="<?php echo site_url('backend/services'); ?>" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>"
|
|
||||||
title="<?php echo $this->lang->line('manage_services_hint'); ?>">
|
|
||||||
<?php echo $this->lang->line('services'); ?>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<?php // USERS MENU ITEM
|
|
||||||
// ------------------------------------------------------ ?>
|
|
||||||
<?php $hidden = ($privileges[PRIV_USERS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
|
||||||
<?php $active = ($active_menu == PRIV_USERS) ? 'active' : ''; ?>
|
|
||||||
<a href="<?php echo site_url('backend/users'); ?>" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>"
|
|
||||||
title="<?php echo $this->lang->line('manage_users_hint'); ?>">
|
|
||||||
<?php echo $this->lang->line('users'); ?>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<?php // SETTINGS MENU ITEM
|
|
||||||
// ------------------------------------------------------ ?>
|
|
||||||
<?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE
|
|
||||||
|| $privileges[PRIV_USER_SETTINGS]['view'] == TRUE) ? '' : 'hidden'; ?>
|
|
||||||
<?php $active = ($active_menu == PRIV_SYSTEM_SETTINGS) ? 'active' : ''; ?>
|
|
||||||
<a href="<?php echo site_url('backend/settings'); ?>" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>"
|
|
||||||
title="<?php echo $this->lang->line('settings_hint'); ?>">
|
|
||||||
<?php echo $this->lang->line('settings'); ?>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<?php // LOGOUT MENU ITEM
|
|
||||||
// ------------------------------------------------------ ?>
|
|
||||||
<a href="<?php echo site_url('user/logout') ?>" class="menu-item"
|
|
||||||
title="<?php echo $this->lang->line('log_out_hint'); ?>">
|
|
||||||
<?php echo $this->lang->line('log_out'); ?>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="notification" style="display: none;"></div>
|
<div id="notification" style="display: none;"></div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -20,14 +20,14 @@ root {
|
||||||
/* BACKEND GENERAL ELEMENTS
|
/* BACKEND GENERAL ELEMENTS
|
||||||
-------------------------------------------------------------------- */
|
-------------------------------------------------------------------- */
|
||||||
#header {
|
#header {
|
||||||
height: 70px;
|
|
||||||
background-color: #35B66F;
|
background-color: #35B66F;
|
||||||
border-bottom: 4px solid #2B995D;
|
border-bottom: 4px solid #c0f1d6;
|
||||||
|
box-shadow: none;
|
||||||
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#header #header-logo {
|
#header #header-logo {
|
||||||
display: inline-block;
|
padding: 6px;
|
||||||
margin: 6px 12px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#header #header-logo img {
|
#header #header-logo img {
|
||||||
|
|
@ -41,38 +41,36 @@ root {
|
||||||
float: left;
|
float: left;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
color: white;
|
color: white;
|
||||||
margin-top: 9px;
|
margin-top: 14px;
|
||||||
font-weight: bold;
|
font-weight: lighter;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#header .navbar-header .navbar-toggle .icon-bar {
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#header #header-menu {
|
#header #header-menu {
|
||||||
display: inline-block;
|
background: #35b66f;
|
||||||
float: right;
|
|
||||||
height: 100%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#header #header-menu .menu-item {
|
#header #header-menu .menu-item {
|
||||||
float: left;
|
cursor: pointer;
|
||||||
padding: 18px 18px 19px;
|
min-width: 100px;
|
||||||
height: 70px;
|
|
||||||
min-width: 130px;
|
|
||||||
text-align: center;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #FFF;
|
color: #FFF;
|
||||||
|
text-align: center;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-size: 16px;
|
font-size: 14px;
|
||||||
transition: background-color 0.2s;
|
transition: background-color 0.2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
#header #header-menu .menu-item:hover:not(.active) {
|
#header #header-menu .menu-item:hover:not(.active) {
|
||||||
background-color: #2A8F57;
|
background-color: #2A8F57;
|
||||||
border-bottom: 4px solid #236C48;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#header #header-menu .active {
|
#header #header-menu .active {
|
||||||
color: #C5FFD6;
|
color: #C5FFD6;
|
||||||
background: #29A067;
|
background: #29A067;
|
||||||
border-bottom: 4px solid #2A7751;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer {
|
#footer {
|
||||||
|
|
@ -765,3 +763,4 @@ body .form-horizontal .controls {
|
||||||
#settings-page #update-ea {
|
#settings-page #update-ea {
|
||||||
margin-left: 12px;
|
margin-left: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue