Current Directory: /home/astoriaah/www/old15/templates/client/less
Viewing File: /home/astoriaah/www/old15/templates/client/less/off-canvas.less
/**
*------------------------------------------------------------------------------
* @package T3 Framework for Joomla!
*------------------------------------------------------------------------------
* @copyright Copyright (C) 2004-2013 JoomlArt.com. All Rights Reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
* @authors JoomlArt, JoomlaBamboo, (contribute to this project at github
* & Google group to become co-author)
* @Google group: https://groups.google.com/forum/#!forum/t3fw
* @Link: http://t3-framework.org
* @credits Mary Lou - http://tympanus.net/codrops/2013/08/28/transitions-for-off-canvas-navigations/
*------------------------------------------------------------------------------
*/
// VARIABLES & MIXINS
// ------------------
@import "vars.less"; // Include Variables and Mixins
// EXTEND STYLE IN BASE
// --------------------
@import "../../../plugins/system/t3/base-bs3/less/off-canvas.less";
//
// OFF-CANVAS
// -------------------------------------
// Toggle Button
// -------------------
.off-canvas-toggle {
border-radius: 0;
border: 0;
background: @btn-primary-bg;
color:@btn-primary-color;
float:right;
margin-right:0px;
outline:none;
position:absolute;
right:0;
top:0;
border:0 !important;
padding:0;
width: @navbar-height;
height: @navbar-height;
line-height: @navbar-height;
margin-bottom:0;
@media (max-width:@screen-sm) {
height: (@navbar-height / 2);
line-height: (@navbar-height / 2);
width:(@navbar-height / 2);
margin-top:-1px !important;
}
&:hover {
border:0 !important
}
i {
font-weight:300;
text-transform:uppercase;
font-size:1.6em;
height:@navbar-height;
width:@navbar-height;
line-height:@navbar-height;
text-align:center;
@media (max-width:@screen-sm) {
font-size:12px;
line-height:12px;
height: (@navbar-height / 2);
line-height: (@navbar-height / 2);
width:(@navbar-height / 2);
background:darken(@logoModuleBG,10%) !important;
}
}
// States
&:hover, &:active, &:focus{
outline: none;
.box-shadow(none);
background: @btn-primary-bg-hover;
color:@btn-primary-color-hover;
border: 1px solid @btn-primary-border-hover;
}
}
.with-text .off-canvas-toggle{
width: (@navbar-height * 2);
font-size:80%
}
//
// OFF-CANVAS CONTENT STYLES
// -------------------------------------
#t3-off-canvas {
min-height:100%;
// Generic
// -----------------------------------
background: @t3-off-canvas-background;
color: @t3-off-canvas-text-color;
max-width:90%;
z-index:100;
position:absolute;
p {
color: @t3-off-canvas-text-color;
}
// Header
// -----------------------------------
.t3-off-canvas-header {
background: @t3-off-canvas-header-background;
color: @t3-off-canvas-header-text-color;
padding: 0 0 0 @padding-base-horizontal;
height: @navbar-height;
// Title
h2 {
margin: 0;
line-height: @navbar-height;
font-size: @font-size-base;
font-weight: bold;
text-transform: uppercase;
}
}
// Close Button
.close {
margin: 0;
height: @navbar-height;
line-height: @navbar-height;
width: @navbar-height / 2;
background: transparent;
position: absolute;
top: 0;
right: 0;
}
ul {
width:100%
}
// Body
// -----------------------------------
.t3-off-canvas-body {
padding: (@padding-base-vertical * 4) @padding-base-horizontal;
// Links
// ------------
a {
color: @t3-off-canvas-link-color;
text-decoration: none;
&:hover,
&:focus {
color: @t3-off-canvas-link-hover-color;
text-decoration: none;
}
&:focus {
.tab-focus();
}
}
.moduletable {
}
.zen-module-title {
h3 {
color:#fff !important
}
}
// Navigations
// ------------
.nav {
margin-bottom:60px;
li {
.reset();
border-bottom:1px solid darken(@t3-off-canvas-background,8%) !important;
border-top:1px solid lighten(@t3-off-canvas-background,8%) !important;
padding:8px 0;
clear:both;
float:left;
width:100%;
li li{
border:0 !important;
padding:4px 0;
}
a {
color:@t3-off-canvas-link-color;
background:none !important
}
&.active > a{
border-right:4px solid @primary !important;
color:@primary;
}
}
ul ul {
margin:10px 0 0 15px;
}
.nav-header,
.separator {
padding:8px 0;
color: @t3-off-canvas-link-color !important;
display:block;
clear:both;
}
}
// Dropdown Menu
.dropdown-menu {
background:none;
border:0 !important;
float:left;
width:100%;
display:none;
.dropdown-submenu
.mega-dropdown-inner {
width:94%
}
li {
border:0 !important;
padding:0 4px;
a {
color:@t3-off-canvas-link-color !important;
border:0 !important;
&:hover {
color:@link-hover-color !important;
}
}
}
.caret {
float:right
}
}
// Modules
// ------------
.t3-module {
margin-bottom: @line-height-computed;
}
.module-title {
margin-bottom: @line-height-computed / 2;
}
// End Off-Canvas Body
}
// End Off-Canvas Content Styles
}