Skip to content
This repository has been archived by the owner on Feb 12, 2022. It is now read-only.

Gh154 restructure less build to allow ampersand to not have fuelux in parents #155

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 8 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,11 @@ bower_components
validation-status.json

# Editors / IDEs
.idea
.idea




# Temp file created in the LESS build
less/fuelux-override-no-namespace.less

28 changes: 26 additions & 2 deletions Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -225,6 +225,15 @@ module.exports = function (grunt) {


less: {
'fuelux-override': {
options: {
strictMath: true,
sourceMap: false
},
files: {
'less/fuelux-override-no-namespace.less': 'less/fuelux-override.less'
}
},
'fuelux-mctheme': {
options: {
strictMath: true,
Expand All @@ -234,6 +243,7 @@ module.exports = function (grunt) {
sourceMapFilename: 'dist/css/<%= pkg.name %>.css.map'
},
files: {
'less/fuelux-override-no-namespace.less': 'less/fuelux-override.less', // Pre-process the fuelux overrides without a .fuelux namespace wrapper, the file that gets created is included by less/fuelux-mctheme.less
'dist/css/fuelux-mctheme.css': 'less/fuelux-mctheme.less'
}
},
Expand Down Expand Up @@ -311,9 +321,10 @@ module.exports = function (grunt) {
}
}
},

watch: {
full: {
files: ['less/**'],
files: ['Gruntfile.js', 'examples/**','less/**'],
options: {
livereload: isLivereloadEnabled
},
Expand All @@ -332,8 +343,21 @@ module.exports = function (grunt) {
// Icon creation task
grunt.registerTask('iconify', ['svgmin', 'grunticon']);


// Temporary LESS file deletion task
grunt.registerTask('delete-temp-less-file', 'Delete the temporary LESS file created during the build process', function() {
var options = {
force: true
};
grunt.file.delete('less/fuelux-override-no-namespace.less', options);
});


// CSS distribution task
grunt.registerTask('distcss', ['less:fuelux-mctheme', 'replace:imgpaths', 'less:minify', 'usebanner']);
grunt.registerTask('distcss', ['less:fuelux-mctheme', 'delete-temp-less-file', 'replace:imgpaths', 'less:minify', 'usebanner']);




// ZIP distribution task
grunt.registerTask('distzip', ['copy:zipsrc', 'compress', 'clean:zipsrc']);
Expand Down
30 changes: 15 additions & 15 deletions examples/fuelux/fuelux.html
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@
</head>
<body>
<div class="container" id="mainWrapper">
<h2>Checkboxes</h2>
<h2 id="Checkboxes">Checkboxes</h2>
<div class="thin-box">
<!--Block-level Checkboxes-->
<div class="checkbox">
Expand Down Expand Up @@ -136,7 +136,7 @@ <h2>Checkboxes</h2>
<button type="button" class="btn btn-default" id="btnCheckboxDestroy">destroy and append #myCustomCheckbox1</button>
</div>

<h2>Combobox</h2>
<h2 id="Combobox">Combobox</h2>
<div class="thin-box">
<div style="width: 300px;">

Expand Down Expand Up @@ -167,7 +167,7 @@ <h2>Combobox</h2>
<button id="btnComboboxDestroy" type="button" class="btn btn-default">destroy and append</button>
</div>

<h2>Datepicker</h2>
<h2 id="Datepicker">Datepicker</h2>
<div class="thin-box">
<div style="width: 300px;">

Expand Down Expand Up @@ -262,7 +262,7 @@ <h2 class="header">Year</h2>
<button type="button" class="btn btn-default" id="btnDatepickerDestroy">destroy and append</button>
</div>

<h2>Infinite Scroll</h2>
<h2 id="InfiniteScroll">Infinite Scroll</h2>
<div class="clearfix thin-box">
<div class="infinitescroll" id="myInfiniteScroll1">
<p>Hodor, hodor. Hodor. Hodor, hodor hodor hodor hodor, hodor. Hodor hodor, hodor, hodor hodor. Hodor! Hodor hodor, hodor - hodor hodor hodor? Hodor hodor HODOR! Hodor hodor, hodor. Hodor hodor... Hodor hodor hodor hodor?! Hodor hodor HODOR! Hodor hodor - hodor, hodor. Hodor hodor hodor! Hodor hodor - hodor... Hodor hodor hodor, hodor, hodor hodor. Hodor hodor - hodor; hodor hodor hodor hodor?! Hodor, HODOR hodor, hodor hodor? Hodor! Hodor hodor, hodor, hodor. Hodor hodor? </p>
Expand All @@ -285,7 +285,7 @@ <h2>Infinite Scroll</h2>
<button type="button" class="btn btn-default" id="btnInfiniteScrollDestroy">destroy and append</button>
</div>

<h2>Loader</h2>
<h2 id="Loader">Loader</h2>
<div class="clearfix thin-box" id="loaderWrapper">
<div class="loader" data-initialize="loader" id="myLoader1"></div>
<div class="loader" data-frame="5" data-initialize="loader" id="myLoader2"></div>
Expand All @@ -300,7 +300,7 @@ <h2>Loader</h2>
<button type="button" class="btn btn-default" id="btnLoaderDestroy">destroy and append</button>
</div>

<h2>Pillbox</h2>
<h2 id="Pillbox">Pillbox</h2>
<div class="thin-box">
<div style="width: 300px;">
<div class="pillbox" id="myPillbox1">
Expand Down Expand Up @@ -377,7 +377,7 @@ <h2>Pillbox</h2>
<button type="button" class="btn btn-default" id="btnPillboxDestroy">destroy and append</button>
</div>

<h2>Placard</h2>
<h2 id="Placard">Placard</h2>
<div class="thin-box">
<div class="placard" data-initialize="placard" id="myPlacard1">
<div class="placard-popup"></div>
Expand Down Expand Up @@ -416,7 +416,7 @@ <h2>Placard</h2>
<button type="button" class="btn btn-default" id="btnPlacardDestroy">destroy and append</button>
</div>

<h2>Radio</h2>
<h2 id="Radio">Radio</h2>
<div class="thin-box">
<!--Block-level Radios-->
<div class="radio">
Expand Down Expand Up @@ -505,7 +505,7 @@ <h2>Radio</h2>
<button type="button" class="btn btn-default" id="btnRadioDestroy">destroy and append</button>
</div>

<h2>Repeater</h2>
<h2 id="Repeater">Repeater</h2>
<div class="thin-box">
<div class="repeater" data-staticheight="400" id="myRepeater">
<div class="repeater-header">
Expand Down Expand Up @@ -612,7 +612,7 @@ <h2>Repeater</h2>
<button type="button" class="btn btn-default" id="btnRepeaterDestroy">destroy and append</button>
</div>

<h2>Scheduler</h2>
<h2 id="Scheduler">Scheduler</h2>
<div class="thin-box">
<div class="form-horizontal container-fluid scheduler" data-initialize="scheduler" role="form" id="myScheduler">
<div class="form-group start-datetime">
Expand Down Expand Up @@ -1300,7 +1300,7 @@ <h2 class="header">Year</h2>
<button type="button" class="btn btn-default" id="btnSchedulerDestroy">destroy and append</button>
</div>

<h2>Search</h2>
<h2 id="Search">Search</h2>
<div class="thin-box">
<div class="search input-group" data-initialize="search" role="search" id="mySearch">
<input type="search" class="form-control" placeholder="Search"/>
Expand All @@ -1318,7 +1318,7 @@ <h2>Search</h2>
<button type="button" class="btn btn-default" id="btnSearchDestroy">destroy and append</button>
</div>

<h2>Selectlist</h2>
<h2 id="Selectlist">Selectlist</h2>
<div class="thin-box">
<div class="btn-group selectlist" data-initialize="selectlist" data-resize="auto" id="mySelectlist">
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">
Expand Down Expand Up @@ -1347,7 +1347,7 @@ <h2>Selectlist</h2>
<button type="button" class="btn btn-default" id="btnSelectlistDestroy">destroy and append</button>
</div>

<h2>Spinbox</h2>
<h2 id="Spinbox">Spinbox</h2>
<div class="thin-box">
<div class="spinbox" data-initialize="spinbox" id="mySpinbox1">
<input class="form-control input-mini spinbox-input" id="mySpinboxInput" type="text" value="10">
Expand Down Expand Up @@ -1380,7 +1380,7 @@ <h2>Spinbox</h2>
<button id="btnSpinboxDestroy" type="button" class="btn btn-default">destroy and append</button>
</div>

<h2>Tree</h2>
<h2 id="Tree">Tree</h2>
<div class="thin-box">
<ul class="tree" id="myTree1" role="tree">
<li class="tree-branch hide" data-template="treebranch" role="treeitem" aria-expanded="false">
Expand Down Expand Up @@ -1426,7 +1426,7 @@ <h2>Tree</h2>
<button type="button" class="btn btn-default" id="btnTreeDestroy">destroy and append</button>
</div>

<h2>Wizard</h2>
<h2 id="Wizard">Wizard</h2>
<div class="thin-box">
<div class="wizard" data-initialize="wizard" id="myWizard">
<ul class="steps">
Expand Down
33 changes: 33 additions & 0 deletions less/bootstrap-override.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
// Bootstrap variables and mixins
@import "bootstrap-override/variables.less";
@import "bootstrap-override/mixins.less";

// Bootstrap CSS
@import "bootstrap-override/type.less";
@import "bootstrap-override/buttons.less";
@import "bootstrap-override/forms.less";
@import "bootstrap-override/tables.less";
@import "bootstrap-override/label.less";

// Bootstrap Components
@import "bootstrap-override/progress-bars.less";
@import "bootstrap-override/alerts.less";
@import "bootstrap-override/close.less";
@import "bootstrap-override/grid.less";
@import "bootstrap-override/dropdowns.less";
@import "bootstrap-override/button-groups.less";
@import "bootstrap-override/input-groups.less";
@import "bootstrap-override/navs.less";
@import "bootstrap-override/navbar.less";
@import "bootstrap-override/badges.less";
@import "bootstrap-override/list-group.less";
@import "bootstrap-override/panels.less";
@import "bootstrap-override/pagination.less";
@import "bootstrap-override/breadcrumb.less";
@import "bootstrap-override/well.less";

// Bootstrap JavaScript Components
@import "bootstrap-override/modals.less";
@import "bootstrap-override/tooltip.less";
@import "bootstrap-override/popovers.less";
@import "bootstrap-override/carousel.less";
65 changes: 4 additions & 61 deletions less/fuelux-mctheme.less
Original file line number Diff line number Diff line change
Expand Up @@ -7,67 +7,10 @@
@import "help.less";


// Bootstrap variables and mixins
@import "bootstrap-override/variables.less";
@import "bootstrap-override/mixins.less";
// Bootstrap override
@import "bootstrap-override.less";

// Bootstrap CSS
@import "bootstrap-override/type.less";
@import "bootstrap-override/buttons.less";
@import "bootstrap-override/forms.less";
@import "bootstrap-override/tables.less";
@import "bootstrap-override/label.less";

// Bootstrap Components
@import "bootstrap-override/progress-bars.less";
@import "bootstrap-override/alerts.less";
@import "bootstrap-override/close.less";
@import "bootstrap-override/grid.less";
@import "bootstrap-override/dropdowns.less";
@import "bootstrap-override/button-groups.less";
@import "bootstrap-override/input-groups.less";
@import "bootstrap-override/navs.less";
@import "bootstrap-override/navbar.less";
@import "bootstrap-override/badges.less";
@import "bootstrap-override/list-group.less";
@import "bootstrap-override/panels.less";
@import "bootstrap-override/pagination.less";
@import "bootstrap-override/breadcrumb.less";
@import "bootstrap-override/well.less";

// Bootstrap JavaScript Components
@import "bootstrap-override/modals.less";
@import "bootstrap-override/tooltip.less";
@import "bootstrap-override/popovers.less";
@import "bootstrap-override/carousel.less";


// Fuel UX Controls
// Fuel UX override
.fuelux {
// Core variables, mixins, and icons
@import "fuelux-override/variables.less";
@import "fuelux-override/mixins.less";

// Fuel UX controls
@import "fuelux-override/checkbox.less";
@import "fuelux-override/combobox.less";
@import "fuelux-override/datepicker.less";
//@import "infinite-scroll.less";
@import "fuelux-override/loader.less";
//@import "misc.less";
@import "fuelux-override/pillbox.less";
@import "fuelux-override/placard.less";
@import "fuelux-override/radio.less";
@import "fuelux-override/repeater.less";
@import "fuelux-override/repeater-list.less";
@import "fuelux-override/repeater-thumbnail.less";
@import "fuelux-override/spinbox.less";
@import "fuelux-override/scheduler.less";
@import "fuelux-override/search.less";
@import "fuelux-override/selectlist.less";
@import "fuelux-override/tree.less";
@import "fuelux-override/wizard.less";

@import "fuelux-override-no-namespace.less";
}


36 changes: 36 additions & 0 deletions less/fuelux-override.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
// Unique to fuelux-mctheme
@import (reference) "variables.less";
@import (reference) "mixins.less";
@import (reference) "colors.less";
@import (reference) "icons.less";
@import (reference) "utility.less";
@import (reference) "help.less";


@import (reference) "bootstrap-override.less";


// Override Fuel UX Core variables, mixins
@import "fuelux-override/variables.less";
@import "fuelux-override/mixins.less";

// Fuel UX controls
@import "fuelux-override/checkbox.less";
@import "fuelux-override/combobox.less";
@import "fuelux-override/datepicker.less";
//@import "infinite-scroll.less";
@import "fuelux-override/loader.less";
//@import "misc.less";
@import "fuelux-override/pillbox.less";
@import "fuelux-override/placard.less";
@import "fuelux-override/radio.less";
@import "fuelux-override/repeater.less";
@import "fuelux-override/repeater-list.less";
@import "fuelux-override/repeater-thumbnail.less";
@import "fuelux-override/spinbox.less";
@import "fuelux-override/scheduler.less";
@import "fuelux-override/search.less";
@import "fuelux-override/selectlist.less";
@import "fuelux-override/tree.less";
@import "fuelux-override/wizard.less";