Current Directory: /home/astoriaah/www/old15/templates/client/less
Viewing File: /home/astoriaah/www/old15/templates/client/less/navigation.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
*------------------------------------------------------------------------------
*/
// ------------------------------------------------------
// CORE NAVIGATIONS ELEMENTS
// ------------------------------------------------------
//
// DROPDOWN (dropdowns.less)
// --------------------------------------------------
// Dropdown arrow/caret
// --------------------
.caret {
margin-left: 5px;
margin-top: -2px;
}
/* Menus to the right */
.zenright ul {float: right;margin-right:20px}
/* Menus to the left */
.zenleft ul {float: left}
/* menus in the middle */
.zencenter ul
{
text-align:center;
float:none !important;
li {
display:inline-block;
float:none !important;
a,
.separator {
display:inline-block;
float:none !important
}
li {
display:block;
float:left!important;
text-align: left;
width: 100%;
text-indent: 0 !important;
a {width:100%}
}
}
}
// The dropdown wrapper (div)
// --------------------------
.dropdown {
.moduletable {
padding-top:30px;
.input-group-addon {
display:none
}
.input-group {
width:100%
}
#modlgn-remember {
line-height:0.5em;
margin-top:0;
height:18px
}
p,div,
label {color:@navbar-default-color}
.unstyled {
float:left;
width:100%;
list-style-type:none;
margin-left:0 !important;
padding-left:0;
li a {
&:hover {
background:none !important
}
}
}
.btn {
background:darken(@navbar-default-bg, 15%);
float:left;
width:100%;
clear:both;
margin-bottom:30px;
&:hover {
background:lighten(@navbar-default-bg, 15%);
}
}
input {
height:42px
}
}
ul {
width:100%
}
}
// The dropdown menu (ul)
// ----------------------
.dropdown-menu {
padding: 0;
min-width: 200px;
// Provide contrast for sub level blocks
.dropdown-menu {
background: lighten(@dropdown-bg,8%);
.dropdown-menu {
background: lighten(@dropdown-bg,16%)
}
}
// Dividers (basically an hr) within the dropdown
.divider {
height: auto;
}
// Links within the dropdown menu
> li {
border-top: 1px solid @dropdown-divider-bg;
&:first-child {
border-top: 0;
}
}
> li > a {
padding: 10px 20px;
}
a,
.separator{
color:@dropdown-link-color !important
}
}
// Hover/Focus state
.dropdown-menu a {
&:hover,
&:focus {
color: @dropdown-link-hover-color !important;
background: @dropdown-link-hover-bg !important
}
}
// Active state
#navwrap .dropdown-menu .active > a,
#navwrap .dropdown-menu .active > .separator {
&,
&:hover,
&:focus {
color:@dropdown-link-active-color !important;
background: @dropdown-link-active-bg !important;
}
}
// Disabled state
.dropdown-menu > .disabled > a {
&,
&:hover,
&:focus {
}
}
// Nuke hover/focus effects
.dropdown-menu > .disabled > a {
&:hover,
&:focus {
}
}
// Dropdown section headers
// ------------------------
.dropdown-header {
padding: 3px 20px;
font-size: @font-size-base;
// T3: Links in Header
a {
color: @dropdown-header-color;
}
}
// T3 Note: Extend BS3 Dropdown Menu to multi level
// See "base-bs3/less/legacy-navigation.less"
// Dropdown Sub Menus
// ------------------
.dropdown-submenu > .dropdown-menu {
}
// Caret to indicate there is a submenu
.dropdown-submenu > a:after {
border-left-color: @dropdown-link-color;
}
.dropdown-submenu:hover > a:after {
border-left-color: @dropdown-link-hover-color;
}
.dropdown-submenu:hover>a {
color: @dropdown-link-active-color;
background: @dropdown-link-active-bg;
}
// Added for dropdown separators
.dropdown-submenu > .separator:after,
.dropdown-menu > .span:after {
display: block;
content: " ";
float: right;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 4px 4px 4px 4px;
border-top-color: @t3-off-canvas-link-color;
margin-top: 0px;
margin-right:30px;
position:absolute;
right:0;
top:8px;
}
.dropdown-toggle.separator:after,
.dropdown-menu .span:after {
display: block;
content: " ";
float: right;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 4px 4px 4px 4px;
border-top-color: @t3-off-canvas-link-color;
margin-top:8px ;
margin-left:10px;
position:absolute;
right:0;
top:8px;
}
//
// NAVS (navs.less)
// --------------------------------------------------
// Base class
// ----------
.nav {
// Nav Items
> li {
> a {
// Hover state
&:hover,
&:focus {
}
}
// Disabled state
&.disabled > a {
// Hover state
&:hover,
&:focus {
}
}
}
// Seperator
> li > .separator {
position: relative;
display: block;
padding: @nav-link-padding;
line-height: @line-height-computed;
@media (min-width: @grid-float-breakpoint) {
padding-top: ((@navbar-height - @line-height-computed) / 2);
padding-bottom: ((@navbar-height - @line-height-computed) / 2);
}
}
// Open dropdowns
.open > a {
&,
&:hover,
&:focus {
background:none !important;
color:@navbar-default-link-active-color !important;
// The caret
.caret {
}
}
}
//End
}
// Tabs
// ----
.nav-tabs {
margin-left:0;
> li {
// Actual tabs (as links)
@media(max-width: 620px) {
margin-bottom:6px;
width:100%
}
> a {
padding: 10px;
line-height: normal;
border: 0;
text-transform: uppercase;
.btn();
// Hover state
&:hover {
border: 0;
background: transparent;
}
}
// Active state, and it's :hover to override normal :hover
&.active > a {
.btn-active();
border: 0;
color: #fff;
margin-bottom: 0;
&,
&:hover,
&:focus {
border: 0;
color: #fff;
}
}
}
//End
}
.tab-content {
padding: 10px 0;
border-top: 0;
}
// Pills
// -----
.nav-pills {
> li {
// Links rendered as pills
> a {
}
+ li {
}
// Active state
&.active > a {
&,
&:hover,
&:focus {
// The caret
.caret {
}
}
}
}
// End
}
// Dropdowns Caret in Nav
// ----------------------
// Make dropdown carets use link color in navs
.nav .caret {
border-top-color: @link-color;
border-bottom-color: @link-color;
}
.nav a:hover .caret {
border-top-color: @link-hover-color;
border-bottom-color: @link-hover-color;
}
//
// BREADCRUMS (breadcrums.less)
// -------------------------------------------------------
.t3-navhelper {
background: @breadcrumb-bg;
color: @breadcrumb-color;
padding: 5px 0;
}
.breadcrumb {
margin-bottom: 0;
padding-left: 0;
padding-right: 0;
border-radius: 0;
> li {
+ li:before {
content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
}
}
// Active
> .active {
color: @breadcrumb-active-color;
}
// T3 Note: Hide default Joomla! arrow in breadcrum
.divider {
display: none;
}
}
//
// PAGINATION (MULTIPLE PAGES) (pagination.less)
// --------------------------------------------------
.pagination-wrap {
}
.pagination {
> li {
> a,
> span {
}
}
// Hover state
> li > a,
> li > span {
&:hover,
&:focus {
}
}
// Active state
> .active > a,
> .active > span {
&,
&:hover,
&:focus {
}
}
// Disabled state
> .disabled {
> span,
> span:hover,
> span:focus,
> a,
> a:hover,
> a:focus {
}
}
}
// T3 Note: Fix for Joomla! Pagination
// ------------------------------------
.pagination {
.clearfix();
display: block;
// left align on Tablets / Desktop
@media screen and (min-width: @screen-sm) {
float: left;
}
// re-defined nested class - joomla structure
.pagination {
display: inline-block;
}
}
// Counter
// -------
.counter {
display: inline-block;
margin-top: @line-height-computed;
padding: @padding-base-vertical @padding-base-horizontal;
background-color: @pagination-bg;
border: 1px solid @pagination-border;
border-radius: @border-radius-base;
// Right align on Tablets / Desktop
@media screen and (min-width: @screen-sm) {
float: right;
}
}
// Sizing
// ------
// Large
.pagination-lg {
}
// Small
.pagination-sm {
}
//
// PAGER PAGINATION (pager.less)
// --------------------------------------------------
.pager {
li {
> a,
> span {
border:1px solid @border-color
}
// Hover state
> a:hover,
> a:focus {
}
// Active state
&.active,
&.active:hover,
&.active:focus {
}
}
.next {
> a,
> span {
}
}
.previous {
> a,
> span {
}
}
// Disabled state
.disabled {
> a,
> a:hover,
> a:focus,
> span {
}
}
}