root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

simpler customizer files section; adds glyphicons.less

This commit is contained in:
Mark Otto 2013-08-18 23:36:36 -07:00
parent 2234f0e333
commit 7eddb94fa6
3 changed files with 98 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
assets/css/docs.css
View File

@ -1032,13 +1032,15 @@ h3[id] {
border-bottom: 1px solid #b94441; border-bottom: 1px solid #b94441;
} }
.bs-customizer-alert .close { .bs-customizer-alert .close {
margin-top: -2px; margin-top: -4px;
color: #fff; font-size: 24px;
text-shadow: none;
} }
.bs-customizer-alert p { .bs-customizer-alert p {
margin-bottom: 0; margin-bottom: 0;
} }
.bs-customizer-alert .glyphicon {
margin-right: 3px;
}
/* /*

9
assets/js/customizer.js
View File

@ -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 id="bsCustomizerAlert" class="bs-customizer-alert">\
<div class="container">\ <div class="container">\
<a href="#bsCustomizerAlert" data-dismiss="alert" class="close pull-right">&times;</a>\ <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>' + <p class="bs-customizer-alert-text">' + msg + '</p>' +
(err.extract ? '<pre class="bs-customizer-alert-extract">' + err.extract.join('\n') + '</pre>' : '') + '\ (err.extract ? '<pre class="bs-customizer-alert-extract">' + err.extract.join('\n') + '</pre>' : '') + '\
</div>\ </div>\
@ -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) history.replaceState(false, document.title, window.location.origin + window.location.pathname + '?id=' + result.id)
}) })
.error(function(err) { .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)
}) })
} }
@ -108,7 +109,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
} }
function generateZip(css, js, complete) { 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() var zip = new JSZip()
@ -174,7 +175,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
, filename: 'bootstrap.css' , filename: 'bootstrap.css'
}).parse(css, function (err, tree) { }).parse(css, function (err, tree) {
if (err) { 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 = { result = {
'bootstrap.css' : cw + tree.toCSS(), 'bootstrap.css' : cw + tree.toCSS(),
@ -182,7 +183,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
} }
}) })
} catch (err) { } 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 return result

187
customize.html
View File

@ -15,25 +15,15 @@ base_url: "../"
</div> </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> <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="row">
<div class="col-xs-6 col-sm-4"> <div class="col-xs-6 col-sm-4">
<h4>Layout</h4> <h3>Common CSS</h3>
<div class="checkbox">
<label>
<input type="checkbox" checked value="grid.less">
Grid system
</label>
</div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="print.less"> <input type="checkbox" checked value="print.less">
Print media styles Print media styles
</label> </label>
</div> </div>
</div>
<div class="col-xs-6 col-sm-4">
<h4>Global CSS</h4>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="type.less"> <input type="checkbox" checked value="type.less">
@ -46,6 +36,12 @@ base_url: "../"
Code Code
</label> </label>
</div> </div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="grid.less">
Grid system
</label>
</div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="tables.less"> <input type="checkbox" checked value="tables.less">
@ -64,46 +60,46 @@ base_url: "../"
Buttons Buttons
</label> </label>
</div> </div>
</div> </div><!-- .col-xs-6 .col-sm-4 -->
<div class="col-xs-6 col-sm-4">
<h4>Utility classes</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="utilities.less" data-dependents="navbar.less">
Basic utilities
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="responsive-utilities.less">
Responsive utilities
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="component-animations.less">
Component animations (for JS)
</label>
</div>
</div>
</div>
<h3>Components</h3>
<div class="row">
<div class="col-xs-6 col-sm-4"> <div class="col-xs-6 col-sm-4">
<h4>Navigation</h4> <h3>Components</h3>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="navs.less"> <input type="checkbox" checked value="glyphicons.less">
Glyphicons
</label>
</div>
<div class="checkbox">
<label>
<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="input-groups.less" data-dependency="forms.less">
Input groups
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="navs.less" data-dependents="navbar.less">
Navs Navs
</label> </label>
</div> </div>
<div class="checkbox"> <div class="checkbox">
<label> <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 Navbar
</label> </label>
</div> </div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="breadcrumbs.less">
Breadcrumbs
</label>
</div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="pagination.less"> <input type="checkbox" checked value="pagination.less">
@ -118,19 +114,52 @@ base_url: "../"
</div> </div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="breadcrumbs.less"> <input type="checkbox" checked value="labels.less">
Breadcrumbs Labels
</label> </label>
</div> </div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="badges.less">
Badges
</label>
</div> </div>
<div class="col-xs-6 col-sm-4">
<h4>Content blocks</h4>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="jumbotron.less"> <input type="checkbox" checked value="jumbotron.less">
Jumbotron Jumbotron
</label> </label>
</div> </div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="thumbnails.less">
Thumbnails
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="alerts.less">
Alerts
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="progress-bars.less">
Progress bars
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="media.less">
Media items
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="list-group.less">
List groups
</label>
</div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="panels.less"> <input type="checkbox" checked value="panels.less">
@ -143,15 +172,16 @@ base_url: "../"
Wells Wells
</label> </label>
</div> </div>
</div>
<div class="col-xs-6 col-sm-4">
<h4>Behavioral (requires JS)</h4>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="alerts.less"> <input type="checkbox" checked value="close.less">
Alerts Close icon
</label> </label>
</div> </div>
</div><!-- .col-xs-6 .col-sm-4 -->
<div class="col-xs-6 col-sm-4">
<h3>JavaScript components</h3>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="dropdowns.less"> <input type="checkbox" checked value="dropdowns.less">
@ -182,71 +212,28 @@ base_url: "../"
Carousel Carousel
</label> </label>
</div> </div>
</div>
</div>
<div class="row"> <h3>Utilities</h3>
<div class="col-xs-6 col-sm-4">
<h4>Media</h4>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="thumbnails.less"> <input type="checkbox" checked value="utilities.less" data-dependents="navbar.less">
Thumbnails Basic utilities
</label> </label>
</div> </div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="list-group.less"> <input type="checkbox" checked value="responsive-utilities.less">
List groups Responsive utilities
</label> </label>
</div> </div>
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" checked value="media.less"> <input type="checkbox" checked value="component-animations.less">
Media items Component animations (for JS)
</label> </label>
</div> </div>
</div> </div><!-- .col-xs-6 .col-sm-4 -->
<div class="col-xs-6 col-sm-4"> </div><!-- /.row -->
<h4>Miscellaneous</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="input-groups.less" data-dependency="forms.less">
Input groups
</label>
</div>
<div class="checkbox">
<label>
<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="progress-bars.less">
Progress bars
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="badges.less">
Badges
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="labels.less">
Labels
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="close.less">
Close icon
</label>
</div>
</div>
</div>
</div> </div>