Your IP : 216.73.217.13
// --------------------------------------------------
// Module Styles
// --------------------------------------------------
//
// Genecric Module
// --------------------------------------------------
.t4-module {
padding: 0;
margin-top: $spacer-xl;
&:first-child {
margin-top: 0;
}
// Module Inner
.module-inner {
padding: 0;
}
}
// Module Title
// ------------
.module-title {
font-size: $font-size-base;
margin: 0;
padding: 0;
span {
display: inline-block;
}
}
// Module Content
// --------------
.module-ct,
.moduletable {
@include clearfix();
ul:last-child,
p:last-child {
margin-bottom: 0;
}
}
// Module Lists
// ------------
// Mixin: Use for quickly apply List styles in Modules
@mixin module-list($icon: "\f105") {
margin: 0;
padding: 0;
li {
list-style: none;
padding: 0;
margin: 0;
a {
display: block;
padding: $spacer-xs;
padding-left: calc(#{$spacer} + 16px);
position: relative;
&:before {
@include icon($icon);
text-align: left;
position: absolute;
left: 0;
}
// Link States
&:hover, &:active, &:focus {
text-decoration: none;
}
}
}
h4 {
font-size: $font-size-base;
font-weight: normal;
margin: 0;
}
}
// Module Tags
// ------------
// Mixin: Use for quickly apply Tag styles in Modules
@mixin module-tag($background: $gray-lighter, $color: $gray-darker) {
background: $background;
color: $color;
display: inline-block;
padding: $spacer-xs $spacer-sm;
@include border-radius($border-radius);
}
//
// Modules Prefixes
// -----------------------------
// Dark
// -----
.module-dark {
@extend .bg-dark;
color: rgba($white, $opacity-lv1);
.module-title {
color: $white;
span {
border-color: rgba($white,$opacity-lv1);
}
}
}
.module.bg-primary,
.module.bg-secondary,
.module.bg-success,
.module.bg-danger,
.module.bg-warning,
.module.bg-info,
.module.bg-dark,
// Cards
.card.bg-primary,
.card.bg-secondary,
.card.bg-success,
.card.bg-danger,
.card.bg-warning,
.card.bg-info,
.card.bg-dark {
color: rgba($white,$opacity-lv1);
.module-title {
border: 0;
color: $white;
margin-bottom: 0;
padding: $spacer $spacer 0;
span {
border-color: rgba($white,$opacity-lv1);
}
}
.module-ct {
padding: $spacer;
p {
margin: 0;
}
}
}
// Mod rounded
// -----------
.module.mod-rounded {
border-radius: 5px;
.mod-rounded {
border-radius: 0;
}
}
// Hilite
// ----------
.module-hilite {
}
// Card style
// -----------
.t4-card {
margin-bottom: $spacer;
.card-header {
font-size: $h5-font-size;
margin: 0;
padding: calc($spacer / 2) $spacer;
}
}
// Shadow
// ----------
// Use to add Shadow to modules
.mod-shadow {
box-shadow: $z-depth-1;
.mod-shadow {
box-shadow: none;
}
}
// Module outline
.mod-border {
border: 1px solid rgba(0,0,0,0.1);
padding: $spacer;
.mod-border {
border: 0;
padding: 0;
}
}
//
// JOOMLA! MODULES
// --------------------------------------------------
// Generic Modulable
// -----------------
// Modules are used in Component Position
.moduletable {
border: 1px solid $border-color;
padding: $card-spacer-x;
@include border-radius($border-radius);
margin: $spacer auto;
> h3 {
color: $body-color;
font-size: $font-size-base;
font-weight: $font-weight-bold;
margin: 0 0 $spacer 0;
padding: 0;
text-transform: uppercase;
}
}
// Menu
// ----
.t4-module,
.t4-card,
.moduletable,
.module_menu {
.nav {
}
.nav li {
display: block;
padding: 0;
margin: 0;
}
.nav li .separator {
padding: $spacer-xs;
display: block;
}
.nav li a {
display: block;
padding: $spacer-xs 0;
position: relative;
// Link States
&:hover, &:active, &:focus {
text-decoration: none;
}
}
// Active state
.nav > li.active > a {
font-weight: $font-weight-bold;
}
// Sub Menus
.nav li ul {
ul {
padding-left: $spacer;
}
&.small {
font-size: $font-size-base;
}
> li > a {
padding-left: $spacer;
// Adding icon
&:before {
@include icon($icon: "\f105");
position: absolute;
left: 2px;
}
}
> li.active > a {
color: $body-color;
font-weight: $font-weight-bold;
}
}
}
// Menus in Dark Modules
.module.bg-primary,
.module.bg-secondary,
.module.bg-success,
.module.bg-danger,
.module.bg-warning,
.module.bg-info,
.module.bg-dark,
// Cards
.card.bg-primary,
.card.bg-secondary,
.card.bg-success,
.card.bg-danger,
.card.bg-warning,
.card.bg-info,
.card.bg-dark {
.nav li a {
color: rgba($white,$opacity-lv2);
// Link States
&:hover, &:active, &:focus {
color: #fff;
}
}
}
// Login Form
// ----------
#login-form {
margin-bottom: 0;
// Input Icons
.add-on {
}
.btn-primary {
}
ul.unstyled {
margin-top: $spacer;
margin-bottom: $spacer;
padding: 0;
list-style: none;
}
.mod-login__username,
.mod-login__password,
.mod-login__twofactor {
input {
max-width: none;
@include media-breakpoint-up (md) {
max-width: 240px;
}
}
}
.mod-login__twofactor {
position: relative;
.btn {
position: absolute;
right: calc($spacer / 2);
bottom: 0;
}
}
#form-login-password {
}
#form-login-remember {
label {
font-weight: normal;
}
}
}
// Advertisement
// -------------
.bannergroup {
}
.banneritem {
a {
font-weight: bold;
}
}
.bannerfooter {
font-size: $font-size-sm;
padding-top: $spacer-sm;
text-align: right;
}
// Categories, Most Read,
// Most Popular, Archieve, Tags...
// -------------------------------
.categories-module {
@include module-list($icon: "\f07b");
> li {
padding-top: calc($spacer / 2);
padding-bottom: calc($spacer / 2);
h4 {
font-size: $font-size-base;
}
a {
padding-left: calc(#{$spacer} + 8px);
}
}
a {
color: $body-color;
&:hover, &:focus, &:active {
color: $link-hover-color;
}
}
}
.category-module {
@include module-list($icon: "\f15c");
a {
color: var(--body-text-color);
&:hover, &:focus, &:active {
color: var(--body-link-hover-color);
}
}
}
.mostread,
.latestnews,
.relateditems,
.tagssimilar ul {
@include module-list;
li a {
padding-left: calc(#{$spacer} + 4px);
}
}
.archive-module {
@include module-list($icon: "\f0f6");
}
// News Feed
// ----------
.feed {
// Feed Title
h4 {
font-weight: 600;
}
// Feed list
.newsfeed {
margin-top: $spacer-lg;
padding: 0;
li {
list-style: none;
padding: $spacer 0;
}
.feed-link {
font-size: $font-size-base;
font-weight: $font-weight-bold;
margin: 0;
}
.feed-item-description {
margin-top: $spacer-sm;
}
}
}
// Syndication
// -----------
a.syndicate-module {
background: $orange;
color: $white;
padding: $spacer-sm;
display: inline-block;
img {
display: none;
}
&:before {
@include icon("\f143");
margin-right: 5px;
}
// Link States
&:hover, &:active, &:focus {
text-decoration: none;
background: darken($orange,5%);
}
}
// Latest Users
// ------------
.latestusers {
margin: 0;
padding: 0;
li {
@include module-tag;
}
}
// Stats
// -----
.stats-module {
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin: 0;
dt, dd {
border-bottom: 1px solid $border-color;
margin: 0 0 calc($spacer / 2) 0;
padding-bottom: calc($spacer / 2);
}
dt {
font-weight: 600;
flex-basis: 35%;
}
dd {
flex-basis: 65%;
padding-left: calc($spacer/2);
}
}
// Popular Tags
//-------------
.tagspopular {
ul {
display: block;
margin: 0;
padding: 0;
list-style: none;
overflow: hidden;
}
ul > li {
color: grays();
display: block;
float: left;
margin: 0 5px 5px 0;
@include module-tag;
}
ul > li > a {
color: $gray-600;
line-height: 1;
// Links states
&:hover,
&:focus,
&:active {
color: $link-hover-color;
text-decoration: none;
}
}
.tag-count {
background-color: rgba(0,0,0,0.2);
border-radius: 2px;
font-size: $font-size-sm;
padding: 2px 3px;
}
}
// Breadcrums Module
// -----------------
.module-ct > ol.breadcrumb {
padding: $spacer-lg;
margin-left: 0;
}