Nuevos bootsrap icons

This commit is contained in:
2025-08-05 08:40:53 +00:00
parent f316484747
commit da74405f64
4256 changed files with 42979 additions and 6 deletions

View File

@@ -6,7 +6,8 @@
"illuminate/collections": "^12.21",
"upstatement/routes": "^0.9.2",
"hellonico/timber-dump-extension": "^2.0",
"mobiledetect/mobiledetectlib": "^4.8"
"mobiledetect/mobiledetectlib": "^4.8",
"twbs/bootstrap-icons": "^1.13"
},
"config": {
"allow-plugins": {

41
composer.lock generated
View File

@@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
"This file is @generated automatically"
],
"content-hash": "8e76b8483302334af29765ea9a5195b7",
"content-hash": "b5f02c3eb969662f72776b0ebbe99a5d",
"packages": [
{
"name": "altorouter/altorouter",
@@ -1486,6 +1486,45 @@
],
"time": "2025-05-13T13:41:56+00:00"
},
{
"name": "twbs/bootstrap-icons",
"version": "v1.13.1",
"source": {
"type": "git",
"url": "https://github.com/twbs/icons.git",
"reference": "ce0e49dd063243118a115f17ad1fe1fe7576d552"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/twbs/icons/zipball/ce0e49dd063243118a115f17ad1fe1fe7576d552",
"reference": "ce0e49dd063243118a115f17ad1fe1fe7576d552",
"shasum": ""
},
"type": "library",
"notification-url": "https://packagist.org/downloads/",
"license": [
"MIT"
],
"authors": [
{
"name": "Mark Otto",
"email": "markdotto@gmail.com"
}
],
"description": "Official open source SVG icon library for Bootstrap",
"homepage": "https://icons.getbootstrap.com/",
"keywords": [
"bootstrap",
"icon font",
"icons",
"svg"
],
"support": {
"issues": "https://github.com/twbs/icons/issues",
"source": "https://github.com/twbs/icons/tree/v1.13.1"
},
"time": "2025-05-09T23:01:19+00:00"
},
{
"name": "twig/twig",
"version": "v3.21.1",

View File

@@ -204,6 +204,7 @@ class AndairaSite extends Site {
// $version_for_app = $version;
$version_for_app = time();
wp_enqueue_style( 'twbsi', get_template_directory_uri() . '/assets/css/bootstrap.min.css', [], $version, 'all');
wp_enqueue_style( 'twbs', get_template_directory_uri() . '/vendor/twbs/bootstrap-icons/font/bootstrap-icons.min.css', [], $version, 'all');
//wp_enqueue_style( 'lust', get_template_directory_uri() . '/style.css', [], $version, 'all');
// wp_enqueue_script( 'pop', get_template_directory_uri() . '/static/popper.min.js', [], $version, false);

View File

@@ -1546,6 +1546,48 @@
],
"install-path": "../timber/timber"
},
{
"name": "twbs/bootstrap-icons",
"version": "v1.13.1",
"version_normalized": "1.13.1.0",
"source": {
"type": "git",
"url": "https://github.com/twbs/icons.git",
"reference": "ce0e49dd063243118a115f17ad1fe1fe7576d552"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/twbs/icons/zipball/ce0e49dd063243118a115f17ad1fe1fe7576d552",
"reference": "ce0e49dd063243118a115f17ad1fe1fe7576d552",
"shasum": ""
},
"time": "2025-05-09T23:01:19+00:00",
"type": "library",
"installation-source": "dist",
"notification-url": "https://packagist.org/downloads/",
"license": [
"MIT"
],
"authors": [
{
"name": "Mark Otto",
"email": "markdotto@gmail.com"
}
],
"description": "Official open source SVG icon library for Bootstrap",
"homepage": "https://icons.getbootstrap.com/",
"keywords": [
"bootstrap",
"icon font",
"icons",
"svg"
],
"support": {
"issues": "https://github.com/twbs/icons/issues",
"source": "https://github.com/twbs/icons/tree/v1.13.1"
},
"install-path": "../twbs/bootstrap-icons"
},
{
"name": "twig/twig",
"version": "v3.21.1",

View File

@@ -3,7 +3,7 @@
'name' => '__root__',
'pretty_version' => 'dev-main',
'version' => 'dev-main',
'reference' => 'd37cfdb8e891acad07787ce80300518989e28833',
'reference' => 'f316484747543a9191bf522b2fc316b40f1a9f31',
'type' => 'library',
'install_path' => __DIR__ . '/../../',
'aliases' => array(),
@@ -13,7 +13,7 @@
'__root__' => array(
'pretty_version' => 'dev-main',
'version' => 'dev-main',
'reference' => 'd37cfdb8e891acad07787ce80300518989e28833',
'reference' => 'f316484747543a9191bf522b2fc316b40f1a9f31',
'type' => 'library',
'install_path' => __DIR__ . '/../../',
'aliases' => array(),
@@ -217,6 +217,15 @@
'aliases' => array(),
'dev_requirement' => false,
),
'twbs/bootstrap-icons' => array(
'pretty_version' => 'v1.13.1',
'version' => '1.13.1.0',
'reference' => 'ce0e49dd063243118a115f17ad1fe1fe7576d552',
'type' => 'library',
'install_path' => __DIR__ . '/../twbs/bootstrap-icons',
'aliases' => array(),
'dev_requirement' => false,
),
'twig/twig' => array(
'pretty_version' => 'v3.21.1',
'version' => '3.21.1.0',

View File

@@ -0,0 +1,11 @@
# https://github.com/browserslist/browserslist#readme
>= 0.5%
last 2 major versions
not dead
Chrome >= 60
Firefox >= 60
Firefox ESR
iOS >= 12
Safari >= 12
not Explorer <= 11

View File

@@ -0,0 +1,11 @@
# editorconfig.org
root = true
[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true

View File

@@ -0,0 +1,32 @@
'use strict'
const codepoints = require('./font/bootstrap-icons.json')
module.exports = {
inputDir: './icons',
outputDir: './font',
fontTypes: ['woff2', 'woff'],
assetTypes: ['css', 'scss', 'json'],
name: 'bootstrap-icons',
codepoints,
prefix: 'bi',
selector: '.bi',
fontsUrl: './fonts',
formatOptions: {
json: {
indent: 2
}
},
// Use our custom Handlebars templates
templates: {
css: './build/font/css.hbs',
scss: './build/font/scss.hbs'
},
pathOptions: {
json: './font/bootstrap-icons.json',
css: './font/bootstrap-icons.css',
scss: './font/bootstrap-icons.scss',
woff: './font/fonts/bootstrap-icons.woff',
woff2: './font/fonts/bootstrap-icons.woff2'
}
}

View File

@@ -0,0 +1,2 @@
# Enforce Unix newlines
* text=auto eol=lf

View File

@@ -0,0 +1,16 @@
---
name: Bug report
about: Report a problem with an icon or our documentation.
title: ''
labels: bug
assignees: ''
---
Before opening, [search for duplicate or closed issues](https://github.com/twbs/icons/issues?utf8=%E2%9C%93&q=is%3Aissue).
As appropriate, please include:
- Operating system and version (Windows, macOS, Android, iOS)
- Browser and version (Chrome, Firefox, Safari, Microsoft Edge, Opera, Android Browser)
- A [reduced test case](https://css-tricks.com/reduced-test-cases/) or suggested fix using [CodePen](https://codepen.io/) or [JS Bin](https://jsbin.com/)

View File

@@ -0,0 +1,10 @@
---
name: Icon request
about: Suggest new icons to add to the project
title: ''
labels: icon-request
assignees: ''
---

View File

@@ -0,0 +1,3 @@
name: "CodeQL config"
paths-ignore:
- "**/vendor/**"

View File

@@ -0,0 +1,25 @@
version: 2
updates:
- package-ecosystem: "github-actions"
directory: "/"
schedule:
interval: monthly
labels:
- dependencies
- github_actions
groups:
github-actions:
patterns:
- "*"
- package-ecosystem: "npm"
directory: "/"
schedule:
interval: monthly
labels:
- dependencies
versioning-strategy: increase
groups:
production-dependencies:
dependency-type: "production"
development-dependencies:
dependency-type: "development"

Binary file not shown.

After

Width:  |  Height:  |  Size: 242 KiB

View File

@@ -0,0 +1,33 @@
name-template: 'v$NEXT_PATCH_VERSION 🌈'
tag-template: 'v$NEXT_PATCH_VERSION'
prerelease: true
exclude-labels:
- 'skip-changelog'
categories:
- title: '🚀 Features'
labels:
- 'new-feature'
- 'feature'
- 'enhancement'
- title: '🐛 Bug fixes'
labels:
- 'fix'
- 'bugfix'
- 'bug'
- title: '📖 Docs'
labels:
- 'docs'
- title: '🧰 Maintenance'
labels:
- 'build'
- 'meta'
- 'chore'
- 'CI'
- title: '📦 Dependencies'
labels:
- 'dependencies'
change-template: '- #$NUMBER: $TITLE'
template: |
## Changes
$CHANGES

View File

@@ -0,0 +1,44 @@
name: "CodeQL"
on:
push:
branches:
- main
- "!dependabot/**"
pull_request:
branches:
- main
- "!dependabot/**"
schedule:
- cron: "0 0 * * 0"
workflow_dispatch:
jobs:
analyze:
name: Analyze
runs-on: ubuntu-latest
permissions:
actions: read
contents: read
security-events: write
steps:
- name: Clone repository
uses: actions/checkout@v4
with:
persist-credentials: false
- name: Initialize CodeQL
uses: github/codeql-action/init@v3
with:
config-file: ./.github/codeql/codeql-config.yml
languages: "javascript"
queries: +security-and-quality
- name: Autobuild
uses: github/codeql-action/autobuild@v3
- name: Perform CodeQL Analysis
uses: github/codeql-action/analyze@v3
with:
category: "/language:javascript"

View File

@@ -0,0 +1,66 @@
name: Deploy
on:
release:
types:
- published
workflow_dispatch:
env:
FORCE_COLOR: 2
NODE: 20
permissions:
contents: read
jobs:
build:
runs-on: ubuntu-latest
if: github.repository == 'twbs/icons' && startsWith(github.ref, 'refs/tags/v')
steps:
- name: Clone repository
uses: actions/checkout@v4
with:
persist-credentials: false
- name: Set up Node.js
uses: actions/setup-node@v4
with:
node-version: "${{ env.NODE }}"
cache: npm
- name: Install npm dependencies
run: npm ci
- name: Prepare release
run: npm run release
- name: Deploy docs
uses: peaceiris/actions-gh-pages@v4
with:
allow_empty_commit: false
personal_token: ${{ secrets.PERSONAL_TOKEN }}
publish_branch: gh-pages
publish_dir: ./_site/
publish:
needs: build
runs-on: ubuntu-latest
if: github.repository == 'twbs/icons' && startsWith(github.ref, 'refs/tags/v')
steps:
- name: Clone repository
uses: actions/checkout@v4
with:
persist-credentials: false
- uses: actions/setup-node@v4
with:
node-version: "${{ env.NODE }}"
registry-url: "https://registry.npmjs.org"
- name: Publish on npm
run: npm publish
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

View File

@@ -0,0 +1,37 @@
name: Lint
on:
push:
branches:
- main
pull_request:
workflow_dispatch:
env:
FORCE_COLOR: 2
NODE: 20
permissions:
contents: read
jobs:
lint:
runs-on: ubuntu-latest
steps:
- name: Clone repository
uses: actions/checkout@v4
with:
persist-credentials: false
- name: Set up Node.js
uses: actions/setup-node@v4
with:
node-version: "${{ env.NODE }}"
cache: npm
- name: Install npm dependencies
run: npm ci
- name: Lint
run: npm run test

View File

@@ -0,0 +1,23 @@
name: Release notes
on:
push:
branches:
- main
workflow_dispatch:
permissions:
contents: read
jobs:
update_release_draft:
permissions:
# allow release-drafter/release-drafter to create GitHub releases and add labels to PRs
contents: write
pull-requests: write
runs-on: ubuntu-latest
if: github.repository == 'twbs/icons'
steps:
- uses: release-drafter/release-drafter@v6
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

View File

@@ -0,0 +1,51 @@
name: Tests
on:
push:
branches:
- main
- "!dependabot/**"
pull_request:
workflow_dispatch:
env:
FORCE_COLOR: 2
NODE: 20
permissions:
contents: read
jobs:
test:
runs-on: ubuntu-latest
steps:
- name: Clone repository
uses: actions/checkout@v4
with:
persist-credentials: false
- name: Set up Node.js
uses: actions/setup-node@v4
with:
node-version: "${{ env.NODE }}"
cache: npm
- run: java -version
- name: Install npm dependencies
run: npm ci
- name: Build the icons
run: npm run icons
- name: Build and test docs
run: npm run docs-test
- name: Run linkinator
uses: JustinBeckwith/linkinator-action@v1
with:
paths: _site
recurse: true
verbosity: error
skip: "^(?!http://localhost)"

12
vendor/twbs/bootstrap-icons/.gitignore vendored Normal file
View File

@@ -0,0 +1,12 @@
.DS_Store
/.hugo_build.lock
/.cache/
/_site/
/node_modules/
/resources/
# Editor folders
/.vscode/
# Release zip files
bootstrap-icons-*.zip

View File

@@ -0,0 +1,15 @@
{
"extends": [
"stylelint-config-twbs-bootstrap"
],
"reportInvalidScopeDisables": true,
"reportNeedlessDisables": true,
"overrides": [
{
"files": "**/*.scss",
"rules": {
"scss/selector-no-union-class-name": true
}
}
]
}

21
vendor/twbs/bootstrap-icons/LICENSE vendored Normal file
View File

@@ -0,0 +1,21 @@
The MIT License (MIT)
Copyright (c) 2019-2024 The Bootstrap Authors
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.

100
vendor/twbs/bootstrap-icons/README.md vendored Normal file
View File

@@ -0,0 +1,100 @@
<p align="center">
<a href="https://getbootstrap.com/">
<img src="https://getbootstrap.com/docs/5.2/assets/brand/bootstrap-logo-shadow.png" alt="Bootstrap logo" width="200" height="165">
</a>
</p>
<h3 align="center">Bootstrap Icons</h3>
<p align="center">
Official open source SVG icon library for Bootstrap with over 2,000 icons.
<br>
<a href="https://icons.getbootstrap.com/"><strong>Explore Bootstrap Icons »</strong></a>
<br>
<br>
<a href="https://getbootstrap.com/">Bootstrap</a>
·
<a href="https://themes.getbootstrap.com/">Themes</a>
·
<a href="https://blog.getbootstrap.com/">Blog</a>
<br>
</p>
[![Bootstrap Icons preview](https://github.com/twbs/icons/blob/main/.github/preview.png)](https://icons.getbootstrap.com/)
## Install
Bootstrap Icons are packaged up and published to npm. We only include the processed SVGs in this package—it's up to you and your team to implement. [Read our docs](https://icons.getbootstrap.com/) for usage instructions.
```shell
npm i bootstrap-icons
```
For those [using Packagist](https://packagist.org/packages/twbs/bootstrap-icons), you can also install Bootstrap Icons via Composer:
```shell
composer require twbs/bootstrap-icons
```
[Also available in Figma](https://www.figma.com/community/file/1042482994486402696/Bootstrap-Icons).
## Usage
Depending on your setup, you can include Bootstrap Icons in a handful of ways.
- Copy-paste SVGs as embedded HTML
- Reference via `<img>` element
- Use the SVG sprite
- Include via CSS
[See the docs for more information](https://icons.getbootstrap.com/#usage).
## Development
[![Build Status](https://img.shields.io/github/actions/workflow/status/twbs/icons/test.yml?branch=main&label=Tests&logo=github)](https://github.com/twbs/icons/actions/workflows/test.yml?query=workflow%3ATests+branch%3Amain)
[![npm version](https://img.shields.io/npm/v/bootstrap-icons?logo=npm&logoColor=fff)](https://www.npmjs.com/package/bootstrap-icons)
Clone the repo, install dependencies, and start the Hugo server locally.
```shell
git clone https://github.com/twbs/icons/
cd icons
npm i
npm start
```
Then open `http://localhost:4000` in your browser.
### npm scripts
Here are some key scripts you'll use during development. Be sure to look to our `package.json` or `npm run` output for a complete list of scripts.
| Script | Description |
|--------------|-------------------------------------------------------------------------------|
| `start` | Alias for running `docs-serve` |
| `docs-serve` | Starts a local Hugo server |
| `pages` | Generates permalink pages for each icon with template Markdown |
| `icons` | Processes and optimizes SVGs in `icons` directory, generates fonts and sprite |
## Adding SVGs
Icons are typically only added by @mdo, but exceptions can be made. New glyphs are designed in Figma first on a 16x16px grid, then exported as flattened SVGs with `fill` (no stroke). Once a new SVG icon has been added to the `icons` directory, we use an npm script to:
1. Optimize our SVGs with SVGO.
2. Modify the SVGs source code, removing all attributes before setting new attributes and values in our preferred order.
Use `npm run icons` to run the script, run `npm run pages` to build permalink pages, complete those pages, and, finally, commit the results in a new branch for updating.
**Warning**: Please exclude any auto-generated files, like `font/**` and `bootstrap-icons.svg` from your branch because they cause conflicts, and we generally update the dist files before a release.
## Publishing
Documentation is published automatically when a new Git tag is published. See our [GitHub Actions](https://github.com/twbs/icons/tree/main/.github/workflows) and [`package.json`](https://github.com/twbs/icons/blob/main/package.json) for more information.
## License
[MIT](LICENSE)
## Author
[@mdo](https://github.com/mdo)

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 1.1 MiB

View File

@@ -0,0 +1,64 @@
#!/usr/bin/env node
import fs from 'node:fs/promises'
import path from 'node:path'
import { fileURLToPath } from 'node:url'
import picocolors from 'picocolors'
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(fileURLToPath(import.meta.url))
const iconsDir = path.join(__dirname, '../icons/')
const pagesDir = path.join(__dirname, '../docs/content/icons/')
const VERBOSE = process.argv.includes('--verbose')
function capitalizeFirstLetter(string) {
return (string.charAt(0).toUpperCase() + string.slice(1)).split('-').join(' ')
}
async function main(file) {
const iconBasename = path.basename(file, path.extname(file))
const iconTitle = capitalizeFirstLetter(iconBasename)
const pageName = path.join(pagesDir, `${iconBasename}.md`)
const pageTemplate = `---
title: ${iconTitle}
categories:
tags:
---
`
try {
await fs.access(pageName, fs.F_OK)
if (VERBOSE) {
console.log(`${picocolors.cyan(iconBasename)}: Page already exists; skipping`)
}
} catch {
await fs.writeFile(pageName, pageTemplate)
console.log(picocolors.green(`${iconBasename}: Page created`))
}
}
(async () => {
try {
const basename = path.basename(__filename)
const timeLabel = picocolors.cyan(`[${basename}] finished`)
console.log(picocolors.cyan(`[${basename}] started`))
console.time(timeLabel)
const files = await fs.readdir(iconsDir)
await Promise.all(files.map(file => main(file)))
const filesLength = files.length
console.log(picocolors.green('\nSuccess, %s page%s prepared!'), filesLength, filesLength === 1 ? '' : 's')
console.timeEnd(timeLabel)
} catch (error) {
console.error(error)
process.exit(1)
}
})()

View File

@@ -0,0 +1,57 @@
#!/usr/bin/env node
import fs from 'node:fs/promises'
import path from 'node:path'
import process from 'node:process'
import { fileURLToPath } from 'node:url'
import picocolors from 'picocolors'
import { loadConfig, optimize } from 'svgo'
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(fileURLToPath(import.meta.url))
const iconsDir = path.join(__dirname, '../icons/')
const VERBOSE = process.argv.includes('--verbose')
async function processFile(file, config) {
const filepath = path.join(iconsDir, file)
const basename = path.basename(file, '.svg')
const originalSvg = await fs.readFile(filepath, 'utf8')
const { data: optimizedSvg } = await optimize(originalSvg, { path: filepath, ...config })
// svgo will always add a final newline when in pretty mode
const resultSvg = optimizedSvg.trim()
if (resultSvg !== originalSvg) {
await fs.writeFile(filepath, resultSvg, 'utf8')
}
if (VERBOSE) {
console.log(`- ${basename}`)
}
}
(async () => {
try {
const basename = path.basename(__filename)
const timeLabel = picocolors.cyan(`[${basename}] finished`)
console.log(picocolors.cyan(`[${basename}] started`))
console.time(timeLabel)
const files = await fs.readdir(iconsDir)
const config = await loadConfig(path.join(__dirname, '../svgo.config.mjs'))
await Promise.all(files.map(file => processFile(file, config)))
const filesLength = files.length
console.log(picocolors.green('\nSuccess, prepared %s icon%s!'), filesLength, filesLength === 1 ? '' : 's')
console.timeEnd(timeLabel)
} catch (error) {
console.error(error)
process.exit(1)
}
})()

View File

@@ -0,0 +1,100 @@
#!/usr/bin/env node
/*!
* Script to update version number references in the project.
* Copyright 2024 The Bootstrap Authors
* Licensed under MIT (https://github.com/twbs/icons/blob/main/LICENSE)
*/
import { execFile } from 'node:child_process'
import fs from 'node:fs/promises'
const VERBOSE = process.argv.includes('--verbose')
const DRY_RUN = process.argv.includes('--dry') || process.argv.includes('--dry-run')
// These are the files we only care about replacing the version
const FILES = [
'build/font/css.hbs',
'build/font/scss.hbs',
'hugo.yml'
]
// Blame TC39... https://github.com/benjamingr/RegExp.escape/issues/37
function regExpQuote(string) {
return string.replace(/[$()*+-.?[\\\]^{|}]/g, '\\$&')
}
function regExpQuoteReplacement(string) {
return string.replace(/\$/g, '$$')
}
async function replaceRecursively(file, oldVersion, newVersion) {
const originalString = await fs.readFile(file, 'utf8')
const newString = originalString.replace(
new RegExp(regExpQuote(oldVersion), 'g'),
regExpQuoteReplacement(newVersion)
)
// No need to move any further if the strings are identical
if (originalString === newString) {
return
}
if (VERBOSE) {
console.log(`Found ${oldVersion} in ${file}`)
}
if (DRY_RUN) {
return
}
await fs.writeFile(file, newString, 'utf8')
}
function bumpNpmVersion(newVersion) {
if (DRY_RUN) {
return
}
execFile('npm', ['version', newVersion, '--no-git-tag'], { shell: true }, (error) => {
if (error) {
console.error(error)
process.exit(1)
}
})
}
function showUsage(args) {
console.error('USAGE: change-version old_version new_version [--verbose] [--dry[-run]]')
console.error('Got arguments:', args)
process.exit(1)
}
async function main(args) {
let [oldVersion, newVersion] = args
if (!oldVersion || !newVersion) {
showUsage(args)
}
// Strip any leading `v` from arguments because
// otherwise we will end up with duplicate `v`s
[oldVersion, newVersion] = [oldVersion, newVersion].map(arg => {
return arg.startsWith('v') ? arg.slice(1) : arg
})
if (oldVersion === newVersion) {
showUsage(args)
}
bumpNpmVersion(newVersion)
try {
await Promise.all(FILES.map(file => replaceRecursively(file, oldVersion, newVersion)))
} catch (error) {
console.error(error)
process.exit(1)
}
}
main(process.argv.slice(2))

View File

@@ -0,0 +1,61 @@
#!/usr/bin/env node
import fs from 'node:fs/promises'
import path from 'node:path'
import process from 'node:process'
import { fileURLToPath } from 'node:url'
import picocolors from 'picocolors'
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(fileURLToPath(import.meta.url))
const fontJsonPath = path.join(__dirname, '../font/bootstrap-icons.json')
const iconsDir = path.join(__dirname, '../icons/')
;(async () => {
try {
const basename = path.basename(__filename)
const timeLabel = picocolors.cyan(`[${basename}] finished`)
console.log(picocolors.cyan(`[${basename}] started`))
console.time(timeLabel)
const fontJsonString = await fs.readFile(fontJsonPath, 'utf8')
const fontJson = JSON.parse(fontJsonString)
const svgFiles = await fs.readdir(iconsDir)
const jsonIconList = Object.keys(fontJson)
const svgIconList = svgFiles.map(svg => path.basename(svg, '.svg'))
const onlyInJson = jsonIconList.filter(icon => !svgIconList.includes(icon))
const onlyInSvg = svgIconList.filter(icon => !jsonIconList.includes(icon))
if (onlyInJson.length === 0 || onlyInSvg === 0) {
console.log(picocolors.green('Success, found no differences!'))
console.timeEnd(timeLabel)
return
}
if (onlyInJson.length > 0) {
console.error(picocolors.red(`Found additional icons in ${fontJsonPath}:`))
for (const icon of onlyInJson) {
console.log(` - ${picocolors.red(icon)}`)
}
}
if (onlyInSvg.length > 0) {
console.error(picocolors.red('Found additional icons in SVG files:'))
for (const icon of onlyInSvg) {
console.log(` - ${picocolors.red(icon)}`)
}
}
process.exit(1)
} catch (error) {
console.error(error)
process.exit(1)
}
})()

View File

@@ -0,0 +1,30 @@
/*!
* Bootstrap Icons v1.13.1 (https://icons.getbootstrap.com/)
* Copyright 2019-2024 The Bootstrap Authors
* Licensed under MIT (https://github.com/twbs/icons/blob/main/LICENSE)
*/
@font-face {
font-display: block;
font-family: "{{ name }}";
src: {{{ fontSrc }}};
}
.{{ prefix }}::before,
[class^="{{ prefix }}-"]::before,
[class*=" {{ prefix }}-"]::before {
display: inline-block;
font-family: {{ name }} !important;
font-style: normal;
font-weight: normal !important;
font-variant: normal;
text-transform: none;
line-height: 1;
vertical-align: -.125em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
{{# each codepoints }}
.{{ ../prefix }}-{{ @key }}::before { content: "\\{{ codepoint this }}"; }
{{/ each }}

View File

@@ -0,0 +1,43 @@
/*!
* Bootstrap Icons v1.13.1 (https://icons.getbootstrap.com/)
* Copyright 2019-2024 The Bootstrap Authors
* Licensed under MIT (https://github.com/twbs/icons/blob/main/LICENSE)
*/
${{ name }}-font: "{{ name }}" !default;
${{ name }}-font-dir: "{{ fontsUrl }}" !default;
${{ name }}-font-file: "#{${{ name }}-font-dir}/#{${{ name }}-font}" !default;
${{ name }}-font-hash: "24e3eb84d0bcaf83d77f904c78ac1f47" !default;
${{ name }}-font-src: url("#{${{ name }}-font-file}.woff2?#{${{ name }}-font-hash}") format("woff2"),
url("#{${{ name }}-font-file}.woff?#{${{ name }}-font-hash}") format("woff") !default;
@font-face {
font-display: block;
font-family: ${{ name }}-font;
src: ${{ name }}-font-src;
}
.{{ prefix }}::before,
[class^="{{ prefix }}-"]::before,
[class*=" {{ prefix }}-"]::before {
display: inline-block;
font-family: ${{ name }}-font !important;
font-style: normal;
font-weight: normal !important;
font-variant: normal;
text-transform: none;
line-height: 1;
vertical-align: -.125em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
${{ name }}-map: (
{{# each codepoints }}
"{{ @key }}": "\\{{ codepoint this }}",
{{/ each }}
);
@each $icon, $codepoint in ${{ name }}-map {
.{{ prefix }}-#{$icon}::before { content: $codepoint; }
}

View File

@@ -0,0 +1,50 @@
#!/usr/bin/env node
/*!
* Script to run vnu-jar if Java is available.
* Copyright 2017-2024 The Bootstrap Authors
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
*/
import { execFile, spawn } from 'node:child_process'
import vnu from 'vnu-jar'
execFile('java', ['-version'], (error, stdout, stderr) => {
if (error) {
console.error('Skipping vnu-jar test; Java is probably missing.')
console.error(error)
return
}
console.log('Running vnu-jar validation...')
const is32bitJava = !/64-Bit/.test(stderr)
// vnu-jar accepts multiple ignores joined with a `|`.
// Also note that the ignores are string regular expressions.
const ignores = [
].join('|')
const args = [
'-jar',
`"${vnu}"`,
'--asciiquotes',
'--skip-non-html',
'--Werror',
`--filterpattern "${ignores}"`,
'_site/'
]
// For the 32-bit Java we need to pass `-Xss512k`
if (is32bitJava) {
args.splice(0, 0, '-Xss512k')
}
console.log(`command used: java ${args.join(' ')}`)
return spawn('java', args, {
shell: true,
stdio: 'inherit'
})
.on('exit', process.exit)
})

View File

@@ -0,0 +1,21 @@
{
"name": "twbs/bootstrap-icons",
"description": "Official open source SVG icon library for Bootstrap",
"keywords": [
"bootstrap",
"icons",
"svg",
"icon font"
],
"homepage": "https://icons.getbootstrap.com/",
"authors": [
{
"name": "Mark Otto",
"email": "markdotto@gmail.com"
}
],
"support": {
"issues": "https://github.com/twbs/icons/issues"
},
"license": "MIT"
}

View File

@@ -0,0 +1,65 @@
import ClipboardJS from 'clipboard'
(function () {
const btnHtml = [
'<div class="bd-clipboard">',
'<button type="button" class="btn-clipboard" title="Copy to clipboard">',
'<i class="bi bi-clipboard" aria-hidden="true"></i>',
'</button>',
'</div>'].join('')
document.querySelectorAll('div.highlight')
.forEach(element => {
element.insertAdjacentHTML('beforebegin', btnHtml)
})
const clipboard = new ClipboardJS('.btn-clipboard', {
target(trigger) {
return trigger.parentNode.nextElementSibling
}
})
clipboard.on('success', event => {
const icon = event.trigger.querySelector('.bi')
const originalTitle = event.trigger.title
event.clearSelection()
icon.classList.replace('bi-clipboard', 'bi-check2')
event.trigger.title = 'Copied!'
setTimeout(() => {
icon.classList.replace('bi-check2', 'bi-clipboard')
event.trigger.title = originalTitle
}, 2000)
})
clipboard.on('error', () => {
const modifierKey = /mac/i.test(navigator.userAgent) ? '\u2318' : 'Ctrl-'
const fallbackMsg = `Press ${modifierKey}C to copy`
const errorElement = document.getElementById('copy-error-callout')
if (!errorElement) {
return
}
errorElement.classList.remove('d-none')
errorElement.insertAdjacentHTML('afterbegin', fallbackMsg)
})
const searchInput = document.getElementById('search')
if (searchInput) {
searchInput.addEventListener('keydown', event => {
if (event.key === 'Enter') {
event.preventDefault()
}
})
}
// Disable empty links in docs
document.querySelectorAll('[href="#"]')
.forEach(link => {
link.addEventListener('click', event => {
event.preventDefault()
})
})
})()

View File

@@ -0,0 +1,79 @@
/*!
* Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2023 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
*/
(() => {
const getStoredTheme = () => localStorage.getItem('theme')
const setStoredTheme = theme => localStorage.setItem('theme', theme)
const getPreferredTheme = () => {
const storedTheme = getStoredTheme()
if (storedTheme) {
return storedTheme
}
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
}
const setTheme = theme => {
if (theme === 'auto') {
document.documentElement.setAttribute('data-bs-theme', (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'))
} else {
document.documentElement.setAttribute('data-bs-theme', theme)
}
}
setTheme(getPreferredTheme())
const showActiveTheme = (theme, focus = false) => {
const themeSwitcher = document.querySelector('#bd-theme')
if (!themeSwitcher) {
return
}
const themeSwitcherText = document.querySelector('#bd-theme-text')
const activeThemeIcon = document.querySelector('.theme-icon-active use')
const btnToActive = document.querySelector(`[data-bs-theme-value="${theme}"]`)
const svgOfActiveBtn = btnToActive.querySelector('svg use').getAttribute('href')
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
element.classList.remove('active')
element.setAttribute('aria-pressed', 'false')
})
btnToActive.classList.add('active')
btnToActive.setAttribute('aria-pressed', 'true')
activeThemeIcon.setAttribute('href', svgOfActiveBtn)
const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`
themeSwitcher.setAttribute('aria-label', themeSwitcherLabel)
if (focus) {
themeSwitcher.focus()
}
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
const storedTheme = getStoredTheme()
if (storedTheme !== 'light' && storedTheme !== 'dark') {
setTheme(getPreferredTheme())
}
})
window.addEventListener('DOMContentLoaded', () => {
showActiveTheme(getPreferredTheme())
document.querySelectorAll('[data-bs-theme-value]')
.forEach(toggle => {
toggle.addEventListener('click', () => {
const theme = toggle.getAttribute('data-bs-theme-value')
localStorage.setItem('theme', theme)
setStoredTheme(theme)
setTheme(theme)
showActiveTheme(theme, true)
})
})
})
})()

View File

@@ -0,0 +1,63 @@
import Fuse from 'fuse.js'
(function () {
const iconsBody = document.querySelector('#icons-body')
if (!iconsBody) return
const searchInput = iconsBody.querySelector('#search')
const iconListContainer = iconsBody.querySelector('#icons-list')
const iconElementList = Array.from(iconListContainer.children)
const iconDataList = iconElementList.map(element => ({
name: element.dataset.name || '',
categories: element.dataset.categories ? element.dataset.categories.split(' ') : [],
tags: element.dataset.tags ? element.dataset.tags.split(' ') : []
}))
const fuse = new Fuse(iconDataList, {
ignoreLocation: true,
useExtendedSearch: true,
shouldSort: false,
keys: ['name', 'categories', 'tags'],
threshold: 0
})
function search(searchTerm) {
const trimmedSearchTerm = searchTerm ? searchTerm.trim() : ''
iconListContainer.innerHTML = ''
if (trimmedSearchTerm.length > 0) {
const searchResult = fuse.search(trimmedSearchTerm)
const resultElements = searchResult.map(result => iconElementList[result.refIndex])
iconListContainer.append(...resultElements)
} else {
iconListContainer.append(...iconElementList)
}
const newUrl = new URL(window.location)
if (trimmedSearchTerm.length > 0) {
newUrl.searchParams.set('q', trimmedSearchTerm)
} else {
newUrl.searchParams.delete('q')
}
window.history.replaceState(null, null, newUrl)
}
let timeout
searchInput.addEventListener('input', () => {
clearTimeout(timeout)
timeout = setTimeout(() => {
search(searchInput.value)
}, 250)
})
const query = new URLSearchParams(window.location.search).get('q')
if (!query || query.length === 0) return
const trimmedQuery = query.trim()
search(trimmedQuery)
searchInput.value = trimmedQuery
document.querySelector('#content').scrollIntoView()
})()

View File

@@ -0,0 +1,54 @@
// stylelint-disable-next-line selector-max-id
#carbonads {
max-width: 28rem;
padding: .75rem;
margin-right: auto;
margin-left: auto;
overflow: auto;
background-color: var(--bs-tertiary-bg);
border-radius: .25rem;
@media (min-width: 992px) {
margin-right: 0;
margin-left: 0;
}
}
.carbon-img {
float: left;
margin-right: .75rem;
@media (min-width: 768px) {
margin-bottom: .5rem;
}
@media (min-width: 992px) {
margin-bottom: 0;
}
}
.carbon-text,
.carbon-poweredby {
display: block;
color: var(--bs-body-color);
&:hover,
&:focus {
color: var(--bs-body-color);
text-decoration: none;
}
}
.carbon-text {
margin-bottom: .5rem;
text-decoration: none;
@media (min-width: 768px) {
font-size: .875rem;
}
}
.carbon-poweredby {
margin-top: .75rem;
font-size: .875rem;
}

View File

@@ -0,0 +1,45 @@
// Buttons
//
// Custom buttons for the docs.
// scss-docs-start btn-css-vars-example
.btn-bd-primary {
--bs-btn-font-weight: 600;
--bs-btn-color: var(--bs-white);
--bs-btn-bg: var(--bd-violet);
--bs-btn-border-color: var(--bd-violet);
--bs-btn-border-radius: .5rem;
--bs-btn-hover-color: var(--bs-white);
--bs-btn-hover-bg: #{shade-color($bd-violet, 10%)};
--bs-btn-hover-border-color: #{shade-color($bd-violet, 10%)};
--bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
--bs-btn-active-color: var(--bs-btn-hover-color);
--bs-btn-active-bg: #{shade-color($bd-violet, 20%)};
--bs-btn-active-border-color: #{shade-color($bd-violet, 20%)};
}
// scss-docs-end btn-css-vars-example
.btn-bd-accent {
--bs-btn-font-weight: 600;
--bs-btn-color: var(--bd-accent);
--bs-btn-border-color: var(--bd-accent);
--bs-btn-hover-color: var(--bd-dark);
--bs-btn-hover-bg: var(--bd-accent);
--bs-btn-hover-border-color: var(--bd-accent);
--bs-btn-focus-shadow-rgb: var(--bd-accent-rgb);
--bs-btn-active-color: var(--bs-btn-hover-color);
--bs-btn-active-bg: var(--bs-btn-hover-bg);
--bs-btn-active-border-color: var(--bs-btn-hover-border-color);
}
.btn-bd-light {
--bs-btn-color: var(--bs-gray-600);
--bs-btn-border-color: var(--bs-gray-400);
--bs-btn-hover-color: var(--bd-violet);
--bs-btn-hover-border-color: var(--bd-violet);
--bs-btn-active-color: var(--bd-violet);
--bs-btn-active-bg: var(--bs-white);
--bs-btn-active-border-color: var(--bd-violet);
--bs-btn-focus-border-color: var(--bd-violet);
--bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
}

View File

@@ -0,0 +1,35 @@
// clipboard.js
//
// JS-based `Copy` buttons for code snippets.
.bd-clipboard {
position: relative;
display: none;
float: right;
+ .highlight {
margin-top: 0;
}
@media (min-width: 768px) {
display: block;
}
}
.btn-clipboard {
position: absolute;
top: .75em;
right: .5em;
z-index: 10;
display: block;
padding: .5em .75em .625em;
line-height: 1;
color: var(--bs-body-color);
background-color: var(--bs-tertiary-bg);
border: 0;
border-radius: .25rem;
&:hover {
color: var(--bs-link-hover-color);
}
}

View File

@@ -0,0 +1,16 @@
//
// Footer
//
.bd-footer {
a {
color: var(--bs-body-color);
text-decoration: none;
&:hover,
&:focus {
color: var(--bs-link-hover-color);
text-decoration: underline;
}
}
}

View File

@@ -0,0 +1,113 @@
.bd-navbar {
padding: .75rem 0;
background-color: transparent;
background-image: linear-gradient(to bottom, rgba(var(--bd-violet-rgb), 1), rgba(var(--bd-violet-rgb), .95));
box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15), inset 0 -1px 0 rgba(0, 0, 0, .15);
.bi {
width: 1em;
height: 1em;
}
.navbar-toggler {
padding: 0;
margin-right: -.5rem;
border: 0;
&:first-child {
margin-left: -.5rem;
}
.bi {
width: 1.5rem;
height: 1.5rem;
}
&:focus {
box-shadow: none;
}
}
.navbar-brand {
transition: .2s ease-in-out transform;
&:hover {
transform: rotate(-5deg) scale(1.1);
}
}
.navbar-toggler,
.nav-link {
padding-right: $spacer * .25;
padding-left: $spacer * .25;
color: rgba($white, .85);
&:hover,
&:focus {
color: $white;
}
&.active {
font-weight: 600;
color: $white;
}
}
.navbar-nav-svg {
display: inline-block;
vertical-align: -.125rem;
}
.offcanvas-lg {
background-color: var(--bd-violet);
border-left: 0;
@media (max-width: 992px) {
box-shadow: $box-shadow-lg;
}
}
.dropdown-menu {
--bs-dropdown-min-width: 12rem;
--bs-dropdown-padding-x: .25rem;
--bs-dropdown-padding-y: .25rem;
--bs-dropdown-link-hover-bg: rgba(var(--bd-violet-rgb), .1);
--bs-dropdown-link-active-bg: rgba(var(--bd-violet-rgb), 1);
@include rfs(.875rem, --bs-dropdown-font-size);
@include font-size(.875rem);
@include border-radius(.5rem);
box-shadow: $dropdown-box-shadow;
li + li {
margin-top: .125rem;
}
.dropdown-item {
@include border-radius(.25rem);
&:active {
.bi {
color: inherit !important; // stylelint-disable-line declaration-no-important
}
}
}
.active {
font-weight: 600;
.bi {
display: block !important; // stylelint-disable-line declaration-no-important
}
}
}
.dropdown-menu-end {
--bs-dropdown-min-width: 8rem;
}
}
@include color-mode(dark) {
.bd-navbar {
box-shadow: 0 .5rem 1rem rgba($black, .15), inset 0 -1px 0 rgba($white, .15);
}
}

View File

@@ -0,0 +1,17 @@
.skippy {
display: block;
padding: 1em;
color: #fff;
text-align: center;
background-color: $bd-purple;
outline: 0;
&:hover {
color: #fff;
}
}
.skippy-text {
padding: .5em;
outline: 1px dotted;
}

View File

@@ -0,0 +1,135 @@
:root,
[data-bs-theme="light"] {
--base00: #fff;
--base01: #f5f5f5;
--base02: #c8c8fa;
--base03: #565c64;
--base04: #030303;
--base05: #333;
--base06: #fff;
--base07: #9a6700;
--base08: #bc4c00;
--base09: #087990;
--base0A: #795da3;
--base0B: #183691;
--base0C: #183691;
--base0D: #795da3;
--base0E: #a71d5d;
--base0F: #333;
}
@include color-mode(dark, true) {
--base00: #282c34;
--base01: #353b45;
--base02: #3e4451;
--base03: #868e96;
--base04: #565c64;
--base05: #abb2bf;
--base06: #b6bdca;
--base07: #d19a66;
--base08: #e06c75;
--base09: #d19a66;
--base0A: #e5c07b;
--base0B: #98c379;
--base0C: #56b6c2;
--base0D: #61afef;
--base0E: #c678dd;
--base0F: #be5046;
}
.hl { background-color: var(--base02); }
.c { color: var(--base03); }
.err { color: var(--base08); }
.k { color: var(--base0E); }
.l { color: var(----base09); }
.n { color: var(--base08); }
.o { color: var(--base05); }
.p { color: var(--base05); }
.cm { color: var(--base04); }
.cp { color: var(--base08); }
.c1 { color: var(--base03); }
.cs { color: var(--base04); }
.gd { color: var(--base08); }
.ge { font-style: italic; }
.gh {
font-weight: 600;
color: #fff;
}
.gi { color: var(--bs-success); }
.gp {
font-weight: 600;
color: var(--base04);
}
.gs { font-weight: 600; }
.gu {
font-weight: 600;
color: var(--base0C);
}
.kc { color: var(--base0E); }
.kd { color: var(--base0E); }
.kn { color: var(--base0C); }
.kp { color: var(--base0E); }
.kr { color: var(--base0E); }
.kt { color: var(--base0A); }
.ld { color: var(--base0C); }
.m { color: var(--base09); }
.s { color: var(--base0C); }
.na { color: var(--base0A); }
.nb { color: var(--base05); }
.nc { color: var(--base07); }
.no { color: var(--base08); }
.nd { color: var(--base07); }
.ni { color: var(--base08); }
.ne { color: var(--base08); }
.nf { color: var(--base0B); }
.nl { color: var(--base05); }
.nn { color: var(--base0A); }
.nx { color: var(--base0A); }
.py { color: var(--base08); }
.nt { color: var(--base08); }
.nv { color: var(--base08); }
.ow { color: var(--base0C); }
.w { color: #fff; }
.mf { color: var(--base09); }
.mh { color: var(--base09); }
.mi { color: var(--base09); }
.mo { color: var(--base09); }
.sb { color: var(--base0C); }
.sc { color: #fff; }
.sd { color: var(--base04); }
.s2 { color: var(--base0C); }
.se { color: var(--base09); }
.sh { color: var(--base0C); }
.si { color: var(--base09); }
.sx { color: var(--base0C); }
.sr { color: var(--base0C); }
.s1 { color: var(--base0C); }
.ss { color: var(--base0C); }
.bp { color: var(--base05); }
.vc { color: var(--base08); }
.vg { color: var(--base08); }
.vi { color: var(--base08); }
.il { color: var(--base09); }
// Color commas in rgba() values
.m + .o { color: var(--base03); }
// Fix bash
.language-sh .c { color: var(--base03); }
.chroma {
.language-bash,
.language-sh {
.line::before {
color: var(--base03);
content: "$ ";
user-select: none;
}
}
.language-powershell::before {
color: var(--base0C);
content: "PM> ";
user-select: none;
}
}

View File

@@ -0,0 +1,15 @@
// Local docs variables
$bd-purple: #4c0bce;
$bd-violet: lighten(saturate($bd-purple, 5%), 15%);
$bd-accent: #ffe484;
$bd-gutter-x: 3rem;
:root {
--bd-purple: #{$bd-purple};
--bd-violet: #{$bd-violet};
--bd-accent: #{$bd-accent};
--bd-violet-rgb: #{to-rgb($bd-violet)};
--bd-accent-rgb: #{to-rgb($bd-accent)};
--bd-pink-rgb: #{to-rgb($pink-500)};
--bd-teal-rgb: #{to-rgb($teal-500)};
}

View File

@@ -0,0 +1,237 @@
@import "bootstrap/functions";
@import "bootstrap/variables";
@import "bootstrap/variables-dark";
@import "bootstrap/maps";
@import "bootstrap/mixins";
@import "bootstrap/utilities";
@import "bootstrap/root";
@import "bootstrap/reboot";
@import "bootstrap/type";
@import "bootstrap/images";
@import "bootstrap/containers";
@import "bootstrap/grid";
@import "bootstrap/tables";
@import "bootstrap/forms";
@import "bootstrap/buttons";
@import "bootstrap/transitions";
@import "bootstrap/dropdown";
@import "bootstrap/button-group";
@import "bootstrap/nav";
@import "bootstrap/navbar";
// @import "bootstrap/card";
// @import "bootstrap/accordion";
@import "bootstrap/breadcrumb";
// @import "bootstrap/pagination";
// @import "bootstrap/badge";
// @import "bootstrap/alert";
// @import "bootstrap/progress";
// @import "bootstrap/list-group";
@import "bootstrap/close";
// @import "bootstrap/toasts";
// @import "bootstrap/modal";
// @import "bootstrap/tooltip";
// @import "bootstrap/popover";
// @import "bootstrap/carousel";
// @import "bootstrap/spinners";
@import "bootstrap/offcanvas";
// @import "bootstrap/placeholders";
@import "bootstrap/helpers";
@import "bootstrap/utilities/api";
@import "variables";
@import "buttons";
@import "clipboard-js";
@import "navbar";
@import "skippy";
@import "footer";
@import "syntax";
@import "ads";
:root {
color-scheme: light dark;
}
.bd-gutter {
--bs-gutter-x: #{$bd-gutter-x};
}
.bi {
display: inline-block;
vertical-align: -.125em;
fill: currentcolor;
}
.hero-notice {
color: var(--bs-info-text);
background-color: var(--bs-info-bg-subtle);
border: 1px solid var(--bs-info-border-subtle);
@media (min-width: 540px) {
border-radius: 5em !important; // stylelint-disable-line declaration-no-important
}
}
.btn-figma {
--bs-btn-color: var(--bs-emphasis-color);
--bs-btn-border-color: var(--bs-emphasis-color);
--bs-btn-hover-color: var(--bs-body-bg);
--bs-btn-hover-bg: var(--bs-emphasis-color);
--bs-btn-hover-border-color: var(--bs-btn-hover-bg);
}
.highlight {
position: relative;
padding: 1.25rem;
margin-bottom: 1rem;
background-color: var(--bs-tertiary-bg);
border-radius: var(--bs-border-radius);
pre {
padding: 0;
margin-bottom: 0;
white-space: pre;
background-color: transparent;
border: 0;
}
pre code {
@include font-size(inherit);
word-wrap: normal;
}
}
.bd-example {
padding: 1.25rem;
border: 1px solid var(--bs-border-color);
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
+ .bd-clipboard + .highlight {
border: 1px solid var(--bs-border-color);
border-width: 0 1px 1px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
}
.f0 {
font-size: 2rem;
@media (min-width: 520px) {
font-size: 3rem;
}
}
.f3 {
font-size: 1.25rem;
@media (min-width: 520px) {
font-size: 1.5rem;
}
}
.f5 {
font-size: 1rem;
}
.hero {
border-bottom: 1px solid var(--bs-border-color-translucent);
.highlight {
margin-bottom: 0;
background-color: var(--bs-tertiary-bg);
border-radius: .5rem;
pre {
margin-bottom: 0;
@media (min-width: 768px) {
padding-right: 4em;
}
}
}
.btn-clipboard {
top: .5em;
background-color: var(--bs-tertiary-bg);
}
.btn {
padding: 1rem 1.25rem;
border-radius: .5rem;
}
hr {
max-width: 100px;
}
}
.icon-search {
@media (min-width: 768px) {
width: 35%;
}
}
.list {
font-size: 2rem;
// stylelint-disable declaration-no-important
a:hover,
a:focus {
&,
.name {
color: var(--bs-link-hover-color) !important;
}
}
// stylelint-enable declaration-no-important
&:empty::before {
display: block;
width: 100%;
padding: 100px 2rem;
margin-right: 15px;
margin-left: 15px;
color: var(--bs-secondary-color);
text-align: center;
content: "Nothing found, try searching again.";
background-color: var(--bs-secondary-bg);
border-radius: .5rem;
}
}
.btn-group > .btn {
flex-shrink: 0;
}
.name {
font-size: .8125rem;
}
@media (min-width: 1200px) {
.row-cols-xl-8 {
> * {
flex: 0 0 12.5%;
max-width: 12.5%;
}
}
}
.icon-demo {
background-color: var(--bs-tertiary-bg);
background-image: radial-gradient(circle, var(--bs-border-color) 1px, rgba(0, 0, 0, 0) 1px);
background-size: 1rem 1rem;
}
.icon-demo,
.icon-demo-examples {
.bi {
width: 1em;
height: 1em;
}
}
// stylelint-disable declaration-no-important
.py-6 {
padding-top: 4.5rem !important;
padding-bottom: 4.5rem !important;
}
// stylelint-enable declaration-no-important

View File

@@ -0,0 +1,13 @@
---
title: "404 - File not found"
description: ""
layout: 404
url: /404.html
robots: noindex,follow
sitemap_exclude: true
---
<div class="text-center py-5">
<h1 class="display-1">404</h1>
<h2>File not found</h2>
</div>

View File

@@ -0,0 +1,248 @@
---
aliases:
- /font/
---
## Install
Bootstrap Icons are published to npm, but they can also be manually downloaded if needed.
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### Package manager
Install [Bootstrap Icons](https://www.npmjs.com/package/bootstrap-icons)—including SVGs, icon sprite, and icon fonts—with npm or Composer. Then, choose how you'd like to include the icons with the [usage instructions](#usage).
{{< highlight sh >}}
npm i bootstrap-icons
{{< /highlight >}}
{{< highlight sh >}}
composer require twbs/bootstrap-icons
{{< /highlight >}}
{{< /md >}}
</div>
<div class="col-md-4">
{{< md >}}
### Download
[Releases are published on GitHub](https://github.com/twbs/icons/releases/) and include icon SVGs, fonts, license, and readme. Our `package.json` is also included, though our npm scripts are primarily available for our development workflows.
<a class="btn btn-outline-primary" href="https://github.com/twbs/icons/releases/latest/">Download latest ZIP</a>
{{< /md >}}
</div>
<div class="col-md-4">
{{< md >}}
### CDN
Include the icon fonts stylesheet—in your website `<head>` or via `@import` in CSS—from jsDelivr and get started in seconds. [See icon font docs](#icon-font) for examples.
{{< highlight html >}}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@{{< param version >}}/font/bootstrap-icons.min.css">
{{< /highlight >}}
{{< highlight css >}}
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@{{< param version >}}/font/bootstrap-icons.min.css");
{{< /highlight >}}
{{< /md >}}
</div>
</div>
## Usage
Bootstrap Icons are SVGs, so you can include them into your HTML in a few ways depending on how your project is setup. We recommend using a `width: 1em` (and optionally `height: 1em`) for easy resizing via `font-size`.
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### Embedded
Embed your icons within the HTML of your page (as opposed to an external image file). Here we've used a custom `width` and `height`.
{{< /md >}}
</div>
<div class="col-md-8">
{{< example >}}<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-emoji-heart-eyes" viewBox="0 0 16 16"><path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/><path d="M11.315 10.014a.5.5 0 0 1 .548.736A4.498 4.498 0 0 1 7.965 13a4.498 4.498 0 0 1-3.898-2.25.5.5 0 0 1 .548-.736h.005l.017.005.067.015.252.055c.215.046.515.108.857.169.693.124 1.522.242 2.152.242.63 0 1.46-.118 2.152-.242a26.58 26.58 0 0 0 1.109-.224l.067-.015.017-.004.005-.002zM4.756 4.566c.763-1.424 4.02-.12.952 3.434-4.496-1.596-2.35-4.298-.952-3.434zm6.488 0c1.398-.864 3.544 1.838-.952 3.434-3.067-3.554.19-4.858.952-3.434z"/></svg>{{< /example >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### Sprite
Use the SVG sprite to insert any icon through the `<use>` element. Use the icon's filename as the fragment identifier (e.g., `toggles` is `#toggles`). SVG sprites allow you to reference an external file similar to an `<img>` element, but with the power of `currentColor` for easy theming.
**Heads up!** There's an issue with Chrome where [`<use>` doesn't work across domains](https://bugs.chromium.org/p/chromium/issues/detail?id=470601).
{{< /md >}}
</div>
<div class="col-md-8">
<div class="bd-example" style="font-size: 32px;">
<i class="bi bi-heart-fill"></i>
<i class="bi bi-toggles"></i>
<i class="bi bi-shop"></i>
</div>
{{< highlight html >}}
<svg class="bi" width="32" height="32" fill="currentColor">
<use xlink:href="bootstrap-icons.svg#heart-fill"/>
</svg>
<svg class="bi" width="32" height="32" fill="currentColor">
<use xlink:href="bootstrap-icons.svg#toggles"/>
</svg>
<svg class="bi" width="32" height="32" fill="currentColor">
<use xlink:href="bootstrap-icons.svg#shop"/>
</svg>
{{< /highlight >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### External image
Copy the Bootstrap Icons SVGs to your directory of choice and reference them like normal images with the `<img>` element.
{{< /md >}}
</div>
<div class="col-md-8">
{{< example >}}<img src="/assets/icons/bootstrap.svg" alt="Bootstrap" width="32" height="32">{{< /example >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### Icon font
Icon fonts with classes for every icon are also included for Bootstrap Icons. Include the icon web fonts in your page via CSS, then reference the class names as needed in your HTML (e.g., `<i class="bi bi-alarm"></i>`).
Use `font-size` and `color` to change the icon appearance.
{{< /md >}}
</div>
<div class="col-md-8">
{{< example >}}<i class="bi bi-alarm"></i>{{< /example >}}
{{< example >}}<i class="bi bi-alarm" style="font-size: 2rem; color: cornflowerblue;"></i>{{< /example >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### Sass
When using Bootstrap in a Sass project, you may need to adjust the `$bootstrap-icons-font-dir` variable to point to where your files are installed (most commonly `node_modules`, assuming you're using npm).
**Heads up!** This is currently required [for Vite](https://github.com/vitejs/vite/issues/11012) and [Parcel](https://github.com/parcel-bundler/parcel/issues/6285) as their Sass compilers arent happy with relative URLs.
{{< /md >}}
</div>
<div class="col-md-8">
{{< highlight scss >}}
// Update the import directory to point to its location within node_modules
$bootstrap-icons-font-dir: "bootstrap-icons/font/fonts";
// Import the Sass files as usual
@import "bootstrap-icons/font/bootstrap-icons";
{{< /highlight >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
### CSS
You can also use the SVG within your CSS (**be sure to escape any characters**, such as `#` to `%23` when specifying hex color values). When no dimensions are specified via `width` and `height` on the `<svg>`, the icon will fill the available space.
The `viewBox` attribute is required if you wish to resize icons with `background-size`. Note that the `xmlns` attribute is required.
{{< /md >}}
</div>
<div class="col-md-8">
{{< highlight css >}}
.bi::before {
display: inline-block;
content: "";
vertical-align: -.125em;
background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z' clip-rule='evenodd'/></svg>");
background-repeat: no-repeat;
background-size: 1rem 1rem;
}
{{< /highlight >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
## Styling
Color can be changed by setting a `.text-*` class or custom CSS:
{{< /md >}}
</div>
<div class="col-md-8">
<div class="bd-example">
<svg class="bi bi-exclamation-triangle text-success" width="32" height="32" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<path d="M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.146.146 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.163.163 0 0 1-.054.06.116.116 0 0 1-.066.017H1.146a.115.115 0 0 1-.066-.017.163.163 0 0 1-.054-.06.176.176 0 0 1 .002-.183L7.884 2.073a.147.147 0 0 1 .054-.057zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z"/>
<path d="M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995z"/>
</svg>
</div>
{{< highlight html >}}
<svg class="bi bi-exclamation-triangle text-success" width="32" height="32" fill="currentColor" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
...
</svg>
{{< /highlight >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
## Accessibility
For purely decorative icons, add `aria-hidden="true"`. Otherwise, provide an appropriate text alternative. Depending on which method you're using to add the icons, and where you're using them (e.g. as standalone images, or as the only content of a button or similar control), there are various possible approaches. Here are a few examples:
{{< /md >}}
</div>
<div class="col-md-8">
<div class="bd-example">
<img src="/assets/icons/bootstrap.svg" alt="Bootstrap" width="32" height="32">
</div>
{{< highlight html >}}
<!-- alt="..." on <img> element -->
<img src="/assets/icons/bootstrap.svg" alt="Bootstrap" ...>
{{< /highlight >}}
<div class="bd-example">
<i class="bi-github" role="img" style="font-size: 2em" aria-label="GitHub"></i>
<i class="bi-tools" role="img" style="font-size: 2em" aria-label="Tools"></i>
</div>
{{< highlight html >}}
<svg class="bi" ... role="img" aria-label="Tools">
<use xlink:href="bootstrap-icons.svg#tools"/>
</svg>
{{< /highlight >}}
<div class="bd-example">
<button type="button" class="btn btn-primary" aria-label="Mute">
<svg class="bi bi-volume-mute-fill" width="32" height="32" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M6.717 3.55A.5.5 0 017 4v8a.5.5 0 01-.812.39L3.825 10.5H1.5A.5.5 0 011 10V6a.5.5 0 01.5-.5h2.325l2.363-1.89a.5.5 0 01.529-.06zm7.137 2.096a.5.5 0 010 .708L12.207 8l1.647 1.646a.5.5 0 01-.708.708L11.5 8.707l-1.646 1.647a.5.5 0 01-.708-.708L10.793 8 9.146 6.354a.5.5 0 11.708-.708L11.5 7.293l1.646-1.647a.5.5 0 01.708 0z"></path></svg>
</button>
</div>
{{< highlight html >}}
<!-- aria-label="..." on the control -->
<button ... aria-label="Mute">
<svg class="bi bi-volume-mute-fill" aria-hidden="true" ...>
...
</svg>
</button>
{{< /highlight >}}
</div>
</div>
<div class="row my-4">
<div class="col-md-4">
{{< md >}}
## Working with SVGs
SVGs are awesome to work with, but they do have some known quirks to work around. Given the numerous ways in which SVGs can be used, we haven't included these attributes and workarounds in our code.
{{< /md >}}
</div>
<div class="col-md-8">
{{< md >}}
Known issues include:
- **SVGs receive focus by default in Internet Explorer and Edge Legacy.** When embedding your SVGs, add `focusable="false"` to the `<svg>` element. [Learn more on Stack Overflow.](https://stackoverflow.com/questions/18646111/disable-onfocus-event-for-svg-element)
- **When using SVGs with `<img>` elements, screen readers may not announce them as images, or skip the image completely.** Include an additional `role="img"` on the `<img>` element to avoid any issues. [See this article for details.](https://web.archive.org/web/20201112013541/https://simplyaccessible.com/article/7-solutions-svgs/#acc-heading-2)
- **External SVG sprites may not function correctly in Internet Explorer.** Use the [svg4everybody](https://github.com/jonathantneal/svg4everybody) polyfill as needed.
Found another issue with SVGs we should note? Please open [an issue]({{< param repo >}}/issues) to share details.
{{< /md >}}
</div>
</div>

View File

@@ -0,0 +1,9 @@
---
title: 0 circle fill
categories:
- Shapes
tags:
- number
- numeral
added: 1.10.0
---

View File

@@ -0,0 +1,9 @@
---
title: 0 circle
categories:
- Shapes
tags:
- number
- numeral
added: 1.10.0
---

View File

@@ -0,0 +1,9 @@
---
title: 0 square fill
categories:
- Shapes
tags:
- number
- numeral
added: 1.10.0
---

View File

@@ -0,0 +1,9 @@
---
title: 0 square
categories:
- Shapes
tags:
- number
- numeral
added: 1.10.0
---

View File

@@ -0,0 +1,8 @@
---
title: 1 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 1 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 1 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 1 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,7 @@
---
title: 123
categories:
- Typography
tags:
- numbers
---

View File

@@ -0,0 +1,8 @@
---
title: 2 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 2 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 2 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 2 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 3 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 3 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 3 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 3 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 4 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 4 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 4 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 4 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 5 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 5 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 5 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 5 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 6 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 6 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 6 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 6 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 7 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 7 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 7 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 7 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 8 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 8 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 8 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 8 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 9 circle fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 9 circle
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 9 square fill
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,8 @@
---
title: 9 square
categories:
- Shapes
tags:
- number
- numeral
---

View File

@@ -0,0 +1,9 @@
---
title: Activity
categories:
- Data
tags:
- pulse
- heartbeat
- rhythm
---

View File

@@ -0,0 +1,13 @@
---
title: Airplane engines fill
categories:
- Transportation
tags:
- flight
- flying
- plane
- air
- airport
- aircraft
- aeroplane
---

View File

@@ -0,0 +1,13 @@
---
title: Airplane engines
categories:
- Transportation
tags:
- flight
- flying
- plane
- air
- airport
- aircraft
- aeroplane
---

View File

@@ -0,0 +1,13 @@
---
title: Airplane fill
categories:
- Transportation
tags:
- flight
- flying
- plane
- air
- airport
- aircraft
- aeroplane
---

View File

@@ -0,0 +1,13 @@
---
title: Airplane
categories:
- Transportation
tags:
- flight
- flying
- plane
- air
- airport
- aircraft
- aeroplane
---

View File

@@ -0,0 +1,9 @@
---
title: Alarm Fill
categories:
- Devices
tags:
- alarm
- clock
- time
---

View File

@@ -0,0 +1,9 @@
---
title: Alarm
categories:
- Devices
tags:
- alarm
- clock
- time
---

View File

@@ -0,0 +1,8 @@
---
title: Alexa
categories:
- Brand
tags:
- social
- assistant
---

View File

@@ -0,0 +1,9 @@
---
title: Align bottom
categories:
- Graphics
tags:
- space
- align
- distribute
---

View File

@@ -0,0 +1,10 @@
---
title: Align center
categories:
- Graphics
tags:
- space
- align
- distribute
- centre
---

View File

@@ -0,0 +1,9 @@
---
title: Align end
categories:
- Graphics
tags:
- space
- align
- distribute
---

View File

@@ -0,0 +1,9 @@
---
title: Align middle
categories:
- Graphics
tags:
- space
- align
- distribute
---

Some files were not shown because too many files have changed in this diff Show More