%PDF-
%PDF-
Mini Shell
Mini Shell
/**
*------------------------------------------------------------------------------
* @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
*------------------------------------------------------------------------------
*/
// VARIABLES & MIXINS
// ------------------
// Prevent Bootstrap Upgrading errors
@import "../bootstrap/less/variables.less";
// Bootstrap mixins
@import "../bootstrap/less/mixins.less";
// T3 Base variables
@import "variables.less";
// BASIC STYLE FOR MEGAMENU
// -------------------------
.t3-megamenu {
// THE MEGAMENU
//--------------------------------------------
// Global Menu Inner padding
// -------------------------
.mega-inner {
padding: @T3globalPadding / 2;
.clearfix();
}
// Inner Padding for 1 column
.span12 .mega-inner {
}
// Menu Grids
// ----------
.row-fluid {
}
.row-fluid + .row-fluid {
padding-top: @T3globalPadding / 2;
border-top: 1px solid @hrBorder;
}
.row-fluid [class*="span"] {
}
// The Dropdown
// ------------
.mega > .mega-dropdown-menu {
min-width: 200px;
display: none;
}
.mega.open > .mega-dropdown-menu,
.mega.dropdown-submenu:hover > .mega-dropdown-menu {
display: block;
}
// The Group
// ---------
.mega-group {
.clearfix();
}
// Group Title
.mega-nav .mega-group > .mega-group-title,
.dropdown-menu .mega-nav .mega-group > .mega-group-title,
.dropdown-menu .active .mega-nav .mega-group > .mega-group-title {
background: inherit;
color: inherit;
font-weight: bold;
padding: 0;
margin: 0;
&:hover, &:active, &:focus {
background: inherit;
color: inherit;
}
}
// Group Content
.mega-group-ct {
margin: 0;
padding: 0;
.clearfix();
}
// Nav in Megamenu
// ---------------
.mega-col-nav {
}
// Inner padding
.mega-col-nav .mega-inner {
}
// Inner padding for nav in 1 column
.span12.mega-col-nav .mega-inner {
padding: 5px;
}
.mega-group .span12.mega-col-nav .mega-inner {
padding: 0;
}
// The Nav
.mega-nav,
.dropdown-menu .mega-nav {
margin: 0;
padding: 0;
list-style: none;
}
.mega-nav > li,
.dropdown-menu .mega-nav > li {
list-style: none;
margin-left: 0;
}
.mega-nav > li a,
.dropdown-menu .mega-nav > li a {
white-space: normal;
}
// Nav in Group
.mega-group > .mega-nav,
.dropdown-menu .mega-group > .mega-nav {
margin-left: -5px;
margin-right: -5px;
}
.mega-group > .mega-nav > li,
.dropdown-menu .mega-group > .mega-nav > li {
}
.mega-group .mega-nav > li a,
.dropdown-menu .mega-group .mega-nav > li a {
}
// The caret
.mega-nav .dropdown-submenu > a::after {
margin-right: 5px;
}
// Modules in Megamenu
// -------------------
.mega-col-module {
}
// Inner padding
.mega-col-module .mega-inner {
}
// Inner padding for module in 1 column
.span12.mega-col-nav .mega-inner {
}
// The module
.t3-module {
margin-bottom: @T3globalMargin / 2;
}
// Module Title
.t3-module .module-title {
margin-bottom: 0;
}
// Module Content
.t3-module .module-ct {
margin: 0;
padding: 0;
}
// Menu alignment
// --------------
.mega-align-left > .dropdown-menu {
left: 0;
}
.mega-align-right > .dropdown-menu {
left: auto;
right: 0;
}
.mega-align-center > .dropdown-menu {
left: 50%;
transform: translate(-50%);
-webkit-transform: translate(-50%);
-moz-transform: translate(-50%);
-ms-transform: translate(-50%);
-o-transform: translate(-50%);
}
.dropdown-submenu.mega-align-left > .dropdown-menu {
left: 100%;
}
.dropdown-submenu.mega-align-right > .dropdown-menu {
left: auto;
right: 100%;
}
.mega-align-justify {
position: static;
}
.mega-align-justify > .dropdown-menu {
left: 0;
margin-left: 0;
top: auto;
}
// The caption
// -----------
.mega-caption {
display: block;
white-space: nowrap;
}
// The caret
// ---------
.nav .caret,
.dropdown-submenu .caret,
.mega-menu .caret {
display: none;
}
// Show the caret on level 0 only
.nav > .dropdown > .dropdown-toggle .caret {
display: inline-block;
}
// The icon
// --------
.nav [class^="icon-"],
.nav [class*=" icon-"] {
margin-right: 5px;
}
// Menu tab
// --------------
.mega-tab > div {
position: relative;
}
.mega-tab > div > ul {
width: @t3-mega-dropdown-min-width;
}
.mega-tab > div > ul > li {
position: static;
}
.mega-tab > div > ul > li > .dropdown-menu{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: @t3-mega-dropdown-min-width;
}
.mega-tab > div > ul > li > .mega-dropdown-menu {
border: none;
box-shadow: none;
}
.mega-tab > div > ul > li > .mega-dropdown-menu > div {
opacity: 1!important;
margin-left: 0!important;
transition: none!important;
}
// End
}
// MEGAMENU Animation
// --------------------------------------------------------------
//
@media (min-width: @navbarCollapseDesktopWidth) {
.t3-megamenu.animate {
.mega {
& > .mega-dropdown-menu {
transition: all 400ms;
-webkit-transition: all 400ms;
-ms-transition: all 400ms;
-o-transition: all 400ms;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
opacity: 0;
}
&.animating > .mega-dropdown-menu {
display: block!important;
}
&.open > .mega-dropdown-menu,
&.animating.open > .mega-dropdown-menu {
opacity: 1;
}
}
&.zoom {
.mega {
> .mega-dropdown-menu {
.scale(~"0, 0");
-webkit-transform-origin: 20% 20%;
-moz-transform-origin: 20% 20%;
transform-origin: 20% 20%;
}
&.open > .mega-dropdown-menu {
.scale(~"1, 1");
}
}
//special case for level 0
.level0 > .mega-align-center {
> .mega-dropdown-menu {
-webkit-transform: scale(0, 0) translate(-50%, 0);
-ms-transform: scale(0, 0) translate(-50%, 0);
transform: scale(0, 0) translate(-50%, 0);
-webkit-transform-origin: 0% 20%;
-moz-transform-origin: 0% 20%;
transform-origin: 0% 20%;
}
&.open > .mega-dropdown-menu {
-webkit-transform: scale(1, 1) translate(-50%, 0);
-ms-transform: scale(1, 1) translate(-50%, 0);
transform: scale(1, 1) translate(-50%, 0);
}
}
}
&.elastic {
.mega {
& > .mega-dropdown-menu {
.scale(~"0, 1");
-webkit-transform-origin: 10% 0;
-moz-transform-origin: 10% 0;
transform-origin: 10% 0;
}
&.open > .mega-dropdown-menu {
.scale(~"1, 1");
}
}
.level0 {
> .mega > .mega-dropdown-menu {
.scale(~"1, 0");
}
.open > .mega-dropdown-menu {
.scale(~"1, 1");
}
> .mega-align-center {
> .mega-dropdown-menu {
transform: scale(1,0) translate(-50%, 0);
-ms-transform: scale(1,0) translate(-50%, 0);
-webkit-transform: scale(1,0) translate(-50%, 0);
}
&.open > .mega-dropdown-menu {
transform: scale(1,1) translate(-50%, 0);
-ms-transform: scale(1,1) translate(-50%, 0);
-webkit-transform: scale(1,1) translate(-50%, 0);
}
}
}
}
&.slide {
.mega {
/* Level 0 */
&.animating > .mega-dropdown-menu {
overflow: hidden;
}
& > .mega-dropdown-menu {
& > div {
transition: all 400ms;
-webkit-transition: all 400ms;
-ms-transition: all 400ms;
-o-transition: all 400ms;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
margin-top: -100%;
}
}
&.open > .mega-dropdown-menu {
& > div {
margin-top: 0%;
}
}
/* Level > 0 */
.mega > .mega-dropdown-menu {
min-width: 0;
& > div {
min-width: 200px;
margin-top: 0;
margin-left: -500px;
}
}
.mega.open > .mega-dropdown-menu > div {
margin-left: 0;
}
}
}
}
}
Zerion Mini Shell 1.0