PHP Classes

File: engine/modules/contrib/foundation/source/scss/components/_progress-bar.scss

Recommend this page to a friend!
  Classes of Aldo Tripiciano   Quanta CMS   engine/modules/contrib/foundation/source/scss/components/_progress-bar.scss   Download  
File: engine/modules/contrib/foundation/source/scss/components/_progress-bar.scss
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: Quanta CMS
Manage content that works without a database
Author: By
Last change:
Date: 5 years ago
Size: 1,309 bytes
 

Contents

Class file image Download
// Foundation for Sites by ZURB // foundation.zurb.com // Licensed under MIT Open Source /// Adds styles for a progress bar container. @mixin progress-container { height: $progress-height; margin-bottom: $progress-margin-bottom; border-radius: $progress-radius; background-color: $progress-background; } /// Adds styles for the inner meter of a progress bar. @mixin progress-meter { position: relative; display: block; width: 0%; height: 100%; background-color: $progress-meter-background; @if has-value($progress-radius) { border-radius: $global-radius; } } /// Adds styles for text in the progress meter. @mixin progress-meter-text { @include absolute-center; position: absolute; margin: 0; font-size: 0.75rem; font-weight: bold; color: $white; white-space: nowrap; @if has-value($progress-radius) { border-radius: $progress-radius; } } @mixin foundation-progress-bar { // Progress bar .progress { @include progress-container; @each $name, $color in $foundation-palette { &.#{$name} { .progress-meter { background-color: $color; } } } } // Inner meter .progress-meter { @include progress-meter; } // Inner meter text .progress-meter-text { @include progress-meter-text; } }