Skip to content

Commit

Permalink
simpler customizer files section; adds glyphicons.less
Browse files Browse the repository at this point in the history
  • Loading branch information
@mdo
mdo committed Aug 19, 2013
1 parent 2234f0e commit 7eddb94
Show file tree
Hide file tree
Showing 3 changed files with 78 additions and 88 deletions.
8 changes: 5 additions & 3 deletions assets/css/docs.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1032,13 +1032,15 @@ h3[id] {
border-bottom: 1px solid #b94441;
}
.bs-customizer-alert .close {
margin-top: -2px;
color: #fff;
text-shadow: none;
margin-top: -4px;
font-size: 24px;
}
.bs-customizer-alert p {
margin-bottom: 0;
}
.bs-customizer-alert .glyphicon {
margin-right: 3px;
}


/*
Expand Down
9 changes: 5 additions & 4 deletions assets/js/customizer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
$('<div id="bsCustomizerAlert" class="bs-customizer-alert">\
<div class="container">\
<a href="#bsCustomizerAlert" data-dismiss="alert" class="close pull-right">&times;</a>\
<span class="glyphicon glyphicon-warning-sign"></span>
<p class="bs-customizer-alert-text">' + msg + '</p>' +
(err.extract ? '<pre class="bs-customizer-alert-extract">' + err.extract.join('\n') + '</pre>' : '') + '\
</div>\
Expand Down Expand Up @@ -51,7 +52,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
history.replaceState(false, document.title, window.location.origin + window.location.pathname + '?id=' + result.id)
})
.error(function(err) {
showError('<strong>Error</strong> Could not save gist file, configuration not saved.', err)
showError('<strong>Ruh roh!</strong> Could not save gist file, configuration not saved.', err)
})
}

Expand Down Expand Up @@ -108,7 +109,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
}

function generateZip(css, js, complete) {
if (!css && !js) return showError('<strong>Error</strong> No Bootstrap files selected.', new Error('no Bootstrap'))
if (!css && !js) return showError('<strong>Ruh roh!</strong> No Bootstrap files selected.', new Error('no Bootstrap'))

var zip = new JSZip()

Expand Down Expand Up @@ -174,15 +175,15 @@ window.onload = function () { // wait for load in a dumb way because B-0
, filename: 'bootstrap.css'
}).parse(css, function (err, tree) {
if (err) {
return showError('<strong>Error</strong> Could not parse less files.', err)
return showError('<strong>Ruh roh!</strong> Could not parse less files.', err)
}
result = {
'bootstrap.css' : cw + tree.toCSS(),
'bootstrap.min.css' : cw + tree.toCSS({ compress: true })
}
})
} catch (err) {
return showError('<strong>Error</strong> Could not parse less files.', err)
return showError('<strong>Ruh roh!</strong> Could not parse less files.', err)
}

return result
Expand Down
149 changes: 68 additions & 81 deletions customize.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,25 +15,15 @@ <h1 id="less">LESS files</h1>
</div>
<p class="lead">Choose which LESS files to compile into your custom build of Bootstrap. Not sure which files to use? Read through the <a href="../css/">CSS</a> and <a href="../components/">Components</a> pages in the docs</p>

<h3>Basics</h3>
<div class="row">
<div class="col-xs-6 col-sm-4">
<h4>Layout</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="grid.less">
Grid system
</label>
</div>
<h3>Common CSS</h3>
<div class="checkbox">
<label>
<input type="checkbox" checked value="print.less">
Print media styles
</label>
</div>
</div>
<div class="col-xs-6 col-sm-4">
<h4>Global CSS</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="type.less">
Expand All @@ -46,6 +36,12 @@ <h4>Global CSS</h4>
Code
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="grid.less">
Grid system
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="tables.less">
Expand All @@ -64,46 +60,46 @@ <h4>Global CSS</h4>
Buttons
</label>
</div>
</div>
</div><!-- .col-xs-6 .col-sm-4 -->

<div class="col-xs-6 col-sm-4">
<h4>Utility classes</h4>
<h3>Components</h3>
<div class="checkbox">
<label>
<input type="checkbox" checked value="utilities.less" data-dependents="navbar.less">
Basic utilities
<input type="checkbox" checked value="glyphicons.less">
Glyphicons
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="responsive-utilities.less">
Responsive utilities
<input type="checkbox" checked value="button-groups.less" data-dependency="buttons.less">
Button groups
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="component-animations.less">
Component animations (for JS)
<input type="checkbox" checked value="input-groups.less" data-dependency="forms.less">
Input groups
</label>
</div>
</div>
</div>

<h3>Components</h3>
<div class="row">
<div class="col-xs-6 col-sm-4">
<h4>Navigation</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="navs.less">
<input type="checkbox" checked value="navs.less" data-dependents="navbar.less">
Navs
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="navbar.less" data-dependencies="forms.less,utilities.less">
<input type="checkbox" checked value="navbar.less" data-dependencies="forms.less,utilities.less,navs.less">
Navbar
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="breadcrumbs.less">
Breadcrumbs
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="pagination.less">
Expand All @@ -118,34 +114,28 @@ <h4>Navigation</h4>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="breadcrumbs.less">
Breadcrumbs
<input type="checkbox" checked value="labels.less">
Labels
</label>
</div>
</div>
<div class="col-xs-6 col-sm-4">
<h4>Content blocks</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="jumbotron.less">
Jumbotron
<input type="checkbox" checked value="badges.less">
Badges
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="panels.less">
Panels
<input type="checkbox" checked value="jumbotron.less">
Jumbotron
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="wells.less">
Wells
<input type="checkbox" checked value="thumbnails.less">
Thumbnails
</label>
</div>
</div>
<div class="col-xs-6 col-sm-4">
<h4>Behavioral (requires JS)</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="alerts.less">
Expand All @@ -154,99 +144,96 @@ <h4>Behavioral (requires JS)</h4>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="dropdowns.less">
Dropdowns
<input type="checkbox" checked value="progress-bars.less">
Progress bars
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="tooltip.less">
Tooltips
<input type="checkbox" checked value="media.less">
Media items
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="popovers.less">
Popovers
<input type="checkbox" checked value="list-group.less">
List groups
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="modals.less">
Modals
<input type="checkbox" checked value="panels.less">
Panels
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="carousel.less">
Carousel
<input type="checkbox" checked value="wells.less">
Wells
</label>
</div>
</div>
</div>

<div class="row">
<div class="col-xs-6 col-sm-4">
<h4>Media</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="thumbnails.less">
Thumbnails
<input type="checkbox" checked value="close.less">
Close icon
</label>
</div>
</div><!-- .col-xs-6 .col-sm-4 -->

<div class="col-xs-6 col-sm-4">
<h3>JavaScript components</h3>
<div class="checkbox">
<label>
<input type="checkbox" checked value="list-group.less">
List groups
<input type="checkbox" checked value="dropdowns.less">
Dropdowns
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="media.less">
Media items
<input type="checkbox" checked value="tooltip.less">
Tooltips
</label>
</div>
</div>
<div class="col-xs-6 col-sm-4">
<h4>Miscellaneous</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="input-groups.less" data-dependency="forms.less">
Input groups
<input type="checkbox" checked value="popovers.less">
Popovers
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="button-groups.less" data-dependency="buttons.less">
Button groups
<input type="checkbox" checked value="modals.less">
Modals
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="progress-bars.less">
Progress bars
<input type="checkbox" checked value="carousel.less">
Carousel
</label>
</div>

<h3>Utilities</h3>
<div class="checkbox">
<label>
<input type="checkbox" checked value="badges.less">
Badges
<input type="checkbox" checked value="utilities.less" data-dependents="navbar.less">
Basic utilities
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="labels.less">
Labels
<input type="checkbox" checked value="responsive-utilities.less">
Responsive utilities
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="close.less">
Close icon
<input type="checkbox" checked value="component-animations.less">
Component animations (for JS)
</label>
</div>
</div>
</div>
</div><!-- .col-xs-6 .col-sm-4 -->
</div><!-- /.row -->
</div>


Expand Down

0 comments on commit 7eddb94

Please sign in to comment.