[Build] Switch compass to bourbon

Change mixin library to bourbon.  Significantly reduces sass build time.

https://github.com/nasa/openmctweb/issues/698
This commit is contained in:
Pete Richards 2016-02-22 18:02:16 -08:00
parent 87934df0d5
commit 0a71835687
48 changed files with 176 additions and 370 deletions

View File

@ -1,6 +0,0 @@
source "https://rubygems.org"
group :development do
gem "compass", ">= 1.0.3"
gem "sass", "~> 3.4.18"
end

View File

@ -1,32 +0,0 @@
GEM
remote: https://rubygems.org/
specs:
chunky_png (1.3.5)
compass (1.0.3)
chunky_png (~> 1.2)
compass-core (~> 1.0.2)
compass-import-once (~> 1.0.5)
rb-fsevent (>= 0.9.3)
rb-inotify (>= 0.9)
sass (>= 3.3.13, < 3.5)
compass-core (1.0.3)
multi_json (~> 1.0)
sass (>= 3.3.0, < 3.5)
compass-import-once (1.0.5)
sass (>= 3.2, < 3.5)
ffi (1.9.10)
multi_json (1.11.2)
rb-fsevent (0.9.7)
rb-inotify (0.9.7)
ffi (>= 0.5.0)
sass (3.4.21)
PLATFORMS
ruby
DEPENDENCIES
compass (>= 1.0.3)
sass (~> 3.4.18)
BUNDLED WITH
1.10.6

View File

@ -1,26 +0,0 @@
# Require any additional compass plugins here.
# require "compass-growl"
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "js"
# You can select your preferred output style here (can be overridden via the command line):
# :expanded, :compressed, :nested
output_style = :nested
# To enable relative paths to assets via compass helper functions. Uncomment:
relative_assets = true
# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
# preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass vfn_platform/static/sass scss && rm -rf sass && mv scss sass

View File

@ -1,103 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** FEATURES */
/************************** VERY INFLUENTIAL GLOBAL DIMENSIONS */
/************************** RATIOS */
/************************** LAYOUT */
/************************** CONTROLS */
/************************** PATHS */
/************************** TIMINGS */
/************************** LIMITS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
/************************** MOBILE TREE MENU DIMENSIONS */
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS/REPRESENTATIONS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* REQUIRES mobile/_constants */
@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
/* line 28, ../sass/mobile-example.scss */
.create-btn-holder {
display: block !important; } }

View File

@ -24,7 +24,9 @@
var gulp = require('gulp'), var gulp = require('gulp'),
requirejsOptimize = require('gulp-requirejs-optimize'), requirejsOptimize = require('gulp-requirejs-optimize'),
sourcemaps = require('gulp-sourcemaps'), sourcemaps = require('gulp-sourcemaps'),
compass = require('gulp-compass'), rename = require('gulp-rename'),
sass = require('gulp-sass'),
neat = require('node-neat'),
jshint = require('gulp-jshint'), jshint = require('gulp-jshint'),
jscs = require('gulp-jscs'), jscs = require('gulp-jscs'),
replace = require('gulp-replace-task'), replace = require('gulp-replace-task'),
@ -38,7 +40,7 @@ var gulp = require('gulp'),
main: 'main.js', main: 'main.js',
dist: 'dist', dist: 'dist',
assets: 'dist/assets', assets: 'dist/assets',
scss: 'platform/**/*.scss', scss: ['./platform/**/*.scss', './example/**/*.scss'],
scripts: [ 'main.js', 'platform/**/*.js', 'src/**/*.js' ], scripts: [ 'main.js', 'platform/**/*.js', 'src/**/*.js' ],
static: [ static: [
'index.html', 'index.html',
@ -57,10 +59,8 @@ var gulp = require('gulp'),
configFile: path.resolve(__dirname, 'karma.conf.js'), configFile: path.resolve(__dirname, 'karma.conf.js'),
singleRun: true singleRun: true
}, },
compass: { sass: {
sass: __dirname, includePaths: neat.includePaths
css: paths.assets,
sourcemap: true
}, },
replace: { replace: {
variables: { variables: {
@ -70,59 +70,29 @@ var gulp = require('gulp'),
branch: fs.existsSync('.git') ? git.branch() : 'Unknown' branch: fs.existsSync('.git') ? git.branch() : 'Unknown'
} }
} }
},
stream = require('stream');
/**
* Returns a transform stream that allows us to customize the destination
* paths for individual sass files. Wraps compass.
*/
function customCompass() {
var compassWrapper = new stream.Transform({objectMode: true});
compassWrapper._transform = function (chunk, encoding, done) {
if (/\/_[^\/]*.scss$/.test(chunk.path)) {
return done();
}
var baseDir = 'platform/' + chunk.relative.replace(/sass\/.*$/, ''),
options = {
project: __dirname,
sass: baseDir + 'sass/',
css: baseDir + 'css/',
comments: true,
bundle_exec: true
}; };
compass(options)
.on('data', function (file) {
this.push(file);
}.bind(this))
.on('error', done)
.on('end', done)
.end(chunk);
};
return compassWrapper;
}
gulp.task('scripts', function () { gulp.task('scripts', function () {
return gulp.src(paths.main) return gulp.src(paths.main)
.pipe(sourcemaps.init()) .pipe(sourcemaps.init())
.pipe(requirejsOptimize(options.requirejsOptimize)) .pipe(requirejsOptimize(options.requirejsOptimize))
.pipe(sourcemaps.write('.')) .pipe(sourcemaps.write('.'))
.pipe(replace(options.replace)) .pipe(replace(options.replace))
.pipe(gulp.dest(paths.dist)); .pipe(gulp.dest(paths));
}); });
gulp.task('test', function (done) { gulp.task('test', function (done) {
new karma.Server(options.karma, done).start(); new karma.Server(options.karma, done).start();
}); });
gulp.task('compass');
gulp.task('stylesheets', function () { gulp.task('stylesheets', function () {
return gulp.src(paths.scss) return gulp.src(paths.scss, {base: '.'})
.pipe(customCompass()); .pipe(sass(options.sass))
.pipe(rename(function (file) {
file.dirname = file.dirname.replace('/sass', '/css');
return file;
}))
.pipe(gulp.dest(__dirname));
}); });
gulp.task('lint', function () { gulp.task('lint', function () {

View File

@ -11,11 +11,12 @@
"git-rev-sync": "^1.4.0", "git-rev-sync": "^1.4.0",
"glob": ">= 3.0.0", "glob": ">= 3.0.0",
"gulp": "^3.9.0", "gulp": "^3.9.0",
"gulp-compass": "^2.1.0",
"gulp-jscs": "^3.0.2", "gulp-jscs": "^3.0.2",
"gulp-jshint": "^2.0.0", "gulp-jshint": "^2.0.0",
"gulp-rename": "^1.2.2",
"gulp-replace-task": "^0.11.0", "gulp-replace-task": "^0.11.0",
"gulp-requirejs-optimize": "^0.3.1", "gulp-requirejs-optimize": "^0.3.1",
"gulp-sass": "^2.2.0",
"gulp-sourcemaps": "^1.6.0", "gulp-sourcemaps": "^1.6.0",
"jasmine-core": "^2.3.0", "jasmine-core": "^2.3.0",
"jsdoc": "^3.3.2", "jsdoc": "^3.3.2",
@ -33,6 +34,8 @@
"marked": "^0.3.5", "marked": "^0.3.5",
"mkdirp": "^0.5.1", "mkdirp": "^0.5.1",
"moment": "^2.11.1", "moment": "^2.11.1",
"node-bourbon": "^4.2.3",
"node-neat": "^1.7.2",
"phantomjs": "^1.9.19", "phantomjs": "^1.9.19",
"requirejs": "^2.1.17", "requirejs": "^2.1.17",
"split": "^1.0.0" "split": "^1.0.0"
@ -45,7 +48,7 @@
"jsdoc": "jsdoc -c jsdoc.json -r -d target/docs/api", "jsdoc": "jsdoc -c jsdoc.json -r -d target/docs/api",
"otherdoc": "node docs/gendocs.js --in docs/src --out target/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'", "otherdoc": "node docs/gendocs.js --in docs/src --out target/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'",
"docs": "npm run jsdoc ; npm run otherdoc", "docs": "npm run jsdoc ; npm run otherdoc",
"prepublish": "./node_modules/bower/bin/bower install && bundle install && ./node_modules/gulp/bin/gulp.js install" "prepublish": "./node_modules/bower/bin/bower install && ./node_modules/gulp/bin/gulp.js install"
}, },
"repository": { "repository": {
"type": "git", "type": "git",

View File

@ -34,7 +34,7 @@
.cols { .cols {
@include clearfix; @include clearfix;
.col { .col {
@include box-sizing(border-box); box-sizing: border-box;
@include clearfix; @include clearfix;
float: left; float: left;
margin-left: $ueColMargin; margin-left: $ueColMargin;
@ -94,7 +94,7 @@
/********************************************* FLEX STYLES */ /********************************************* FLEX STYLES */
.l-flex-row, .l-flex-row,
.l-flex-col { .l-flex-col {
@include display-flex; @include display(flex);
@include flex-wrap(nowrap); @include flex-wrap(nowrap);
.flex-elem { .flex-elem {
min-height: 0; // Needed to allow element to shrink within parent min-height: 0; // Needed to allow element to shrink within parent
@ -111,7 +111,7 @@
} }
.flex-container { .flex-container {
// Apply to wrapping elements, mct-includes, etc. // Apply to wrapping elements, mct-includes, etc.
@include display-flex; @include display(flex);
@include flex-wrap(nowrap); @include flex-wrap(nowrap);
@include flex(1 1 auto); @include flex(1 1 auto);
min-height:0; min-height:0;

View File

@ -64,7 +64,7 @@
white-space: nowrap; white-space: nowrap;
.l-autoflow-col { .l-autoflow-col {
// @include test(); // @include test();
@include box-sizing(border-box); box-sizing: border-box;
border-left: 1px solid $colorInteriorBorder; border-left: 1px solid $colorInteriorBorder;
display: inline-block; display: inline-block;
// height: 100%; // height: 100%;
@ -74,7 +74,7 @@
width: $colW; width: $colW;
.l-autoflow-row { .l-autoflow-row {
// @include test(red); // @include test(red);
@include box-sizing(border-box); box-sizing: border-box;
border-bottom: 1px solid rgba(#fff,0.05); border-bottom: 1px solid rgba(#fff,0.05);
display: block; display: block;
height: $rowH; height: $rowH;
@ -110,7 +110,7 @@
width: auto; width: auto;
} }
&.r { &.r {
@include border-radius($smallCr); border-radius: $smallCr;
float: right; float: right;
margin-left: $interiorMargin; margin-left: $interiorMargin;
padding-left: $valPad; padding-left: $valPad;

View File

@ -27,7 +27,7 @@
} }
.top-bar .badge { .top-bar .badge {
@include border-radius($controlCr * 1.5); border-radius: $controlCr * 1.5;
$h: $btnStdH; //$ueTopBarBtnH; // - 5px; $h: $btnStdH; //$ueTopBarBtnH; // - 5px;
font-size: 1.4em; font-size: 1.4em;
height: $h; height: $h;
@ -39,7 +39,7 @@
//.top-bar .btn-browse .badge { //.top-bar .btn-browse .badge {
// Moved to _controls.scss .btn.browse-btn // Moved to _controls.scss .btn.browse-btn
// @include border-radius($controlCr * 1.5); // border-radius: $controlCr * 1.5;
// $d: 20px; // $d: 20px;
// display: block; // display: block;
// font-size: 1em; // font-size: 1em;
@ -53,7 +53,7 @@
.super-menu .badge { .super-menu .badge {
@include background-image(linear-gradient(lighten($colorCreateBtn, 10%), $colorCreateBtn)); @include background-image(linear-gradient(lighten($colorCreateBtn, 10%), $colorCreateBtn));
@include border-radius($controlCr); border-radius: $controlCr;
@include boxShdwSubtle(); @include boxShdwSubtle();
// display: inline-block; // display: inline-block;
// margin-right: 10px !important; // margin-right: 10px !important;

View File

@ -21,7 +21,7 @@
*****************************************************************************/ *****************************************************************************/
.disabled, .disabled,
a.disabled { a.disabled {
@include opacity($controlDisabledOpacity); opacity: $controlDisabledOpacity;
pointer-events: none !important; pointer-events: none !important;
cursor: default !important; cursor: default !important;
} }

View File

@ -61,7 +61,7 @@
.l-fixed-position-box, .l-fixed-position-box,
.l-fixed-position-image, .l-fixed-position-image,
.l-fixed-position-text { .l-fixed-position-text {
@include box-sizing(border-box); box-sizing: border-box;
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
@ -89,7 +89,7 @@
.l-elem { .l-elem {
//@include absPosDefault($p); //@include absPosDefault($p);
//@include absPosDefault(0); //@include absPosDefault(0);
@include box-sizing(border-box); box-sizing: border-box;
display: block; display: block;
padding: 2px; padding: 2px;
//width: 50%; //width: 50%;
@ -106,7 +106,7 @@
// @include test(blue); // @include test(blue);
// right: $p; // right: $p;
// left: auto; // left: auto;
@include border-radius($smallCr); border-radius: $smallCr;
$valPad: 5px; $valPad: 5px;
float: right; float: right;
margin-left: $interiorMargin; margin-left: $interiorMargin;
@ -125,7 +125,7 @@
.l-fixed-position-item-handle { .l-fixed-position-item-handle {
$brd: 1px solid $colorKey; $brd: 1px solid $colorKey;
// @include border-radius($controlCr); // border-radius: $controlCr;
background: rgba($colorKey, 0.5); background: rgba($colorKey, 0.5);
cursor: crosshair; cursor: crosshair;
border: $brd; border: $brd;

View File

@ -139,7 +139,7 @@ mct-container {
} }
.ds { .ds {
@include box-shadow(rgba(#000, 0.7) 0 4px 10px 2px); box-shadow: rgba(#000, 0.7) 0 4px 10px 2px;
} }
.hide, .hide,

View File

@ -93,7 +93,7 @@
height: auto; width: auto; height: auto; width: auto;
position: absolute; position: absolute;
left: 0; top: 0; right: 0; bottom: 10%; left: 0; top: 0; right: 0; bottom: 10%;
@include transform-origin(bottom, left); @include transform-origin(bottom left);
@include transform(scale(0.3)); @include transform(scale(0.3));
z-index: 2; z-index: 2;
} }

View File

@ -58,7 +58,7 @@
} }
ul { ul {
@include box-sizing(border-box); box-sizing: border-box;
padding-right: $interiorMargin; padding-right: $interiorMargin;
} }
@ -73,7 +73,7 @@
} }
em { em {
@include border-radius($basicCr); border-radius: $basicCr;
background-color: $colorInspectorSectionHeaderBg; background-color: $colorInspectorSectionHeaderBg;
color: $colorInspectorSectionHeaderFg; color: $colorInspectorSectionHeaderFg;
margin-bottom: $interiorMargin; margin-bottom: $interiorMargin;
@ -99,7 +99,7 @@
.inspector-location { .inspector-location {
.location-item { .location-item {
$h: 1.2em; $h: 1.2em;
@include box-sizing(border-box); box-sizing: border-box;
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
line-height: $h; line-height: $h;

View File

@ -175,8 +175,8 @@
@mixin sliderTrack($bg: $scrollbarTrackColorBg) { @mixin sliderTrack($bg: $scrollbarTrackColorBg) {
//$b: 1px solid lighten($bg, 30%); //$b: 1px solid lighten($bg, 30%);
@include border-radius(2px); border-radius: 2px;
@include box-sizing(border-box); box-sizing: border-box;
@include boxIncised(0.7); @include boxIncised(0.7);
background-color: $bg; background-color: $bg;
//border-bottom: $b; //border-bottom: $b;
@ -210,7 +210,7 @@
} }
@mixin boxIncised($sVal: 0.6, $inset: 5px) { @mixin boxIncised($sVal: 0.6, $inset: 5px) {
@include box-shadow(inset rgba(black, $sVal) 0 1px $inset); box-shadow: inset rgba(black, $sVal) 0 1px $inset;
} }
@mixin boxOutline($c: lighten($colorBodyBg, 20%)) { @mixin boxOutline($c: lighten($colorBodyBg, 20%)) {
@ -219,24 +219,24 @@
@mixin boxShdw($sVal: rgba(black, 0.4) 0 0 3px) { @mixin boxShdw($sVal: rgba(black, 0.4) 0 0 3px) {
@if $sVal != 'none' { @if $sVal != 'none' {
@include box-shadow($sVal); box-shadow: $sVal;
} }
} }
@mixin boxShdwSubtle($sVal: 0.2) { @mixin boxShdwSubtle($sVal: 0.2) {
@if $sVal != 'none' { @if $sVal != 'none' {
@include box-shadow(rgba(black, $sVal) 0 1px 2px); box-shadow: rgba(black, $sVal) 0 1px 2px;
} }
} }
@mixin boxShdwLarge($sVal: 0.7) { @mixin boxShdwLarge($sVal: 0.7) {
@if $sVal != 'none' { @if $sVal != 'none' {
@include box-shadow(rgba(black, $sVal) 0 3px 10px); box-shadow: rgba(black, $sVal) 0 3px 10px;
} }
} }
@mixin outerGlow($color: #fff, $sVal: 0.3) { @mixin outerGlow($color: #fff, $sVal: 0.3) {
@include box-shadow(rgba($color, $sVal) 0 0 30px); box-shadow: rgba($color, $sVal) 0 0 30px;
} }
@mixin linearGlow($deg: 0, $c: red, $a: 0.4) { @mixin linearGlow($deg: 0, $c: red, $a: 0.4) {
@ -249,18 +249,18 @@
@mixin txtShdw($sVal) { @mixin txtShdw($sVal) {
//@if $sVal != 'none' { //@if $sVal != 'none' {
@include text-shadow($sVal); text-shadow: $sVal;
//} //}
} }
@mixin txtShdwSubtle($sVal: 0.1) { @mixin txtShdwSubtle($sVal: 0.1) {
@if $sVal != 'none' { @if $sVal != 'none' {
@include text-shadow(rgba(black, $sVal) 0 1px 2px); text-shadow: rgba(black, $sVal) 0 1px 2px;
} }
} }
@mixin txtShdwLarge($sVal: 0.7) { @mixin txtShdwLarge($sVal: 0.7) {
@include text-shadow(rgba(black, $sVal) 0 3px 7px); text-shadow: rgba(black, $sVal) 0 3px 7px;
} }
@function pullForward($c, $p: 20%) { @function pullForward($c, $p: 20%) {
@ -291,8 +291,8 @@
@mixin containerBase($bg: $colorBodyBg, $fg: $colorBodyFg) { @mixin containerBase($bg: $colorBodyBg, $fg: $colorBodyFg) {
background-color: $bg; background-color: $bg;
@include border-radius($controlCr); border-radius: $controlCr;
@include box-sizing(border-box); box-sizing: border-box;
color: $fg; color: $fg;
display: inline-block; display: inline-block;
} }
@ -316,9 +316,9 @@
@mixin input-base($bg: $colorInputBg, $fg: $colorInputFg, $shdw: rgba(black, 0.6) 0 1px 3px) { @mixin input-base($bg: $colorInputBg, $fg: $colorInputFg, $shdw: rgba(black, 0.6) 0 1px 3px) {
@include appearance(none); @include appearance(none);
@include border-radius($controlCr); border-radius: $controlCr;
@include box-sizing(border-box); box-sizing: border-box;
@include box-shadow(inset $shdw); box-shadow: inset $shdw;
background: $bg; background: $bg;
border: none; border: none;
color: $fg; color: $fg;
@ -334,7 +334,7 @@
} }
@mixin contextArrow() { @mixin contextArrow() {
@include text-shadow(none); text-shadow: none;
content: '\76'; content: '\76';
display: inline-block; display: inline-block;
font-family: 'symbolsfont'; font-family: 'symbolsfont';
@ -407,13 +407,13 @@
} }
@mixin tmpBorder($c: #ffcc00, $a: 0.75) { @mixin tmpBorder($c: #ffcc00, $a: 0.75) {
@include box-sizing(border-box); box-sizing: border-box;
border: 1px dotted rgba($c, $a); border: 1px dotted rgba($c, $a);
} }
@mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) { @mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) {
&:after { &:after {
@include box-sizing(border-box); box-sizing: border-box;
@include bgDiagonalStripes($c, $a); @include bgDiagonalStripes($c, $a);
color: rgba(white, 0.3); color: rgba(white, 0.3);
font-style: italic; font-style: italic;

View File

@ -8,9 +8,9 @@
.l-breadcrumb-item { .l-breadcrumb-item {
//@include test(); //@include test();
a { a {
@include box-sizing(border-box); box-sizing: border-box;
@include border-radius($basicCr*.75); border-radius: $basicCr*.75;
@include single-transition(background-color, 0.25s); @include transition(background-color, 0.25s);
color: darken($colorBodyFg, 15%); color: darken($colorBodyFg, 15%);
display: inline-block; display: inline-block;
//margin-right: $interiorMargin; //margin-right: $interiorMargin;

View File

@ -32,7 +32,7 @@ $pad: $interiorMargin * $baseRatio;
} }
.s-btn { .s-btn {
@include box-sizing(border-box); box-sizing: border-box;
padding: 0 $pad; padding: 0 $pad;
font-size: 0.7rem; font-size: 0.7rem;
vertical-align: top; vertical-align: top;
@ -126,9 +126,9 @@ $pad: $interiorMargin * $baseRatio;
$cFg: $cBg; $cFg: $cBg;
@include border-radius($basicCr); border-radius: $basicCr;
//@include boxShdw($shdwBtns); //@include boxShdw($shdwBtns);
@include box-sizing(border-box); box-sizing: border-box;
@include trans-prop-nice((color, background-color), 100ms); @include trans-prop-nice((color, background-color), 100ms);
color: $cFg; color: $cFg;
cursor: pointer; cursor: pointer;
@ -264,7 +264,7 @@ $pad: $interiorMargin * $baseRatio;
font-size: 0; // Remove space between s-btn elements due to white space in markup font-size: 0; // Remove space between s-btn elements due to white space in markup
.s-btn { .s-btn {
@include border-radius(0); border-radius: 0;
margin-left: 1px; margin-left: 1px;
} }

View File

@ -25,7 +25,7 @@
$m: 1; $m: 1;
$colorSelectedColor: #fff; $colorSelectedColor: #fff;
@include box-sizing(border-box); box-sizing: border-box;
padding: $interiorMargin !important; padding: $interiorMargin !important;
.l-palette-row { .l-palette-row {
@ -34,7 +34,7 @@
width: ($d * $colorsPerRow) + ($m * $colorsPerRow); width: ($d * $colorsPerRow) + ($m * $colorsPerRow);
.l-palette-item { .l-palette-item {
@include box-sizing(border-box); box-sizing: border-box;
@include txtShdwSubtle(0.8); @include txtShdwSubtle(0.8);
@include trans-prop-nice-fade(0.25s); @include trans-prop-nice-fade(0.25s);
border: 1px solid transparent; border: 1px solid transparent;

View File

@ -28,8 +28,8 @@
} }
.accordion-head { .accordion-head {
$op: 0.2; $op: 0.2;
@include border-radius($basicCr * 0.75); border-radius: $basicCr * 0.75;
@include box-sizing("border-box"); box-sizing: "border-box";
background: rgba($colorBodyFg, $op); background: rgba($colorBodyFg, $op);
cursor: pointer; cursor: pointer;
font-size: 0.75em; font-size: 0.75em;
@ -84,7 +84,7 @@
.l-control-group { .l-control-group {
// Buttons that have a conceptual grouping - internal space between, and a divider between groups. // Buttons that have a conceptual grouping - internal space between, and a divider between groups.
// @include test(); // @include test();
@include box-sizing(border-box); box-sizing: border-box;
border-left: 1px solid $colorInteriorBorder; border-left: 1px solid $colorInteriorBorder;
display: inline-block; display: inline-block;
padding: 0 $interiorMargin; padding: 0 $interiorMargin;
@ -125,9 +125,9 @@ label.checkbox.custom {
height: $d; height: $d;
min-width: $d; min-width: $d;
&:before { &:before {
@include border-radius($basicCr * .75); border-radius: $basicCr * .75;
background: $bg; background: $bg;
@include box-shadow(inset rgba(black, 0.4) 0 1px 2px); box-shadow: inset rgba(black, 0.4) 0 1px 2px;
box-sizing: border-box; box-sizing: border-box;
content: " "; content: " ";
font-family: 'symbolsfont'; font-family: 'symbolsfont';
@ -182,7 +182,7 @@ label.checkbox.custom {
.item .checkbox { .item .checkbox {
&.checked label { &.checked label {
@include box-shadow(none); box-shadow: none;
border-bottom: none; border-bottom: none;
} }
} }
@ -293,13 +293,13 @@ label.checkbox.custom {
} }
.s-progress-bar { .s-progress-bar {
@include border-radius($basicCr); border-radius: $basicCr;
@include boxIncised(0.3, 4px); @include boxIncised(0.3, 4px);
background: $colorProgressBarOuter; background: $colorProgressBarOuter;
.progress-amt { .progress-amt {
@include border-radius($basicCr); border-radius: $basicCr;
@include boxShdw(); @include boxShdw();
@include border-radius($basicCr - 1); border-radius: $basicCr - 1;
@include trans-prop-nice(width); @include trans-prop-nice(width);
&:before { &:before {
background-color: $colorProgressBarAmt; background-color: $colorProgressBarAmt;
@ -433,7 +433,7 @@ label.checkbox.custom {
.l-calendar { .l-calendar {
$colorMuted: pushBack($colorMenuFg, 30%); $colorMuted: pushBack($colorMenuFg, 30%);
ul.l-cal-row { ul.l-cal-row {
@include display-flex; @include display(flex);
@include flex-flow(row nowrap); @include flex-flow(row nowrap);
margin-top: 1px; margin-top: 1px;
&:first-child { &:first-child {
@ -483,9 +483,9 @@ label.checkbox.custom {
@include desktop { @include desktop {
::-webkit-scrollbar { ::-webkit-scrollbar {
@include border-radius(2px); border-radius: 2px;
@include box-sizing(border-box); box-sizing: border-box;
@include box-shadow(inset $scrollbarTrackShdw); box-shadow: inset $scrollbarTrackShdw;
background-color: $scrollbarTrackColorBg; background-color: $scrollbarTrackColorBg;
height: $scrollbarTrackSize; height: $scrollbarTrackSize;
width: $scrollbarTrackSize; width: $scrollbarTrackSize;
@ -496,8 +496,8 @@ label.checkbox.custom {
$hc: $scrollbarThumbColorHov; $hc: $scrollbarThumbColorHov;
$gr: 5%; $gr: 5%;
@include background-image(linear-gradient(lighten($bg, $gr), $bg 20px)); @include background-image(linear-gradient(lighten($bg, $gr), $bg 20px));
@include border-radius(2px); border-radius: 2px;
@include box-sizing(border-box); box-sizing: border-box;
&:hover { &:hover {
@include background-image(linear-gradient(lighten($hc, $gr), $hc 20px)); @include background-image(linear-gradient(lighten($hc, $gr), $hc 20px));
} }

View File

@ -72,7 +72,7 @@
} }
.s-menu { .s-menu {
@include border-radius($basicCr); border-radius: $basicCr;
@include containerSubtle($colorMenuBg, $colorMenuFg); @include containerSubtle($colorMenuBg, $colorMenuFg);
@include boxShdw($shdwMenu); @include boxShdw($shdwMenu);
@include txtShdw($shdwMenuText); @include txtShdw($shdwMenuText);
@ -87,7 +87,7 @@
ul { ul {
@include menuUlReset(); @include menuUlReset();
li { li {
@include box-sizing(border-box); box-sizing: border-box;
border-top: 1px solid pullForward($colorMenuBg, 10%); border-top: 1px solid pullForward($colorMenuBg, 10%);
color: pullForward($colorMenuBg, 60%); color: pullForward($colorMenuBg, 60%);
line-height: $menuLineH; line-height: $menuLineH;
@ -171,7 +171,7 @@
@include absPosDefault($interiorMargin); @include absPosDefault($interiorMargin);
} }
.pane { .pane {
@include box-sizing(border-box); box-sizing: border-box;
&.left { &.left {
//@include test(); //@include test();
border-right: 1px solid pullForward($colorMenuBg, 10%); border-right: 1px solid pullForward($colorMenuBg, 10%);
@ -183,7 +183,7 @@
overflow-y: auto; overflow-y: auto;
ul { ul {
li { li {
@include border-radius($controlCr); border-radius: $controlCr;
padding-left: 30px; padding-left: 30px;
border-top: none; border-top: none;
} }

View File

@ -123,7 +123,7 @@ mct-include.status-block-holder {
/* Styles for messages and message banners */ /* Styles for messages and message banners */
.message { .message {
&.block { &.block {
@include border-radius($basicCr); border-radius: $basicCr;
padding: $interiorMarginLg; padding: $interiorMarginLg;
} }
&.error { &.error {
@ -135,9 +135,9 @@ mct-include.status-block-holder {
.l-message-banner { .l-message-banner {
$m: $interiorMarginSm; $m: $interiorMarginSm;
$lh: $ueFooterH - ($m*2) - 1; $lh: $ueFooterH - ($m*2) - 1;
@include box-sizing(border-box); box-sizing: border-box;
@include ellipsize(); @include ellipsize();
@include display-flex; @include display(flex);
@include flex-direction(row); @include flex-direction(row);
@include align-items(center); @include align-items(center);
position: absolute; position: absolute;
@ -198,12 +198,12 @@ mct-include.status-block-holder {
} }
.s-message-banner { .s-message-banner {
@include border-radius($controlCr); border-radius: $controlCr;
@include statusBannerColors($colorStatusDefault, $colorStatusFg); @include statusBannerColors($colorStatusDefault, $colorStatusFg);
cursor: pointer; cursor: pointer;
a { color: inherit; } a { color: inherit; }
.s-action { .s-action {
@include border-radius($basicCr); border-radius: $basicCr;
@include trans-prop-nice(background-color); @include trans-prop-nice(background-color);
} }
.close { .close {
@ -264,7 +264,7 @@ mct-include.status-block-holder {
*/ */
.l-message { .l-message {
@include display-flex; @include display(flex);
@include flex-direction(row); @include flex-direction(row);
@include align-items(stretch); @include align-items(stretch);
.type-icon.message-type { .type-icon.message-type {
@ -309,7 +309,7 @@ mct-include.status-block-holder {
.message-contents { .message-contents {
.l-message { .l-message {
@include border-radius($controlCr); border-radius: $controlCr;
background: rgba($colorOvrFg, 0.1); background: rgba($colorOvrFg, 0.1);
margin-bottom: $interiorMargin; margin-bottom: $interiorMargin;
padding: $interiorMarginLg; padding: $interiorMarginLg;

View File

@ -37,7 +37,7 @@ mct-include.l-time-controller {
{ {
//@include test(); //@include test();
@include absPosDefault(0, visible); @include absPosDefault(0, visible);
@include box-sizing(border-box); box-sizing: border-box;
top: auto; top: auto;
} }
.l-time-range-slider, .l-time-range-slider,
@ -73,7 +73,7 @@ mct-include.l-time-controller {
//@include test(green); //@include test(green);
height: $r2H; bottom: $r3H + ($interiorMarginSm * 1); height: $r2H; bottom: $r3H + ($interiorMarginSm * 1);
.range-holder { .range-holder {
@include box-shadow(none); box-shadow: none;
background: none; background: none;
border: none; border: none;
.range { .range {
@ -101,7 +101,7 @@ mct-include.l-time-controller {
} }
&:after { &:after {
// Circle element // Circle element
@include border-radius($myW); border-radius: $myW;
@include transform(translateY(-50%)); @include transform(translateY(-50%));
top: 50%; right: 0; bottom: auto; left: 0; top: 50%; right: 0; bottom: auto; left: 0;
width: auto; width: auto;
@ -167,7 +167,7 @@ mct-include.l-time-controller {
color: $sliderColorKnobHov; color: $sliderColorKnobHov;
} }
&.knob-l { &.knob-l {
//@include border-bottom-left-radius($knobCr); // MOVED TO _CONTROLS.SCSS //border-bottom-left-radius: $knobCr; // MOVED TO _CONTROLS.SCSS
margin-left: $knobM; margin-left: $knobM;
.range-value { .range-value {
text-align: right; text-align: right;
@ -175,7 +175,7 @@ mct-include.l-time-controller {
} }
} }
&.knob-r { &.knob-r {
//@include border-bottom-right-radius($knobCr); //border-bottom-right-radius: $knobCr;
margin-right: $knobM; margin-right: $knobM;
.range-value { .range-value {
left: $rangeValOffset; left: $rangeValOffset;
@ -193,7 +193,7 @@ mct-include.l-time-controller {
.s-time-range-val { .s-time-range-val {
//@include test(); //@include test();
@include border-radius($controlCr); border-radius: $controlCr;
background-color: $colorInputBg; background-color: $colorInputBg;
padding: 1px 1px 0 $interiorMargin; padding: 1px 1px 0 $interiorMargin;
} }

View File

@ -38,22 +38,22 @@
z-index: 11; z-index: 11;
} }
&.edit-resize-nw { &.edit-resize-nw {
@include border-bottom-right-radius($cr); border-bottom-right-radius: $cr;
cursor: nw-resize; cursor: nw-resize;
top: 0; left: 0; top: 0; left: 0;
} }
&.edit-resize-ne { &.edit-resize-ne {
@include border-bottom-left-radius($cr); border-bottom-left-radius: $cr;
cursor: ne-resize; cursor: ne-resize;
top: 0; right: 0; top: 0; right: 0;
} }
&.edit-resize-se { &.edit-resize-se {
@include border-top-left-radius($cr); border-top-left-radius: $cr;
cursor: se-resize; cursor: se-resize;
bottom: 0; right: 0; bottom: 0; right: 0;
} }
&.edit-resize-sw { &.edit-resize-sw {
@include border-top-right-radius($cr); border-top-right-radius: $cr;
cursor: sw-resize; cursor: sw-resize;
bottom: 0; left: 0; bottom: 0; left: 0;
} }

View File

@ -104,8 +104,8 @@
} }
.l-image-thumb-item { .l-image-thumb-item {
@include single-transition(background-color, 0.25s); @include transition(background-color, 0.25s);
@include box-sizing(border-box); box-sizing: border-box;
padding: 1px; padding: 1px;
position: relative; position: relative;
.l-thumb, .l-thumb,

View File

@ -20,7 +20,7 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.section-header { .section-header {
@include border-radius($basicCr); border-radius: $basicCr;
background: $colorFormSectionHeader; background: $colorFormSectionHeader;
$c: lighten($colorBodyFg, 20%); $c: lighten($colorBodyFg, 20%);
//border-bottom: 1px solid rgba(#fff, 0.3); //border-bottom: 1px solid rgba(#fff, 0.3);
@ -39,7 +39,7 @@
.form-row { .form-row {
$m: $interiorMargin; $m: $interiorMargin;
@include box-sizing(border-box); box-sizing: border-box;
@include clearfix; @include clearfix;
border-top: 1px solid $colorFormLines; border-top: 1px solid $colorFormLines;
margin-top: $m; margin-top: $m;
@ -51,7 +51,7 @@
>.label, >.label,
>.controls { >.controls {
@include box-sizing(border-box); box-sizing: border-box;
@include clearfix; @include clearfix;
font-size: 0.8rem; font-size: 0.8rem;
line-height: $formInputH; line-height: $formInputH;
@ -149,7 +149,7 @@ label.form-control.checkbox {
vertical-align: top; vertical-align: top;
div.s-hint { div.s-hint {
@include border-radius($basicCr); border-radius: $basicCr;
background: rgba($colorFormInvalid, 0.8); background: rgba($colorFormInvalid, 0.8);
display: block; display: block;
color: lighten($colorFormInvalid, 30%); color: lighten($colorFormInvalid, 30%);

View File

@ -27,7 +27,7 @@
} }
} }
.icon.ui-symbol { .icon.ui-symbol {
@include border-radius($controlCr); border-radius: $controlCr;
display: inline-block; display: inline-block;
font-size: 1.3em; font-size: 1.3em;
height: $formInputH; height: $formInputH;
@ -43,9 +43,9 @@
$d: $formInputH - $mgn * 2; $d: $formInputH - $mgn * 2;
$cb: #fff; $cb: #fff;
$cf: #333; $cf: #333;
@include border-radius($controlCr); border-radius: $controlCr;
@include box-sizing(border-box); box-sizing: border-box;
@include opacity(0.2); opacity: 0.2;
background: $cb; background: $cb;
color: $cf; color: $cf;
display: block; display: block;
@ -59,7 +59,7 @@
text-align: center; text-align: center;
z-index: 5; z-index: 5;
&:hover { &:hover {
@include opacity(0.6); opacity: 0.6;
background-color: $colorKey; background-color: $colorKey;
} }
} }
@ -95,7 +95,7 @@
.clear-icon, .clear-icon,
.menu-icon, .menu-icon,
&:before { &:before {
@include box-sizing(border-box); box-sizing: border-box;
display: inline-block; display: inline-block;
line-height: inherit; line-height: inherit;
position: absolute; position: absolute;

View File

@ -30,7 +30,7 @@
line-height: $formInputH; line-height: $formInputH;
select { select {
@include appearance(none); @include appearance(none);
@include box-sizing(border-box); box-sizing: border-box;
background: none; background: none;
color: $colorSelectFg; color: $colorSelectFg;
cursor: pointer; cursor: pointer;

View File

@ -30,7 +30,7 @@
.l-infobubble-wrapper { .l-infobubble-wrapper {
$arwSize: 5px; $arwSize: 5px;
@include box-shadow(rgba(black, 0.4) 0 1px 5px); box-shadow: rgba(black, 0.4) 0 1px 5px;
position: relative; position: relative;
z-index: 50; z-index: 50;
.l-infobubble { .l-infobubble {
@ -149,8 +149,8 @@
.s-infobubble { .s-infobubble {
$emFg: darken($colorInfoBubbleFg, 20%); $emFg: darken($colorInfoBubbleFg, 20%);
@include border-radius($basicCr); border-radius: $basicCr;
@include box-shadow(rgba(black, 0.4) 0 1px 5px); box-shadow: rgba(black, 0.4) 0 1px 5px;
background: $colorInfoBubbleBg; background: $colorInfoBubbleBg;
color: $colorInfoBubbleFg; color: $colorInfoBubbleFg;
font-size: 0.8rem; font-size: 0.8rem;

View File

@ -39,7 +39,7 @@
display: block; display: block;
@if $splitterEndCr != 'none' { @if $splitterEndCr != 'none' {
@include border-radius($splitterEndCr); border-radius: $splitterEndCr;
} }
} }
&:active { &:active {

View File

@ -34,8 +34,8 @@
@include animation-duration(0.5s); @include animation-duration(0.5s);
@include animation-iteration-count(infinite); @include animation-iteration-count(infinite);
@include animation-timing-function(linear); @include animation-timing-function(linear);
@include border-radius(100%); border-radius: 100%;
@include box-sizing(border-box); box-sizing: border-box;
border-color: rgba($c, 0.25); border-color: rgba($c, 0.25);
border-top-color: rgba($c, 1.0); border-top-color: rgba($c, 1.0);
border-style: solid; border-style: solid;

View File

@ -26,7 +26,7 @@
.tabular, .tabular,
table { table {
@include box-sizing(border-box); box-sizing: border-box;
border-spacing: 0; border-spacing: 0;
border-collapse: collapse; border-collapse: collapse;
display: table; display: table;
@ -107,7 +107,7 @@ table {
&.s-cell-type-value { &.s-cell-type-value {
text-align: right; text-align: right;
.l-cell-contents { .l-cell-contents {
@include border-radius($smallCr); border-radius: $smallCr;
padding-left: $itemPadLR; padding-left: $itemPadLR;
padding-right: $itemPadLR; padding-right: $itemPadLR;
} }
@ -126,7 +126,7 @@ table {
top: $tabularHeaderH * 2; top: $tabularHeaderH * 2;
} }
input[type="text"] { input[type="text"] {
@include box-sizing(border-box); box-sizing: border-box;
width: 100%; //50px; width: 100%; //50px;
} }
} }

View File

@ -27,7 +27,7 @@
.overlay > .holder { .overlay > .holder {
//@include test(orange); // This works! //@include test(orange); // This works!
$m: 0; $m: 0;
@include border-radius($m); border-radius: $m;
top: $m; top: $m;
right: $m; right: $m;
bottom: $m; bottom: $m;

View File

@ -37,7 +37,7 @@
> .holder { > .holder {
//$i: 15%; //$i: 15%;
@include containerSubtle($colorOvrBg, $colorOvrFg); @include containerSubtle($colorOvrBg, $colorOvrFg);
@include border-radius($basicCr * 3); border-radius: $basicCr * 3;
color: $colorOvrFg; color: $colorOvrFg;
top: 50%; top: 50%;
right: auto; right: auto;

View File

@ -69,8 +69,8 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
} }
.gl-plot-coords { .gl-plot-coords {
@include box-sizing(border-box); box-sizing: border-box;
@include border-radius($controlCr); border-radius: $controlCr;
background: black; background: black;
color: lighten($colorBodyFg, 30%); color: lighten($colorBodyFg, 30%);
padding: 2px 5px; padding: 2px 5px;
@ -117,7 +117,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
&.l-plot-y-label { &.l-plot-y-label {
$x: -50%; $x: -50%;
$r: -90deg; $r: -90deg;
@include transform-origin(50%, 0); @include transform-origin(50% 0);
@include transform(translateX($x) rotate($r)); @include transform(translateX($x) rotate($r));
display: inline-block; display: inline-block;
margin-left: $interiorMargin; // Kick off the left edge margin-left: $interiorMargin; // Kick off the left edge
@ -234,7 +234,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
} }
.plot-color-swatch, .plot-color-swatch,
.color-swatch { .color-swatch {
@include border-radius(2px); border-radius: 2px;
display: inline-block; display: inline-block;
height: $swatchD; height: $swatchD;
width: $swatchD; width: $swatchD;
@ -244,7 +244,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-legend { .gl-plot-legend {
.plot-legend-item { .plot-legend-item {
@include border-radius($smallCr); border-radius: $smallCr;
line-height: 1.5em; line-height: 1.5em;
padding: 0px $itemPadLR; padding: 0px $itemPadLR;
.plot-color-swatch { .plot-color-swatch {

View File

@ -53,7 +53,7 @@
&:before, &:before,
.clear-icon, .clear-icon,
.menu-icon { .menu-icon {
@include box-sizing(border-box); box-sizing: border-box;
color: $colorInputIcon; color: $colorInputIcon;
height: $iconD; height: $iconD;
width: $iconD; width: $iconD;
@ -130,7 +130,7 @@
.active-filter-display { .active-filter-display {
$s: 0.7em; $s: 0.7em;
$p: $interiorMargin; $p: $interiorMargin;
@include box-sizing(border-box); box-sizing: border-box;
line-height: 130%; line-height: 130%;
padding-left: $s * 2.25; padding-left: $s * 2.25;
font-size: $s; font-size: $s;

View File

@ -35,9 +35,9 @@ ul.tree {
.tree-item, .tree-item,
.search-result-item { .search-result-item {
@extend .l-flex-row; @extend .l-flex-row;
@include box-sizing(border-box); box-sizing: border-box;
@include border-radius($basicCr); border-radius: $basicCr;
@include single-transition(background-color, 0.25s); @include transition(background-color, 0.25s);
font-size: 0.8rem; font-size: 0.8rem;
height: $menuLineH; height: $menuLineH;
line-height: $menuLineH; line-height: $menuLineH;
@ -155,7 +155,7 @@ mct-representation {
.t-item-icon, .t-item-icon,
.t-title-label { .t-title-label {
color: $colorItemTreeEditingFg; color: $colorItemTreeEditingFg;
@include text-shadow(none); text-shadow: none;
} }
.t-title-label { .t-title-label {
font-style: italic; font-style: italic;

View File

@ -27,7 +27,7 @@
} }
.editor { .editor {
@include border-radius($basicCr * 1.5); border-radius: $basicCr * 1.5;
} }
.contents { .contents {
@ -86,7 +86,7 @@
color: lighten($colorBodyBg, 30%); color: lighten($colorBodyBg, 30%);
font-size: .7rem; font-size: .7rem;
.status-holder { .status-holder {
@include box-sizing(border-box); box-sizing: border-box;
@include absPosDefault($interiorMargin); @include absPosDefault($interiorMargin);
@include ellipsize(); @include ellipsize();
right: 120px; right: 120px;
@ -94,7 +94,7 @@
z-index: 1; z-index: 1;
} }
.app-logo { .app-logo {
@include box-sizing(border-box); box-sizing: border-box;
@include absPosDefault($interiorMargin); @include absPosDefault($interiorMargin);
cursor: pointer; cursor: pointer;
left: auto; left: auto;
@ -121,7 +121,7 @@
} }
.pane { .pane {
@include box-sizing(border-box); box-sizing: border-box;
position: absolute; position: absolute;
.pane-header { .pane-header {
@ -282,7 +282,7 @@
/***************************************************** OBJECT BROWSE BAR */ /***************************************************** OBJECT BROWSE BAR */
.object-browse-bar { .object-browse-bar {
@include box-sizing(border-box); box-sizing: border-box;
height: $ueTopBarH; height: $ueTopBarH;
line-height: $ueTopBarH; line-height: $ueTopBarH;
white-space: nowrap; white-space: nowrap;
@ -378,7 +378,7 @@
.s-status-editing { .s-status-editing {
.l-object-wrapper { .l-object-wrapper {
@include pulseBorder($colorEditAreaFg, $dur: 1s, $opacity0: 0.3); @include pulseBorder($colorEditAreaFg, $dur: 1s, $opacity0: 0.3);
@include border-radius($controlCr); border-radius: $controlCr;
background-color: $colorEditAreaBg; background-color: $colorEditAreaBg;
border-color: $colorEditAreaFg; border-color: $colorEditAreaFg;
border-width: 2px; border-width: 2px;

View File

@ -27,7 +27,7 @@
height: $btnToolbarH; height: $btnToolbarH;
} }
input[type="text"] { input[type="text"] {
@include box-sizing(border-box); box-sizing: border-box;
font-size: .9em; font-size: .9em;
height: $btnToolbarH; height: $btnToolbarH;
margin-bottom: 1px; margin-bottom: 1px;

View File

@ -7,7 +7,7 @@
@mixin btnSubtle($bg: $colorBodyBg, $bgHovColor: none, $fg: $colorBodyFg, $ic: $colorBtnIcon) { @mixin btnSubtle($bg: $colorBodyBg, $bgHovColor: none, $fg: $colorBodyFg, $ic: $colorBtnIcon) {
@include containerSubtle($bg, $fg); @include containerSubtle($bg, $fg);
@include btnBase($bg, $bgHovColor, $fg, $ic); @include btnBase($bg, $bgHovColor, $fg, $ic);
@include text-shadow($shdwItemText); text-shadow: $shdwItemText;
} }
@function pullForward($c: $colorBodyBg, $p: 20%) { @function pullForward($c: $colorBodyBg, $p: 20%) {

View File

@ -20,10 +20,10 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@import "compass"; @import "bourbon";
@import "compass/reset"; //@import "compass/reset";
@import "compass/css3"; //@import "compass/css3";
@import "compass/utilities"; //@import "compass/utilities";
@import "../../../../general/res/sass/_mixins"; @import "../../../../general/res/sass/_mixins";
@import "../../../../general/res/sass/mobile/mixins"; @import "../../../../general/res/sass/mobile/mixins";

View File

@ -6,7 +6,7 @@
@mixin btnSubtle($bg: $colorBtnBg, $bgHovColor: none, $fg: $colorBtnFg, $ic: $colorBtnIcon) { @mixin btnSubtle($bg: $colorBtnBg, $bgHovColor: none, $fg: $colorBtnFg, $ic: $colorBtnIcon) {
@include containerSubtle($bg, $fg); @include containerSubtle($bg, $fg);
@include btnBase($bg, $bgHovColor, $fg, $ic); @include btnBase($bg, $bgHovColor, $fg, $ic);
@include text-shadow($shdwItemText); text-shadow: $shdwItemText;
} }
@function pullForward($c: $colorBodyBg, $p: 20%) { @function pullForward($c: $colorBodyBg, $p: 20%) {

View File

@ -20,10 +20,10 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@import "compass"; @import "bourbon";
@import "compass/reset"; //@import "compass/reset";
@import "compass/css3"; //@import "compass/css3";
@import "compass/utilities"; //@import "compass/utilities";
@import "../../../../general/res/sass/_mixins"; @import "../../../../general/res/sass/_mixins";
@import "../../../../general/res/sass/mobile/mixins"; @import "../../../../general/res/sass/mobile/mixins";

View File

@ -23,7 +23,7 @@
} }
} }
&.s-title { &.s-title {
@include text-shadow(rgba(black, 0.1) 0 1px 2px); text-shadow: rgba(black, 0.1) 0 1px 2px;
} }
&.duration { &.duration {
left: auto; left: auto;

View File

@ -36,8 +36,8 @@
.bar { .bar {
color: $colorGanttBarFg; color: $colorGanttBarFg;
@include activityBg($colorGanttBarBg); @include activityBg($colorGanttBarBg);
@include border-radius($br); border-radius: $br;
@include box-shadow($shdwGanttBar); box-shadow: $shdwGanttBar;
&.expanded { &.expanded {
@include border-top-radius($br); @include border-top-radius($br);
@include border-bottom-radius(0); @include border-bottom-radius(0);
@ -145,7 +145,7 @@
.s-status-editing .s-swimlane { .s-status-editing .s-swimlane {
cursor: pointer; cursor: pointer;
.t-object-label { .t-object-label {
@include border-radius($controlCr); border-radius: $controlCr;
cursor: move; cursor: move;
padding: 2px 5px; padding: 2px 5px;
&:hover { &:hover {

View File

@ -62,7 +62,7 @@
} }
} }
&.l-timeline-resource-legend { &.l-timeline-resource-legend {
@include box-sizing(border-box); box-sizing: border-box;
padding: $interiorMargin 0; padding: $interiorMargin 0;
white-space: nowrap; white-space: nowrap;
@ -214,7 +214,7 @@
.l-hover-btns-holder { .l-hover-btns-holder {
@include absPosDefault(); @include absPosDefault();
@include box-sizing(border-box); box-sizing: border-box;
@include trans-prop-nice-fade(500ms); @include trans-prop-nice-fade(500ms);
opacity: 0; opacity: 0;
height: $timelineTopPaneHeaderH; height: $timelineTopPaneHeaderH;
@ -230,7 +230,7 @@
text-wrap: none; text-wrap: none;
white-space: nowrap; white-space: nowrap;
.l-col { .l-col {
@include box-sizing(border-box); box-sizing: border-box;
@include ellipsize(); @include ellipsize();
display: inline-block; display: inline-block;
height: 100%; height: 100%;
@ -257,8 +257,8 @@
&.l-title { &.l-title {
width: $timelineColTitleW; width: $timelineColTitleW;
.rep-object-label[draggable="true"] { .rep-object-label[draggable="true"] {
@include border-radius($basicCr); border-radius: $basicCr;
@include single-transition(background-color, 0.25s); @include transition(background-color, 0.25s);
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
padding: 0 $interiorMarginSm; padding: 0 $interiorMarginSm;

View File

@ -19,9 +19,9 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@import "compass"; @import "bourbon";
@import "compass/css3"; //@import "compass/css3";
@import "compass/utilities"; //@import "compass/utilities";
@import "../../../../commonUI/general/res/sass/constants"; @import "../../../../commonUI/general/res/sass/constants";
@import "../../../../commonUI/general/res/sass/mixins"; @import "../../../../commonUI/general/res/sass/mixins";

View File

@ -19,9 +19,9 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@import "compass"; @import "bourbon";
@import "compass/css3"; //@import "compass/css3";
@import "compass/utilities"; //@import "compass/utilities";
@import "../../../../commonUI/general/res/sass/constants"; @import "../../../../commonUI/general/res/sass/constants";
@import "../../../../commonUI/general/res/sass/mixins"; @import "../../../../commonUI/general/res/sass/mixins";

View File

@ -19,9 +19,9 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@import "compass"; @import "bourbon";
@import "compass/css3"; //@import "compass/css3";
@import "compass/utilities"; //@import "compass/utilities";
@import "../../../../commonUI/general/res/sass/constants"; @import "../../../../commonUI/general/res/sass/constants";
@import "../../../../commonUI/general/res/sass/mixins"; @import "../../../../commonUI/general/res/sass/mixins";