Commit 72198a59 authored by Mark Otto's avatar Mark Otto
Browse files

removing glyphicons images, swapping in new icon font with new classes

parent d0c75bbc
main cleanup-floating-forms cssvar-function dependabot/npm_and_yarn/stylelint-and-stylelint-config-twbs-bootstrap-15.3.0 extend-snippets feat/data-target floating-always-visible floating-labels-icons fod-main-banner form-controls-with-icons gh-pages gh-pages-530-alpha2 github/fork/719media/patch-13 github/fork/719media/patch-14 github/fork/719media/patch-9 github/fork/ChellyAhmed/fix-typo-reboot.md github/fork/ChellyAhmed/offcanvas-scroll-back github/fork/CtrlAltLilith/main github/fork/Elysiome/offcanvas-optional-window-resizing github/fork/JanSargsyan/main github/fork/LunicLynx/support-different-line-height-for-buttons github/fork/Psixodelik/main github/fork/Ronid1/ronid1/offcanvas_static_backdrop github/fork/RyanBerliner/tooltip-accessibility github/fork/SantiagoPVazquez/Feature-default-border-bottom-to-dropdown-item github/fork/Sir-Genius/utils github/fork/Sumit-Singh-8/main github/fork/Viktor-VERA2020/offcanvas-slide github/fork/Zivangu9/input-group-for-form-control-plaintext github/fork/alpadev/alpadev/call-dispose-on-component-reinstantiation github/fork/astagi/fix/tree-shake-modules github/fork/compnerd/dark-accordion-icon github/fork/derSascha/dropdown-dont-close-on-input-click github/fork/dev-ph1l/main github/fork/donquixote/issue-33861-utl-mixin github/fork/florianlacreuse/mixin-make-row-gutter-y github/fork/gregorw/main github/fork/iteggmbh/transitionend-dispose-race github/fork/jdelStrother/patch-1 github/fork/jonnysp/form-floating github/fork/jonnysp/independent-offcanvas github/fork/jonnysp/theme-dark-on-card-and-modal-fix github/fork/josefdlange/floating-label-placeholder-opacity github/fork/julien-deramond/enhance-change-version.js github/fork/julien-deramond/main-jd-fix-offset-content github/fork/julien-deramond/main-jd-issue-with-utitlies github/fork/julien-deramond/main-xmr-pa11y-ci-jd-add-hideElements github/fork/kyletsang/fix-tooltip-padding github/fork/lacutah/CheckboxCenteringDocumentation github/fork/lekoala/patch-3 github/fork/louismaximepiton/main-kld-lmp-collapse-proposal github/fork/louismaximepiton/main-lmp-card-inner-border-radius-fix github/fork/louismaximepiton/main-lmp-carousel-multiple-images github/fork/louismaximepiton/main-lmp-css-var-init github/fork/louismaximepiton/main-lmp-disabled-floating-label-fix github/fork/louismaximepiton/main-lmp-input-range-fix github/fork/louismaximepiton/main-lmp-shift-color github/fork/louismaximepiton/main-lmp-table-active-tr-fix github/fork/maciek-szn/switch github/fork/michael-roth/feature/19964-multiple-tab-targets github/fork/mistic100/dom-utils github/fork/nkdas91/accordion github/fork/nstungcom/fix-missing-modal-open-class github/fork/oraliahdz/animation-utilities github/fork/pine3ree/patch-7 github/fork/pouwerkerk/unindent-scss-docs-shortcode github/fork/smares/smares-no-scolling-on-modal-close github/fork/tgm-git/patch-1 gs-forms gs-toasts-with-animated-progress-bar gs/add-history-helper gs/change-version-dir-on-docs gs/data-must-set-onlu-one-instance gs/docs/fix-drop-down-error gs/event-handler-2 gs/make-docs-js-build gs/make-simple-attribute-toggler gs/popover-fix-doc gs/provide-steConfig-method gs/scrollspy-smoothscroll-option-use-browser-history gs/streamline-jqueryInterface gs/support-drop-down-in-navbar gs/test-js-generic-trigger gs/try-web-components gs/tweak-collapse-js-selector gs/use-event-handler-in-cocmponent gs/use-rollup-replace-for-version jo-docs-thanks-page jo-ssr-friendly logical-props-spacing-utils main-fod-disabled-form-check-label main-fod-nested-accordion main-fod-simpler-table-structure main-fod-table-separator main-fod-utilities-contrast main-jd-abbr-title main-jd-add-chips main-jd-add-doc-for-sass-custom-colors main-jd-add-enable-host-to-handle-web-components main-jd-browserstack-fine-tune main-jd-browserstack-updates main-jd-docs-consistent-usage-of-css-sections-step-2 main-jd-fix-docs-headers-in-white main-jd-fix-highlight-docs-border-radius main-jd-fix-placeholder-color-background-params-for-img-markup main-jd-glossary-experiment main-jd-postcss-drop-empty-css-vars main-jd-proto-doc-astro main-jd-skip-navigation-component main-jd-stackblitz-for-examples main-jd-upgrade-browserlistrc main-jd-use-host main-lmp-dark-theme-customization main-lmp-handle-scroll-target main-lmp-tab-fix main-mc-opensearch main-xmr-bundlewatch-action main-xmr-eslint-plugin-compat main-xmr-hugo-docs-vendor main-xmr-hugo-rm-ver main-xmr-linkinator-prod main-xmr-min-mangle main-xmr-pa11y-ci more-darkmode-examples nested-dropdowns patrickhlauke-issue37428 patrickhlauke-use-of-color-tweaks pr/34102 pr/37590 previous-next-docs-links sticky-thead utilities-functions-mixin v3-dev v4-dev v4-dev-dropdown-hide-method v530-dev v6-postcss-custom-media v6-spinner-dots v6/gs/use-floating-ui-in-place-of-popper xmr/dev xmr/docs-png xmr/docs-svgs xmr/hugo-reorg-files xmr/js-2 xmr/markdownlint xmr/prepare-530-alpha2 xmr/xo v5.3.0-alpha1 v5.2.3 v5.2.2 v5.2.1 v5.2.0 v5.2.0-beta1 v5.1.3 v5.1.2 v5.1.1 v5.1.0 v5.0.2 v5.0.1 v5.0.0 v5.0.0-beta3 v5.0.0-beta2 v5.0.0-beta1 v5.0.0-alpha3 v5.0.0-alpha2 v5.0.0-alpha1 v4.6.2 v4.6.1 v4.6.0 v4.5.3 v4.5.2 v4.5.1 v4.5.0 v4.4.1 v4.4.0 v4.3.1 v4.3.0 v4.2.1 v4.2.0 v4.1.3 v4.1.2 v4.1.1 v4.1.0 v4.0.0 v4.0.0-beta.3 v4.0.0-beta.2 v4.0.0-beta v4.0.0-alpha.6 v4.0.0-alpha.5 v4.0.0-alpha.4 v4.0.0-alpha.3 v4.0.0-alpha.2 v4.0.0-alpha v3.4.1 v3.4.0 v3.3.7 v3.3.6 v3.3.5 v3.3.4 v3.3.2 v3.3.1 v3.3.0 v3.2.0 v3.1.1 v3.1.0 v3.0.3 v3.0.2 v3.0.1 v3.0.0 v3.0.0-rc.2 v3.0.0-rc1
21 merge requests!7033Fix backdrop undefined bug in modal,!8635ignore Gruntfile.js in jekyll,!8339Fix broken links to navbar component in docs examples,!7329Fix for issue #7328,!7219Fix for mini typo mistake in css.html,!7674Clear float on all when navbar is collapsed - v3,!7344Fixed .spanX selector (*= instead of ^=),!7346Fix compilation error,!7775added some tests for tooltip title setter,!8157Close Me: Docs "Customize and Download" button fix,!7509Proposed fix for allowing Collapse events ('show'/'hide') to be cancelled,!7964commit fixes #7792,!8656Added rel="stylesheet" to CDN-Examples,!8527Inner properties move 1,!8245Interactive color picker - Closed: request against wrong branch,!7865Patch 2,!7651Drop the sizzle dependency to allow smaller builds targeting mobile devices,!6853typeahead: do not store item data in an attribute,!6666Patch 1,!65463.0.0 wip - fixed the issue in which the test pid isn't killed if a test fails,!6503control markup changes added
Showing with 280 additions and 204 deletions
+280 -204
......@@ -67,9 +67,8 @@
}
// Button Sizes
// --------------------------------------------------
// -------------------------
// Large
.btn-large {
......@@ -77,10 +76,6 @@
font-size: @fontSizeLarge;
.border-radius(@borderRadiusLarge);
}
.btn-large [class^="icon-"],
.btn-large [class*=" icon-"] {
margin-top: 2px;
}
// Small
.btn-small {
......@@ -88,10 +83,6 @@
font-size: @fontSizeSmall;
.border-radius(@borderRadiusSmall);
}
.btn-small [class^="icon-"],
.btn-small [class*=" icon-"] {
margin-top: 0;
}
// Mini
.btn-mini {
......@@ -101,6 +92,14 @@
}
// Icons in buttons
// -------------------------
.btn-large [class^="glyphicon-"]::before { font-size: 14px; }
.btn-small [class^="glyphicon-"]::before { font-size: 10px; }
.btn-mini [class^="glyphicon-"]::before { font-size: 9px; }
// Block button
// -------------------------
......
//
// Glyphicons
// -----------------------------------------------------------------------------
// About
//
// Glyphicons font-based icons require you to include all relevant font files,
// found in the Bootstrap repo under /fonts/. Files are referenced relative to
// the compiled CSS.
//
// Basic usage
//
// Since icons are fonts, they can be placed anywhere text is placed. To use,
// create an inline element with the appropriate class, like so:
//
// <a href="#"><span class="glyphicon-star"></span> Star</a>
//
// Use them in links, buttons, headings, and more.
// Import the fonts
@font-face {
font-family: 'Glyphicons Halflings';
src: url('../fonts/glyphiconshalflings-regular.eot');
src: url('../fonts/glyphiconshalflings-regular.eot?#iefix') format('embedded-opentype'),
url('../fonts/glyphiconshalflings-regular.woff') format('woff'),
url('../fonts/glyphiconshalflings-regular.ttf') format('truetype'),
url('../fonts/glyphiconshalflings-regular.svg#glyphicons_halflingsregular') format('svg');
font-style: normal;
font-weight: normal;
}
// Catchall baseclass
[class^="glyphicon-"]:before {
display: inline-block;
font: normal 12px/1 'Glyphicons Halflings';
}
// Individual icons
.glyphicon-glass:before { content: "\e001"; }
.glyphicon-music:before { content: "\e002"; }
.glyphicon-search:before { content: "\e003"; }
.glyphicon-envelope:before { content: "\2709"; }
.glyphicon-heart:before { content: "\e005"; }
.glyphicon-star:before { content: "\e006"; }
.glyphicon-star-empty:before { content: "\e007"; }
.glyphicon-user:before { content: "\e008"; }
.glyphicon-film:before { content: "\e009"; }
.glyphicon-th-large:before { content: "\e010"; }
.glyphicon-th:before { content: "\e011"; }
.glyphicon-th-list:before { content: "\e012"; }
.glyphicon-ok:before { content: "\e013"; }
.glyphicon-remove:before { content: "\e014"; }
.glyphicon-zoom-in:before { content: "\e015"; }
.glyphicon-zoom-out:before { content: "\e016"; }
.glyphicon-off:before { content: "\e017"; }
.glyphicon-signal:before { content: "\e018"; }
.glyphicon-cog:before { content: "\e019"; }
.glyphicon-trash:before { content: "\e020"; }
.glyphicon-home:before { content: "\e021"; }
.glyphicon-file:before { content: "\e022"; }
.glyphicon-time:before { content: "\e023"; }
.glyphicon-road:before { content: "\e024"; }
.glyphicon-download-alt:before { content: "\e025"; }
.glyphicon-download:before { content: "\e026"; }
.glyphicon-upload:before { content: "\e027"; }
.glyphicon-inbox:before { content: "\e028"; }
.glyphicon-play-circle:before { content: "\e029"; }
.glyphicon-repeat:before { content: "\e030"; }
.glyphicon-refresh:before { content: "\e031"; }
.glyphicon-list-alt:before { content: "\e032"; }
.glyphicon-lock:before { content: "\e033"; }
.glyphicon-flag:before { content: "\e034"; }
.glyphicon-headphones:before { content: "\e035"; }
.glyphicon-volume-off:before { content: "\e036"; }
.glyphicon-volume-down:before { content: "\e037"; }
.glyphicon-volume-up:before { content: "\e038"; }
.glyphicon-qrcode:before { content: "\e039"; }
.glyphicon-barcode:before { content: "\e040"; }
.glyphicon-tag:before { content: "\e041"; }
.glyphicon-tags:before { content: "\e042"; }
.glyphicon-book:before { content: "\e043"; }
.glyphicon-bookmark:before { content: "\e044"; }
.glyphicon-print:before { content: "\e045"; }
.glyphicon-camera:before { content: "\e046"; }
.glyphicon-font:before { content: "\e047"; }
.glyphicon-bold:before { content: "\e048"; }
.glyphicon-italic:before { content: "\e049"; }
.glyphicon-text-height:before { content: "\e050"; }
.glyphicon-text-width:before { content: "\e051"; }
.glyphicon-align-left:before { content: "\e052"; }
.glyphicon-align-center:before { content: "\e053"; }
.glyphicon-align-right:before { content: "\e054"; }
.glyphicon-align-justify:before { content: "\e055"; }
.glyphicon-list:before { content: "\e056"; }
.glyphicon-indent-left:before { content: "\e057"; }
.glyphicon-indent-right:before { content: "\e058"; }
.glyphicon-facetime-video:before { content: "\e059"; }
.glyphicon-picture:before { content: "\e060"; }
.glyphicon-pencil:before { content: "\270f"; }
.glyphicon-map-marker:before { content: "\e062"; }
.glyphicon-adjust:before { content: "\e063"; }
.glyphicon-tint:before { content: "\e064"; }
.glyphicon-edit:before { content: "\e065"; }
.glyphicon-share:before { content: "\e066"; }
.glyphicon-check:before { content: "\e067"; }
.glyphicon-move:before { content: "\e068"; }
.glyphicon-step-backward:before { content: "\e069"; }
.glyphicon-fast-backward:before { content: "\e070"; }
.glyphicon-backward:before { content: "\e071"; }
.glyphicon-play:before { content: "\e072"; }
.glyphicon-pause:before { content: "\e073"; }
.glyphicon-stop:before { content: "\e074"; }
.glyphicon-forward:before { content: "\e075"; }
.glyphicon-fast-forward:before { content: "\e076"; }
.glyphicon-step-forward:before { content: "\e077"; }
.glyphicon-eject:before { content: "\e078"; }
.glyphicon-chevron-left:before { content: "\e079"; }
.glyphicon-chevron-right:before { content: "\e080"; }
.glyphicon-plus-sign:before { content: "\e081"; }
.glyphicon-minus-sign:before { content: "\e082"; }
.glyphicon-remove-sign:before { content: "\e083"; }
.glyphicon-ok-sign:before { content: "\e084"; }
.glyphicon-question-sign:before { content: "\e085"; }
.glyphicon-info-sign:before { content: "\e086"; }
.glyphicon-screenshot:before { content: "\e087"; }
.glyphicon-remove-circle:before { content: "\e088"; }
.glyphicon-ok-circle:before { content: "\e089"; }
.glyphicon-ban-circle:before { content: "\e090"; }
.glyphicon-arrow-left:before { content: "\e091"; }
.glyphicon-arrow-right:before { content: "\e092"; }
.glyphicon-arrow-up:before { content: "\e093"; }
.glyphicon-arrow-down:before { content: "\e094"; }
.glyphicon-share-alt:before { content: "\e095"; }
.glyphicon-resize-full:before { content: "\e096"; }
.glyphicon-resize-small:before { content: "\e097"; }
.glyphicon-plus:before { content: "\002b"; }
.glyphicon-minus:before { content: "\2212"; }
.glyphicon-asterisk:before { content: "\002a"; }
.glyphicon-exclamation-sign:before { content: "\e101"; }
.glyphicon-gift:before { content: "\e102"; }
.glyphicon-leaf:before { content: "\e103"; }
.glyphicon-fire:before { content: "\e104"; }
.glyphicon-eye-open:before { content: "\e105"; }
.glyphicon-eye-close:before { content: "\e106"; }
.glyphicon-warning-sign:before { content: "\e107"; }
.glyphicon-plane:before { content: "\e108"; }
.glyphicon-calendar:before { content: "\e109"; }
.glyphicon-random:before { content: "\e110"; }
.glyphicon-comment:before { content: "\e111"; }
.glyphicon-magnet:before { content: "\e112"; }
.glyphicon-chevron-up:before { content: "\e113"; }
.glyphicon-chevron-down:before { content: "\e114"; }
.glyphicon-retweet:before { content: "\e115"; }
.glyphicon-shopping-cart:before { content: "\e116"; }
.glyphicon-folder-close:before { content: "\e117"; }
.glyphicon-folder-open:before { content: "\e118"; }
.glyphicon-resize-vertical:before { content: "\e119"; }
.glyphicon-resize-horizontal:before { content: "\e120"; }
.glyphicon-hdd:before { content: "\e121"; }
.glyphicon-bullhorn:before { content: "\e122"; }
.glyphicon-bell:before { content: "\e123"; }
.glyphicon-certificate:before { content: "\e124"; }
.glyphicon-thumbs-up:before { content: "\e125"; }
.glyphicon-thumbs-down:before { content: "\e126"; }
.glyphicon-hand-right:before { content: "\e127"; }
.glyphicon-hand-left:before { content: "\e128"; }
.glyphicon-hand-up:before { content: "\e129"; }
.glyphicon-hand-down:before { content: "\e130"; }
.glyphicon-circle-arrow-right:before { content: "\e131"; }
.glyphicon-circle-arrow-left:before { content: "\e132"; }
.glyphicon-circle-arrow-up:before { content: "\e133"; }
.glyphicon-circle-arrow-down:before { content: "\e134"; }
.glyphicon-globe:before { content: "\e135"; }
.glyphicon-wrench:before { content: "\e136"; }
.glyphicon-tasks:before { content: "\e137"; }
.glyphicon-filter:before { content: "\e138"; }
.glyphicon-briefcase:before { content: "\e139"; }
.glyphicon-fullscreen:before { content: "\e140"; }
.glyphicon-dashboard:before { content: "\e141"; }
.glyphicon-paperclip:before { content: "\e142"; }
.glyphicon-heart-empty:before { content: "\e143"; }
.glyphicon-link:before { content: "\e144"; }
.glyphicon-phone:before { content: "\e145"; }
.glyphicon-pushpin:before { content: "\e146"; }
.glyphicon-euro:before { content: "\20ac"; }
.glyphicon-usd:before { content: "\e148"; }
.glyphicon-gbp:before { content: "\e149"; }
.glyphicon-sort:before { content: "\e150"; }
.glyphicon-sort-by-alphabet:before { content: "\e151"; }
.glyphicon-sort-by-alphabet-alt:before { content: "\e152"; }
.glyphicon-sort-by-order:before { content: "\e153"; }
.glyphicon-sort-by-order-alt:before { content: "\e154"; }
.glyphicon-sort-by-attributes:before { content: "\e155"; }
.glyphicon-sort-by-attributes-alt:before { content: "\e156"; }
.glyphicon-unchecked:before { content: "\e157"; }
.glyphicon-expand:before { content: "\e158"; }
.glyphicon-collapse:before { content: "\e159"; }
.glyphicon-collapse-top:before { content: "\e160"; }
//
// Sprites
// --------------------------------------------------
// ICONS
// -----
// All icons receive the styles of the <i> tag with a base class
// of .i and are then given a unique class to add width, height,
// and background-position. Your resulting HTML will look like
// <i class="icon-inbox"></i>.
// For the white version of the icons, just add the .icon-white class:
// <i class="icon-inbox icon-white"></i>
[class^="icon-"],
[class*=" icon-"] {
display: inline-block;
width: 14px;
height: 14px;
.ie7-restore-right-whitespace();
line-height: 14px;
vertical-align: text-top;
background-image: url("@{iconSpritePath}");
background-position: 14px 14px;
background-repeat: no-repeat;
margin-top: 1px;
}
/* White icons with optional class, or on hover/active states of certain elements */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
.nav-list > .active > a > [class^="icon-"],
.nav-list > .active > a > [class*=" icon-"],
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"] {
background-image: url("@{iconWhiteSpritePath}");
}
.icon-glass { background-position: 0 0; }
.icon-music { background-position: -24px 0; }
.icon-search { background-position: -48px 0; }
.icon-envelope { background-position: -72px 0; }
.icon-heart { background-position: -96px 0; }
.icon-star { background-position: -120px 0; }
.icon-star-empty { background-position: -144px 0; }
.icon-user { background-position: -168px 0; }
.icon-film { background-position: -192px 0; }
.icon-th-large { background-position: -216px 0; }
.icon-th { background-position: -240px 0; }
.icon-th-list { background-position: -264px 0; }
.icon-ok { background-position: -288px 0; }
.icon-remove { background-position: -312px 0; }
.icon-zoom-in { background-position: -336px 0; }
.icon-zoom-out { background-position: -360px 0; }
.icon-off { background-position: -384px 0; }
.icon-signal { background-position: -408px 0; }
.icon-cog { background-position: -432px 0; }
.icon-trash { background-position: -456px 0; }
.icon-home { background-position: 0 -24px; }
.icon-file { background-position: -24px -24px; }
.icon-time { background-position: -48px -24px; }
.icon-road { background-position: -72px -24px; }
.icon-download-alt { background-position: -96px -24px; }
.icon-download { background-position: -120px -24px; }
.icon-upload { background-position: -144px -24px; }
.icon-inbox { background-position: -168px -24px; }
.icon-play-circle { background-position: -192px -24px; }
.icon-repeat { background-position: -216px -24px; }
.icon-refresh { background-position: -240px -24px; }
.icon-list-alt { background-position: -264px -24px; }
.icon-lock { background-position: -287px -24px; } // 1px off
.icon-flag { background-position: -312px -24px; }
.icon-headphones { background-position: -336px -24px; }
.icon-volume-off { background-position: -360px -24px; }
.icon-volume-down { background-position: -384px -24px; }
.icon-volume-up { background-position: -408px -24px; }
.icon-qrcode { background-position: -432px -24px; }
.icon-barcode { background-position: -456px -24px; }
.icon-tag { background-position: 0 -48px; }
.icon-tags { background-position: -25px -48px; } // 1px off
.icon-book { background-position: -48px -48px; }
.icon-bookmark { background-position: -72px -48px; }
.icon-print { background-position: -96px -48px; }
.icon-camera { background-position: -120px -48px; }
.icon-font { background-position: -144px -48px; }
.icon-bold { background-position: -167px -48px; } // 1px off
.icon-italic { background-position: -192px -48px; }
.icon-text-height { background-position: -216px -48px; }
.icon-text-width { background-position: -240px -48px; }
.icon-align-left { background-position: -264px -48px; }
.icon-align-center { background-position: -288px -48px; }
.icon-align-right { background-position: -312px -48px; }
.icon-align-justify { background-position: -336px -48px; }
.icon-list { background-position: -360px -48px; }
.icon-indent-left { background-position: -384px -48px; }
.icon-indent-right { background-position: -408px -48px; }
.icon-facetime-video { background-position: -432px -48px; }
.icon-picture { background-position: -456px -48px; }
.icon-pencil { background-position: 0 -72px; }
.icon-map-marker { background-position: -24px -72px; }
.icon-adjust { background-position: -48px -72px; }
.icon-tint { background-position: -72px -72px; }
.icon-edit { background-position: -96px -72px; }
.icon-share { background-position: -120px -72px; }
.icon-check { background-position: -144px -72px; }
.icon-move { background-position: -168px -72px; }
.icon-step-backward { background-position: -192px -72px; }
.icon-fast-backward { background-position: -216px -72px; }
.icon-backward { background-position: -240px -72px; }
.icon-play { background-position: -264px -72px; }
.icon-pause { background-position: -288px -72px; }
.icon-stop { background-position: -312px -72px; }
.icon-forward { background-position: -336px -72px; }
.icon-fast-forward { background-position: -360px -72px; }
.icon-step-forward { background-position: -384px -72px; }
.icon-eject { background-position: -408px -72px; }
.icon-chevron-left { background-position: -432px -72px; }
.icon-chevron-right { background-position: -456px -72px; }
.icon-plus-sign { background-position: 0 -96px; }
.icon-minus-sign { background-position: -24px -96px; }
.icon-remove-sign { background-position: -48px -96px; }
.icon-ok-sign { background-position: -72px -96px; }
.icon-question-sign { background-position: -96px -96px; }
.icon-info-sign { background-position: -120px -96px; }
.icon-screenshot { background-position: -144px -96px; }
.icon-remove-circle { background-position: -168px -96px; }
.icon-ok-circle { background-position: -192px -96px; }
.icon-ban-circle { background-position: -216px -96px; }
.icon-arrow-left { background-position: -240px -96px; }
.icon-arrow-right { background-position: -264px -96px; }
.icon-arrow-up { background-position: -289px -96px; } // 1px off
.icon-arrow-down { background-position: -312px -96px; }
.icon-share-alt { background-position: -336px -96px; }
.icon-resize-full { background-position: -360px -96px; }
.icon-resize-small { background-position: -384px -96px; }
.icon-plus { background-position: -408px -96px; }
.icon-minus { background-position: -433px -96px; }
.icon-asterisk { background-position: -456px -96px; }
.icon-exclamation-sign { background-position: 0 -120px; }
.icon-gift { background-position: -24px -120px; }
.icon-leaf { background-position: -48px -120px; }
.icon-fire { background-position: -72px -120px; }
.icon-eye-open { background-position: -96px -120px; }
.icon-eye-close { background-position: -120px -120px; }
.icon-warning-sign { background-position: -144px -120px; }
.icon-plane { background-position: -168px -120px; }
.icon-calendar { background-position: -192px -120px; }
.icon-random { background-position: -216px -120px; width: 16px; }
.icon-comment { background-position: -240px -120px; }
.icon-magnet { background-position: -264px -120px; }
.icon-chevron-up { background-position: -288px -120px; }
.icon-chevron-down { background-position: -313px -119px; } // 1px, 1px off
.icon-retweet { background-position: -336px -120px; }
.icon-shopping-cart { background-position: -360px -120px; }
.icon-folder-close { background-position: -384px -120px; }
.icon-folder-open { background-position: -408px -120px; width: 16px; }
.icon-resize-vertical { background-position: -432px -119px; } // 1px, 1px off
.icon-resize-horizontal { background-position: -456px -118px; } // 1px, 2px off
.icon-hdd { background-position: 0 -144px; }
.icon-bullhorn { background-position: -24px -144px; }
.icon-bell { background-position: -48px -144px; }
.icon-certificate { background-position: -72px -144px; }
.icon-thumbs-up { background-position: -96px -144px; }
.icon-thumbs-down { background-position: -120px -144px; }
.icon-hand-right { background-position: -144px -144px; }
.icon-hand-left { background-position: -168px -144px; }
.icon-hand-up { background-position: -192px -144px; }
.icon-hand-down { background-position: -216px -144px; }
.icon-circle-arrow-right { background-position: -240px -144px; }
.icon-circle-arrow-left { background-position: -264px -144px; }
.icon-circle-arrow-up { background-position: -288px -144px; }
.icon-circle-arrow-down { background-position: -312px -144px; }
.icon-globe { background-position: -336px -144px; }
.icon-wrench { background-position: -360px -144px; }
.icon-tasks { background-position: -384px -144px; }
.icon-filter { background-position: -408px -144px; }
.icon-briefcase { background-position: -432px -144px; }
.icon-fullscreen { background-position: -456px -144px; }
......@@ -34,6 +34,77 @@
<div class="container">
<h2>Icons in buttons</h2>
<p>
<button class="btn btn-large" type="button">
Profile
</button>
<button class="btn btn-large" type="button">
<span class="glyphicon-user"></span> Profile
</button>
<button class="btn btn-large" type="button">
<span class="glyphicon-home"></span> Home
</button>
<button class="btn btn-large" type="button">
<span class="glyphicon-link"></span> Link
</button>
</p>
<p>
<button class="btn" type="button">
Profile
</button>
<button class="btn" type="button">
<span class="glyphicon-user"></span> Profile
</button>
<button class="btn" type="button">
<span class="glyphicon-home"></span> Home
</button>
<button class="btn" type="button">
<span class="glyphicon-link"></span> Link
</button>
</p>
<p>
<button class="btn btn-small" type="button">
Profile
</button>
<button class="btn btn-small" type="button">
<span class="glyphicon-user"></span> Profile
</button>
<button class="btn btn-small" type="button">
<span class="glyphicon-home"></span> Home
</button>
<button class="btn btn-small" type="button">
<span class="glyphicon-link"></span> Link
</button>
</p>
<p>
<button class="btn btn-mini" type="button">
Profile
</button>
<button class="btn btn-mini" type="button">
<span class="glyphicon-user"></span> Profile
</button>
<button class="btn btn-mini" type="button">
<span class="glyphicon-home"></span> Home
</button>
<button class="btn btn-mini" type="button">
<span class="glyphicon-link"></span> Link
</button>
</p>
<div class="btn-toolbar">
<div class="btn-group">
<a class="btn" href="#"><i class="glyphicon-align-left"></i></a>
<a class="btn" href="#"><i class="glyphicon-align-center"></i></a>
<a class="btn" href="#"><i class="glyphicon-align-right"></i></a>
<a class="btn" href="#"><i class="glyphicon-align-justify"></i></a>
</div>
</div>
<hr>
<h2>Dropups</h2>
<div class="btn-toolbar">
<div class="btn-group dropup">
......
......@@ -68,7 +68,7 @@
@paddingLarge: 11px 19px; // 44px
@paddingSmall: 2px 10px; // 26px
@paddingMini: 1px 6px; // 24px
@paddingMini: 0 6px; // 24px
@baseBorderRadius: 4px;
@borderRadiusLarge: 6px;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment