diff options
Diffstat (limited to 'docs/customize.html')
| -rw-r--r-- | docs/customize.html | 377 |
1 files changed, 0 insertions, 377 deletions
diff --git a/docs/customize.html b/docs/customize.html deleted file mode 100644 index 6507695ff..000000000 --- a/docs/customize.html +++ /dev/null @@ -1,377 +0,0 @@ ---- -layout: default -title: Customize and download -slug: customize -lead: Customize Bootstrap's components, Less variables, and jQuery plugins to get your very own version. ---- - - -<!-- less.js isn't IE8-compatible and throws an exception during initialization, so our Blob compatibility check and error messaging code never get called in that case. - So we use a conditional comment instead to inform folks about the lack of IE8 support. ---> -<!--[if lt IE 9]> - <style> - .bs-customizer, - .bs-customizer-import, - .bs-docs-sidebar { - display: none; - } - </style> - <div class="alert alert-danger"> - <strong>The Bootstrap Customizer does not support IE9 and below.</strong><br> - Please take a second to <a href="http://browsehappy.com/">upgrade to a more modern browser</a>. - </div> -<![endif]--> - -<!-- Customizer form --> - -<div class="bs-docs-section bs-customizer-import"> - <div id="import-drop-target" class="bs-dropzone"> - <h2>✍</h2> - <p class="lead">Have an existing configuration? Upload your <code>config.json</code> to import it.</p> - <p>Drag and drop here, or <label id="import-manual-trigger" class="btn-link">manually upload<input type="file" id="import-file-select" class="hidden"></label>.</p> - <hr> - <p><strong>Don't have one?</strong> That's okay—just start customizing the fields below.</p> - </div> -</div><!-- /import --> - -<form class="bs-customizer"> - <div class="bs-docs-section" id="less-section"> - <button class="btn btn-secondary toggle" type="button">Toggle all</button> - <h1 id="less" class="page-header">Less files</h1> - - <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> - - <div class="row"> - <div class="col-xs-6 col-sm-4"> - <h3>Common CSS</h3> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="print.less"> - Print media styles - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="type.less"> - Typography - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="code.less"> - 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"> - Tables - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="forms.less" data-dependents="navbar.less,input-groups.less"> - Forms - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="buttons.less" data-dependents="button-groups.less"> - Buttons - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="responsive-utilities.less"> - Responsive utilities - </label> - </div> - </div><!-- .col-xs-6 .col-sm-4 --> - - <div class="col-xs-6 col-sm-4"> - <h3>Components</h3> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="glyphicons.less"> - Glyphicons - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="button-groups.less" data-dependencies="buttons.less"> - Button groups - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="input-groups.less" data-dependencies="forms.less"> - Input groups - </label> - </div> - <div class="checkbox"> - <label> - <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,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"> - Pagination - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="pager.less"> - Pager - </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="badges.less"> - Badges - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="jumbotron.less"> - Jumbotron - </label> - </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"> - <label> - <input type="checkbox" checked value="panels.less"> - Panels - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="responsive-embed.less"> - Responsive embed - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="wells.less"> - Wells - </label> - </div> - <div class="checkbox"> - <label> - <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="component-animations.less"> - Component animations (for JS) - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="dropdowns.less"> - Dropdowns - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="tooltip.less"> - Tooltips - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="popovers.less"> - Popovers - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="modals.less"> - Modals - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="carousel.less"> - Carousel - </label> - </div> - </div><!-- .col-xs-6 .col-sm-4 --> - </div><!-- /.row --> - </div> - - <div class="bs-docs-section" id="plugin-section"> - <button class="btn btn-secondary toggle" type="button">Toggle all</button> - <h1 id="plugins" class="page-header">jQuery plugins</h1> - - <p class="lead">Choose which jQuery plugins should be included in your custom JavaScript files. Unsure what to include? Read the <a href="../javascript/">JavaScript</a> page in the docs.</p> - <div class="row"> - <div class="col-lg-6"> - <h4>Linked to components</h4> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="alert.js"> - Alert dismissal - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="button.js"> - Advanced buttons - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="carousel.js"> - Carousel functionality - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="dropdown.js"> - Dropdowns - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="modal.js"> - Modals - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="tooltip.js"> - Tooltips - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="popover.js" data-dependencies="tooltip.js"> - Popovers <small>(requires Tooltips)</small> - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="tab.js"> - Togglable tabs - </label> - </div> - </div> - <div class="col-lg-6"> - <h4>Magic</h4> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="affix.js"> - Affix - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="collapse.js"> - Collapse - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="scrollspy.js"> - Scrollspy - </label> - </div> - <div class="checkbox"> - <label> - <input type="checkbox" checked value="transition.js"> - Transitions <small>(required for any kind of animation)</small> - </label> - </div> - </div> - </div> - - <div class="bs-callout bs-callout-info"> - <h4>Produces two files</h4> - <p>All checked plugins will be compiled into a readable <code>bootstrap.js</code> and a minified <code>bootstrap.min.js</code>. We recommend you use the minified version in production.</p> - </div> - - <div class="bs-callout bs-callout-danger"> - <h4>jQuery required</h4> - <p>All plugins require the latest version of <a href="http://jquery.com/" target="_blank">jQuery</a> to be included.</p> - </div> - </div> - - <div class="bs-docs-section" id="less-variables-section"> - <button class="btn btn-secondary toggle" type="button">Reset to defaults</button> - <h1 id="less-variables" class="page-header">Less variables</h1> - - <p class="lead">Customize Less variables to define colors, sizes and more inside your custom CSS stylesheets.</p> - {% include customizer-variables.html %} - </div> - - <div class="bs-docs-section"> - <h1 id="download" class="page-header">Download</h1> - - <p class="lead">Hooray! Your custom version of Bootstrap is now ready to be compiled. Just click the button below to finish the process.</p> - <div class="bs-customize-download"> - <button type="submit" id="btn-compile" disabled class="btn btn-block btn-lg btn-outline" onclick="ga('send', 'event', 'Customize', 'Download', 'Customize and Download');">Compile and Download</button> - </div> - </div><!-- /download --> -</form> |