mirror/mini-css
1
0
Fork 0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-08-02 12:00:36 +02:00
Code Issues Releases Wiki Activity

Navigation module cleanup

Browse Source
This commit is contained in:
Angelos Chalaris
2016-11-10 10:55:44 +02:00
parent f8ad9526af
commit 3d2fac7582
2 changed files with 80 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/v2/DEVLOG.md
View File

@@ -389,4 +389,5 @@
- Restructured `form`, `button` and `checkbox` into one module: `input_control`. Made necessary changes for this to work properly. - Restructured `form`, `button` and `checkbox` into one module: `input_control`. Made necessary changes for this to work properly.
- Code cleanup in `progress`. Merged `spinner` into `progress`. Removed `spinner-dot` from the `spinner` module as it was not a great component. - Code cleanup in `progress`. Merged `spinner` into `progress`. Removed `spinner-dot` from the `spinner` module as it was not a great component.
- Code cleanup for `contextual`. Minor `mark` optimizations. Added `alert` mixin `make-alert-alt-style` for alternative `alert` styles. - Code cleanup for `contextual`. Minor `mark` optimizations. Added `alert` mixin `make-alert-alt-style` for alternative `alert` styles.
- Removed `spinner` file. - Removed `spinner` file.
- Cleanup for `navigation`.

156
src/mini/_navigation.scss
View File

@@ -6,97 +6,97 @@ header {
height: $header-height; height: $header-height;
background: $header-back-color; background: $header-back-color;
color: $header-fore-color; color: $header-fore-color;
@if $header-margin != 0 { @if $header-margin != 0 {
margin: $header-margin; margin: $header-margin;
} }
@if $header-padding != 0 { @if $header-padding != 0 {
padding: $header-padding; padding: $header-padding;
} }
// Reposnivenes for smaller displays, scrolls horizontally. // Reposnivenes for smaller displays, scrolls horizontally.
white-space: nowrap; white-space: nowrap;
overflow-x: auto; overflow-x: auto;
overflow-y: hidden; overflow-y: hidden;
// Header logo styling. // Header logo styling.
.#{$header-logo-name} { .#{$header-logo-name} {
color: $header-fore-color; color: $header-fore-color; // Keep this in case people use SVGs? Is it necessary?
@if $header-logo-font-size != $base-font-size { @if $header-logo-font-size != $base-font-size {
font-size: $header-logo-font-size; font-size: $header-logo-font-size;
} }
@if $header-logo-line-height != $base-line-height { @if $header-logo-line-height != $base-line-height {
line-height: $header-logo-line-height; line-height: $header-logo-line-height;
} }
@if $header-logo-margin != 0 { @if $header-logo-margin != 0 {
margin: $header-logo-margin; margin: $header-logo-margin;
} }
@if $header-logo-padding != 0 { @if $header-logo-padding != 0 {
padding: $header-logo-padding; padding: $header-logo-padding;
} }
} }
button, [type="button"], a.#{$button-class-name}, label.#{$button-class-name}, .#{$button-class-name} { button, [type="button"], a.#{$button-class-name}, label.#{$button-class-name}, .#{$button-class-name} {
background: $header-back-color; background: $header-back-color;
color: $header-fore-color; color: $header-fore-color;
vertical-align: top; vertical-align: top;
@if $header-link-margin != 0 { @if $header-link-margin != 0 {
margin: $header-link-margin; margin: $header-link-margin;
} }
&:hover, &:active, &:focus { &:hover, &:active, &:focus {
background: $header-link-hover-color; background: $header-link-hover-color;
} }
} }
@if $apply-link-underline { // Override for links if underline is enabled. @if $apply-link-underline { // Override for links if underline is enabled.
.#{$header-logo-name}, a.#{$button-class-name} { .#{$header-logo-name}, a.#{$button-class-name} {
text-decoration: none; text-decoration: none;
} }
} }
} }
// Navigation sidebar styling. // Navigation sidebar styling.
nav { nav {
display: block; // Correct display for older versions of IE. display: block; // Correct display for older versions of IE.
@if $nav-back-color != $back-color { @if $nav-back-color != $back-color {
background: $nav-back-color; background: $nav-back-color;
} }
@if $nav-fore-color != $fore-color { @if $nav-fore-color != $fore-color {
color: $nav-fore-color; color: $nav-fore-color;
} }
@if $nav-border-style != 0 { @if $nav-border-style != 0 {
border: $nav-border-style; border: $nav-border-style;
} }
@if $nav-border-radius != 0 { @if $nav-border-radius != 0 {
border-radius: $nav-border-radius; border-radius: $nav-border-radius;
} }
@if $nav-margin != 0 { @if $nav-margin != 0 {
margin: $nav-margin; margin: $nav-margin;
} }
@if $nav-padding != 0 { @if $nav-padding != 0 {
padding: $nav-padding; padding: $nav-padding;
} }
a, a:visited { a, a:visited {
display: block; display: block;
color: $nav-link-fore-color; color: $nav-link-fore-color;
} }
// Subcategories in navigation. // Subcategories in navigation.
$nav-sublink-prefix: 'sublink' !default; // Prefix for the subcategory tabs in nav $nav-sublink-prefix: 'sublink' !default; // Prefix for the subcategory tabs in nav
$nav-sublink-depth: 2 !default; // Amount of subcategory classes to add $nav-sublink-depth: 2 !default; // Amount of subcategory classes to add
$nav-sublink-padding-left: 12px !default; // Left padding to add to subcategories $nav-sublink-padding-left: 12px !default; // Left padding to add to subcategories
@for $i from 1 through $nav-sublink-depth { @for $i from 1 through $nav-sublink-depth {
.#{$nav-sublink-prefix}-#{$i} { .#{$nav-sublink-prefix}-#{$i} {
padding-left: $i * $nav-sublink-padding-left; padding-left: $i * $nav-sublink-padding-left;
} }
} }
} }
// Footer styling. // Footer styling.
footer { footer {
display: block; // Correct display for older versions of IE. display: block; // Correct display for older versions of IE.
background: $footer-back-color; background: $footer-back-color;
color: $footer-fore-color; color: $footer-fore-color;
@if $footer-margin != 0 { @if $footer-margin != 0 {
margin: $footer-margin; margin: $footer-margin;
} }
@if $footer-padding != 0 { @if $footer-padding != 0 {
padding: $footer-padding; padding: $footer-padding;
} }
font-size: $footer-font-size; font-size: $footer-font-size;
a, a:visited { a, a:visited {
color: $footer-link-fore-color; color: $footer-link-fore-color;
} }
} }