File: css/LESS/_spt-settings.less

Recommend this page to a friend!
  Classes of David Whitworth   Advanced jQuery Scroll Progress Tracker   css/LESS/_spt-settings.less   Download  
File: css/LESS/_spt-settings.less
Role: Auxiliary data
Content type: text/plain
Description: LESS stylesheet with additional configuration
Class: Advanced jQuery Scroll Progress Tracker
Show side bar with the page scroll progress
Author: By
Last change: Version 1.2.1
Date: 3 years ago
Size: 5,412 bytes
 

Contents

Class file image Download
//------------------------------------------------------------------------------------- // LESS settings //------------------------------------------------------------------------------------- // Created 2016-08-10 // Changed 2016-08-16 // Authors David Whitworth | David@Whitworth.de //------------------------------------------------------------------------------------- // Version 1.0 //------------------------------------------------------------------------------------- // 2016-08-10 Created // 2016-08-15 DW added the colors for the sourcecode blocks of the ReadMe; // 2016-08-16 DW added the sourcecode color for comments; // removed a theme and adjusted the remaining three a bit //------------------------------------------------------------------------------------- // Version 1.1 //------------------------------------------------------------------------------------- // 2016-08-19 DW adjusted the DARK theme // 2016-08-22 DW changed the names of all classes and ids to prevent possible // conflicts with other plugins //------------------------------------------------------------------------------------- // Version 1.2 //------------------------------------------------------------------------------------- // 2016-08-23 DW adjusted some color values // 2016-09-02 DW removed the sourcecode colors (moved to individual stylesheet) //------------------------------------------------------------------------------------- // Copyright © 2016 //------------------------------------------------------------------------------------- // COLORS --> // general @color-black: #000000; @color-white: #ffffff; @color-anthracite: lighten(@color-black, 15%); @color-lightgray: darken(@color-white, 10%); @color-red: #e70000; @color-green: #99cc33; @color-blue: #3399cc; @color-orange: #fc8b00; @color-magenta: #e50051; @color-silver: darken(@color-lightgray, 10%); // Dynamic text color (based on background color) .dynText (@a) when (lightness(@a) >= 50%) { color: @color-anthracite; } .dynText (@a) when (lightness(@a) < 50%) { color: @color-lightgray; } .dynText (@a) { background-color: @a; } // Dynamic background color (based on text color) .dynBack (@a) when (lightness(@a) >= 50%) { background-color: lighten(@color-anthracite, 15%); } .dynBack (@a) when (lightness(@a) < 50%) { background-color: @color-lightgray; } .dynBack (@a) { color: @a; } // Theme colors (configuration) // Theme: DEFAULT // Main color: orange @color-main-DEFAULT: @color-orange; @color-foreground-DEFAULT: @color-black; @color-background-DEFAULT: @color-white; @color-highlight-DEFAULT: @color-red; // Theme: DARK // Main color: black @color-main-DARK: @color-anthracite; @color-foreground-DARK: darken(@color-lightgray, 10%); @color-background-DARK: @color-black; @color-highlight-DARK: @color-orange; // Theme: BLUE // Main color: blue @color-main-BLUE: @color-blue; @color-foreground-BLUE: darken(@color-blue, 30%); @color-background-BLUE: lighten(@color-blue, 42%); @color-highlight-BLUE: @color-green; // Theme colors (selection) // ——— INSERT THEME NAME HERE!! @color-main: @color-main-DEFAULT; // <—— Change this! @color-foreground: @color-foreground-DEFAULT; // <—— Change this! @color-background: @color-background-DEFAULT; // <—— Change this! @color-highlight: @color-highlight-DEFAULT; // <—— Change this! // <-- COLORS //——————————————————————————————————————————————————————————————————————————— // PARAMETERS --> // Gradients .spt-gradient2Stops (@origin: top, @direction: to bottom, @type: 0, @1stStop: 0%, @2ndStop: 100%, @color1: @color-main, @color2: darken(@color1, 12%)) { background: @color1; /* Old browsers */ background: -moz-linear-gradient(@origin, @color1 @1stStop, @color2 @2ndStop); /* FF3.6-15 */ background: -webkit-linear-gradient(@origin, @color1 @1stStop, @color2 @2ndStop); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(@direction, @color1 @1stStop, @color2 @2ndStop); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@color1', endColorstr='@color2',GradientType=@type ); /* IE6-8 */ } .spt-gradient3Stops (@origin: top, @direction: to bottom, @type: 0, @1stStop: 0%, @2ndStop: 50%, @3rdStop: 100%, @color2: lighten(@color1, 30%), @color1: @color-main, @color3: darken(@color1, 20%)) { background: @color1; /* Old browsers */ background: -moz-linear-gradient(@origin, @color2 @1stStop, @color1 @2ndStop, @color3 @3rdStop); /* FF3.6-15 */ background: -webkit-linear-gradient(@origin, @color2 @1stStop, @color1 @2ndStop, @color3 @3rdStop); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(@direction, @color2 @1stStop, @color1 @2ndStop, @color3 @3rdStop); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@color2', endColorstr='@color3',GradientType=@type ); /* IE6-8 */ } // <-- PARAMETERS