Compare commits

..

13 commits

Author SHA1 Message Date
Patrick H. Lauke
80f5812a97 Revert separate/unrelated change to CTA links
moved to separate PR
2021-01-13 23:46:46 +00:00
Patrick H. Lauke
7e1855d23d
Merge branch 'main' into patrickhlauke-carousel 2021-01-13 23:20:05 +00:00
Patrick H. Lauke
a2447ba7c9
Merge branch 'main' into patrickhlauke-carousel 2021-01-10 14:40:17 +00:00
Patrick H. Lauke
1493ac0bf1 Merge branch 'patrickhlauke-carousel' of https://github.com/twbs/bootstrap into patrickhlauke-carousel 2021-01-07 10:23:30 +00:00
Patrick H. Lauke
c72d23b8b7 Clarify that controls can be button or link
also adds code ticks to `id`
2021-01-07 10:22:28 +00:00
Patrick H. Lauke
eda76bb0a0
Merge branch 'main' into patrickhlauke-carousel 2021-01-07 10:13:16 +00:00
Patrick H. Lauke
13eb932bc4 Edit carousel examples
- use buttons instead of links for prev/next
- remove `role="button"` from links that are actually links
2021-01-07 09:54:07 +00:00
Patrick H. Lauke
7b718ca159
Merge branch 'main' into patrickhlauke-carousel 2021-01-05 20:48:45 +00:00
Patrick H. Lauke
d753f4a279 Use buttons for newly-merged extra carousel 2020-12-29 16:27:06 +00:00
Patrick H. Lauke
50ac915bf2
Merge branch 'main' into patrickhlauke-carousel 2020-12-29 16:03:14 +00:00
Patrick H. Lauke
b749662c7c
Merge branch 'main' into patrickhlauke-carousel 2020-12-29 13:40:22 +00:00
Patrick H. Lauke
9116ff272b
Merge branch 'main' into patrickhlauke-carousel 2020-12-28 17:58:08 +00:00
Patrick H. Lauke
f328d01d3a Carousel: use buttons, not links, for prev/next
- expand the styles to neutralise border/background
- change docs page
- add extra unit test to check that links or buttons work as controls
- modify visual test to use buttons as well
2020-12-27 19:58:46 +00:00
15 changed files with 342 additions and 239 deletions

View file

@ -5,7 +5,7 @@ on:
env: env:
FORCE_COLOR: 2 FORCE_COLOR: 2
NODE: 14 NODE: 14.x
jobs: jobs:
browserstack: browserstack:

View file

@ -8,7 +8,7 @@ on:
env: env:
FORCE_COLOR: 2 FORCE_COLOR: 2
NODE: 14 NODE: 14.x
jobs: jobs:
bundlewatch: bundlewatch:

View file

@ -8,7 +8,7 @@ on:
env: env:
FORCE_COLOR: 2 FORCE_COLOR: 2
NODE: 14 NODE: 14.x
jobs: jobs:
css: css:

View file

@ -8,7 +8,7 @@ on:
env: env:
FORCE_COLOR: 2 FORCE_COLOR: 2
NODE: 14 NODE: 14.x
jobs: jobs:
docs: docs:

View file

@ -8,7 +8,7 @@ on:
env: env:
FORCE_COLOR: 2 FORCE_COLOR: 2
NODE: 14 NODE: 14.x
jobs: jobs:
lint: lint:

View file

@ -8,7 +8,7 @@ on:
env: env:
FORCE_COLOR: 2 FORCE_COLOR: 2
NODE: 14 NODE: 14.x
jobs: jobs:
css: css:

View file

@ -44,8 +44,8 @@ if (!sh.test('-d', rootDocsDir)) {
// switch to the root dir // switch to the root dir
sh.cd(path.join(__dirname, '..')) sh.cd(path.join(__dirname, '..'))
// remove any previously created folder/zip with the same name // remove any previously created folder with the same name
sh.rm('-rf', [distFolder, `${distFolder}.zip`]) sh.rm('-rf', distFolder)
// create any folders so that `cp` works // create any folders so that `cp` works
sh.mkdir('-p', [ sh.mkdir('-p', [

View file

@ -1154,7 +1154,7 @@ describe('Carousel', () => {
expect(Carousel.getInstance(carouselEl)).toBeDefined() expect(Carousel.getInstance(carouselEl)).toBeDefined()
}) })
it('should create carousel and go to the next slide on click', done => { it('should create carousel and go to the next slide on click (with real button controls)', done => {
fixtureEl.innerHTML = [ fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">', '<div id="myCarousel" class="carousel slide">',
' <div class="carousel-inner">', ' <div class="carousel-inner">',
@ -1162,8 +1162,32 @@ describe('Carousel', () => {
' <div id="item2" class="carousel-item">item 2</div>', ' <div id="item2" class="carousel-item">item 2</div>',
' <div class="carousel-item">item 3</div>', ' <div class="carousel-item">item 3</div>',
' </div>', ' </div>',
' <div class="carousel-control-prev" data-bs-target="#myCarousel" role="button" data-bs-slide="prev"></div>', ' <button class="carousel-control-prev" data-bs-target="#myCarousel" type="button" data-bs-slide="prev"></button>',
' <div id="next" class="carousel-control-next" data-bs-target="#myCarousel" role="button" data-bs-slide="next"></div>', ' <button id="next" class="carousel-control-next" data-bs-target="#myCarousel" type="button" data-bs-slide="next"></div>',
'</div>'
].join('')
const next = fixtureEl.querySelector('#next')
const item2 = fixtureEl.querySelector('#item2')
next.click()
setTimeout(() => {
expect(item2.classList.contains('active')).toEqual(true)
done()
}, 10)
})
it('should create carousel and go to the next slide on click (using links as controls)', done => {
fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">',
' <div class="carousel-inner">',
' <div class="carousel-item active">item 1</div>',
' <div id="item2" class="carousel-item">item 2</div>',
' <div class="carousel-item">item 3</div>',
' </div>',
' <a class="carousel-control-prev" href="#myCarousel" role="button" data-bs-slide="prev"></button>',
' <a id="next" class="carousel-control-next" href="#myCarousel" role="button" data-bs-slide="next"></div>',
'</div>' '</div>'
].join('') ].join('')
@ -1209,8 +1233,8 @@ describe('Carousel', () => {
' <div class="carousel-item">item 2</div>', ' <div class="carousel-item">item 2</div>',
' <div class="carousel-item">item 3</div>', ' <div class="carousel-item">item 3</div>',
' </div>', ' </div>',
' <div class="carousel-control-prev" data-bs-target="#myCarousel" role="button" data-bs-slide="prev"></div>', ' <button class="carousel-control-prev" data-bs-target="#myCarousel" type="button" data-bs-slide="prev"></button>',
' <div id="next" class="carousel-control-next" role="button" data-bs-slide="next"></div>', ' <button id="next" class="carousel-control-next" type="button" data-bs-slide="next"></button>',
'</div>' '</div>'
].join('') ].join('')
@ -1229,8 +1253,8 @@ describe('Carousel', () => {
' <div id="item2" class="carousel-item">item 2</div>', ' <div id="item2" class="carousel-item">item 2</div>',
' <div class="carousel-item">item 3</div>', ' <div class="carousel-item">item 3</div>',
' </div>', ' </div>',
' <div class="carousel-control-prev" data-bs-target="#myCarousel" role="button" data-bs-slide="prev"></div>', ' <button class="carousel-control-prev" data-bs-target="#myCarousel" type="button" data-bs-slide="prev"></div>',
' <div id="next" class="carousel-control-next" data-bs-target="#myCarousel" role="button" data-bs-slide="next"></div>', ' <button id="next" class="carousel-control-next" data-bs-target="#myCarousel" type="button" data-bs-slide="next"></div>',
'</div>' '</div>'
].join('') ].join('')

View file

@ -34,14 +34,14 @@
<img src="https://i.imgur.com/Nm7xoti.jpg" alt="Third slide"> <img src="https://i.imgur.com/Nm7xoti.jpg" alt="Third slide">
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carousel-example-generic" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" data-bs-target="#carousel-example-generic" type="button" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carousel-example-generic" role="button" data-bs-slide="next"> <button class="carousel-control-next" data-bs-target="#carousel-example-generic" type="button" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
</div> </div>

415
package-lock.json generated
View file

@ -1253,24 +1253,6 @@
"defer-to-connect": "^1.0.1" "defer-to-connect": "^1.0.1"
} }
}, },
"@types/component-emitter": {
"version": "1.2.10",
"resolved": "https://registry.npmjs.org/@types/component-emitter/-/component-emitter-1.2.10.tgz",
"integrity": "sha512-bsjleuRKWmGqajMerkzox19aGbscQX5rmmvvXl3wlIp5gMG1HgkiwPxsN5p070fBDKTNSPgojVbuY1+HWMbFhg==",
"dev": true
},
"@types/cookie": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.0.tgz",
"integrity": "sha512-y7mImlc/rNkvCRmg8gC3/lj87S7pTUIJ6QGjwHR9WQJcFs+ZMTOaoPrkdFA/YdbuqVEmEbb5RdhVxMkAcgOnpg==",
"dev": true
},
"@types/cors": {
"version": "2.8.9",
"resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.9.tgz",
"integrity": "sha512-zurD1ibz21BRlAOIKP8yhrxlqKx6L9VCwkB5kMiP6nZAhoF5MvC7qS1qPA7nRcr1GJolfkQC7/EAL4hdYejLtg==",
"dev": true
},
"@types/estree": { "@types/estree": {
"version": "0.0.39", "version": "0.0.39",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
@ -1374,6 +1356,12 @@
"integrity": "sha512-K0Ptm/47OKfQRpNQ2J/oIN/3QYiK6FwW+eJbILhsdxh2WTLdl+30o8aGdTbm5JbffpFFAg/g+zi1E+jvJha5ng==", "integrity": "sha512-K0Ptm/47OKfQRpNQ2J/oIN/3QYiK6FwW+eJbILhsdxh2WTLdl+30o8aGdTbm5JbffpFFAg/g+zi1E+jvJha5ng==",
"dev": true "dev": true
}, },
"after": {
"version": "0.8.2",
"resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
"integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8=",
"dev": true
},
"agent-base": { "agent-base": {
"version": "4.3.0", "version": "4.3.0",
"resolved": "https://registry.npmjs.org/agent-base/-/agent-base-4.3.0.tgz", "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-4.3.0.tgz",
@ -1578,6 +1566,12 @@
"es-abstract": "^1.18.0-next.1" "es-abstract": "^1.18.0-next.1"
} }
}, },
"arraybuffer.slice": {
"version": "0.0.7",
"resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz",
"integrity": "sha512-wGUIVQXuehL5TCqQun8OW81jGzAWycqzFF8lFp+GOM5BXLYj3bKNsYC4daB7n6XjCqxQA/qgTJ+8ANR3acjrog==",
"dev": true
},
"arrify": { "arrify": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz", "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
@ -1671,6 +1665,12 @@
"object.assign": "^4.1.0" "object.assign": "^4.1.0"
} }
}, },
"backo2": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
"integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc=",
"dev": true
},
"bail": { "bail": {
"version": "1.0.5", "version": "1.0.5",
"resolved": "https://registry.npmjs.org/bail/-/bail-1.0.5.tgz", "resolved": "https://registry.npmjs.org/bail/-/bail-1.0.5.tgz",
@ -1908,6 +1908,12 @@
"safe-buffer": "^5.1.1" "safe-buffer": "^5.1.1"
} }
}, },
"blob": {
"version": "0.0.5",
"resolved": "https://registry.npmjs.org/blob/-/blob-0.0.5.tgz",
"integrity": "sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig==",
"dev": true
},
"bluebird": { "bluebird": {
"version": "3.4.7", "version": "3.4.7",
"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz", "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
@ -2640,12 +2646,24 @@
"integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=", "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=",
"dev": true "dev": true
}, },
"component-bind": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
"integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E=",
"dev": true
},
"component-emitter": { "component-emitter": {
"version": "1.3.0", "version": "1.3.0",
"resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz", "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz",
"integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==", "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
"dev": true "dev": true
}, },
"component-inherit": {
"version": "0.0.3",
"resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
"integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM=",
"dev": true
},
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@ -2778,16 +2796,6 @@
"integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=", "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
"dev": true "dev": true
}, },
"cors": {
"version": "2.8.5",
"resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
"integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
"dev": true,
"requires": {
"object-assign": "^4",
"vary": "^1"
}
},
"cosmiconfig": { "cosmiconfig": {
"version": "6.0.0", "version": "6.0.0",
"resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz", "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz",
@ -3340,44 +3348,77 @@
} }
}, },
"engine.io": { "engine.io": {
"version": "4.0.6", "version": "3.5.0",
"resolved": "https://registry.npmjs.org/engine.io/-/engine.io-4.0.6.tgz", "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-3.5.0.tgz",
"integrity": "sha512-rf7HAVZpcRrcKEKddgIzYUnwg0g5HE1RvJaTLwkcfJmce4g+po8aMuE6vxzp6JwlK8FEq/vi0KWN6tA585DjaA==", "integrity": "sha512-21HlvPUKaitDGE4GXNtQ7PLP0Sz4aWLddMPw2VTyFz1FVZqu/kZsJUO8WNpKuE/OCL7nkfRaOui2ZCJloGznGA==",
"dev": true, "dev": true,
"requires": { "requires": {
"accepts": "~1.3.4", "accepts": "~1.3.4",
"base64id": "2.0.0", "base64id": "2.0.0",
"cookie": "~0.4.1", "cookie": "~0.4.1",
"cors": "~2.8.5", "debug": "~4.1.0",
"debug": "~4.3.1", "engine.io-parser": "~2.2.0",
"engine.io-parser": "~4.0.0",
"ws": "~7.4.2" "ws": "~7.4.2"
}, },
"dependencies": { "dependencies": {
"debug": { "debug": {
"version": "4.3.1", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
"integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==", "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
"dev": true, "dev": true,
"requires": { "requires": {
"ms": "2.1.2" "ms": "^2.1.1"
} }
}, },
"ms": { "ms": {
"version": "2.1.2", "version": "2.1.3",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
"dev": true "dev": true
} }
} }
}, },
"engine.io-parser": { "engine.io-client": {
"version": "4.0.2", "version": "3.5.0",
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-4.0.2.tgz", "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-3.5.0.tgz",
"integrity": "sha512-sHfEQv6nmtJrq6TKuIz5kyEKH/qSdK56H/A+7DnAuUPWosnIZAS2NHNcPLmyjtY3cGS/MqJdZbUjW97JU72iYg==", "integrity": "sha512-12wPRfMrugVw/DNyJk34GQ5vIVArEcVMXWugQGGuw2XxUSztFNmJggZmv8IZlLyEdnpO1QB9LkcjeWewO2vxtA==",
"dev": true, "dev": true,
"requires": { "requires": {
"base64-arraybuffer": "0.1.4" "component-emitter": "~1.3.0",
"component-inherit": "0.0.3",
"debug": "~3.1.0",
"engine.io-parser": "~2.2.0",
"has-cors": "1.1.0",
"indexof": "0.0.1",
"parseqs": "0.0.6",
"parseuri": "0.0.6",
"ws": "~7.4.2",
"xmlhttprequest-ssl": "~1.5.4",
"yeast": "0.1.2"
},
"dependencies": {
"debug": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"dev": true,
"requires": {
"ms": "2.0.0"
}
}
}
},
"engine.io-parser": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-2.2.1.tgz",
"integrity": "sha512-x+dN/fBH8Ro8TFwJ+rkB2AmuVw9Yu2mockR/p3W8f8YtExwFgDvBDi0GWyb4ZLkpahtDGZgtr3zLovanJghPqg==",
"dev": true,
"requires": {
"after": "0.8.2",
"arraybuffer.slice": "~0.0.7",
"base64-arraybuffer": "0.1.4",
"blob": "0.0.5",
"has-binary2": "~1.0.2"
} }
}, },
"enquirer": { "enquirer": {
@ -4935,6 +4976,29 @@
"function-bind": "^1.1.1" "function-bind": "^1.1.1"
} }
}, },
"has-binary2": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz",
"integrity": "sha512-G1LWKhDSvhGeAQ8mPVQlqNcOB2sJdwATtZKl2pDKKHfpf/rYj24lkinxf69blJbnsvtqqNU+L3SL50vzZhXOnw==",
"dev": true,
"requires": {
"isarray": "2.0.1"
},
"dependencies": {
"isarray": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
"integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4=",
"dev": true
}
}
},
"has-cors": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
"integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk=",
"dev": true
},
"has-flag": { "has-flag": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@ -5203,6 +5267,12 @@
"integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=", "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=",
"dev": true "dev": true
}, },
"indexof": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
"integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10=",
"dev": true
},
"inflight": { "inflight": {
"version": "1.0.6", "version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
@ -5856,9 +5926,9 @@
"dev": true "dev": true
}, },
"karma": { "karma": {
"version": "6.0.0", "version": "5.2.3",
"resolved": "https://registry.npmjs.org/karma/-/karma-6.0.0.tgz", "resolved": "https://registry.npmjs.org/karma/-/karma-5.2.3.tgz",
"integrity": "sha512-Tc9VlrmAlOUjsi+5tyNlo18TWiOps3wo4HJYqfZImyTrek2gUASmW6q+bEIE1U5w9f+sQ97P5PbbUCp3uVNqrQ==", "integrity": "sha512-tHdyFADhVVPBorIKCX8A37iLHxc6RBRphkSoQ+MLKdAtFn1k97tD8WUGi1KlEtDZKL3hui0qhsY9HXUfSNDYPQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"body-parser": "^1.19.0", "body-parser": "^1.19.0",
@ -5879,22 +5949,13 @@
"qjobs": "^1.2.0", "qjobs": "^1.2.0",
"range-parser": "^1.2.1", "range-parser": "^1.2.1",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"socket.io": "^3.0.4", "socket.io": "^2.3.0",
"source-map": "^0.6.1", "source-map": "^0.6.1",
"tmp": "0.2.1", "tmp": "0.2.1",
"ua-parser-js": "^0.7.23", "ua-parser-js": "0.7.22",
"yargs": "^16.1.1" "yargs": "^15.3.1"
}, },
"dependencies": { "dependencies": {
"ansi-styles": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dev": true,
"requires": {
"color-convert": "^2.0.1"
}
},
"braces": { "braces": {
"version": "3.0.2", "version": "3.0.2",
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
@ -5904,32 +5965,6 @@
"fill-range": "^7.0.1" "fill-range": "^7.0.1"
} }
}, },
"cliui": {
"version": "7.0.4",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
"integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
"dev": true,
"requires": {
"string-width": "^4.2.0",
"strip-ansi": "^6.0.0",
"wrap-ansi": "^7.0.0"
}
},
"color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
"dev": true,
"requires": {
"color-name": "~1.1.4"
}
},
"color-name": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"dev": true
},
"fill-range": { "fill-range": {
"version": "7.0.1", "version": "7.0.1",
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@ -5959,44 +5994,6 @@
"requires": { "requires": {
"is-number": "^7.0.0" "is-number": "^7.0.0"
} }
},
"wrap-ansi": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
"integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
"dev": true,
"requires": {
"ansi-styles": "^4.0.0",
"string-width": "^4.1.0",
"strip-ansi": "^6.0.0"
}
},
"y18n": {
"version": "5.0.5",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.5.tgz",
"integrity": "sha512-hsRUr4FFrvhhRH12wOdfs38Gy7k2FFzB9qgN9v3aLykRq0dRcdcpz5C9FxdS2NuhOrI/628b/KSTJ3rwHysYSg==",
"dev": true
},
"yargs": {
"version": "16.2.0",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
"integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
"dev": true,
"requires": {
"cliui": "^7.0.2",
"escalade": "^3.1.1",
"get-caller-file": "^2.0.5",
"require-directory": "^2.1.1",
"string-width": "^4.2.0",
"y18n": "^5.0.5",
"yargs-parser": "^20.2.2"
}
},
"yargs-parser": {
"version": "20.2.4",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.4.tgz",
"integrity": "sha512-WOkpgNhPTlE73h4VFAFsOnomJVaovO8VqLDzy5saChRBFQFBoMYirowyW+Q9HB4HFF4Z7VZTiG3iSzJJA29yRA==",
"dev": true
} }
} }
}, },
@ -7576,6 +7573,18 @@
"parse5": "^6.0.1" "parse5": "^6.0.1"
} }
}, },
"parseqs": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.6.tgz",
"integrity": "sha512-jeAGzMDbfSHHA091hr0r31eYfTig+29g3GKKE/PPbEQ65X0lmMwlEoqmhzu0iztID5uJpZsFlUPDP8ThPL7M8w==",
"dev": true
},
"parseuri": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.6.tgz",
"integrity": "sha512-AUjen8sAkGgao7UyCX6Ahv0gIK2fABKmYjvP4xmy5JaKvcbTRueIqIPHLAfq30xJddqSE033IOMUSOMCcK3Sow==",
"dev": true
},
"parseurl": { "parseurl": {
"version": "1.3.3", "version": "1.3.3",
"resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz", "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@ -9463,69 +9472,125 @@
} }
}, },
"socket.io": { "socket.io": {
"version": "3.0.5", "version": "2.4.1",
"resolved": "https://registry.npmjs.org/socket.io/-/socket.io-3.0.5.tgz", "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-2.4.1.tgz",
"integrity": "sha512-5yWQ43P/4IttmPCGKDQ3CVocBiJWGpibyhYJxgUhf69EHMzmK8XW0DkmHIoYdLmZaVZJyiEkUqpeC7rSCIqekw==", "integrity": "sha512-Si18v0mMXGAqLqCVpTxBa8MGqriHGQh8ccEOhmsmNS3thNCGBwO8WGrwMibANsWtQQ5NStdZwHqZR3naJVFc3w==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/cookie": "^0.4.0", "debug": "~4.1.0",
"@types/cors": "^2.8.8", "engine.io": "~3.5.0",
"@types/node": "^14.14.10", "has-binary2": "~1.0.2",
"accepts": "~1.3.4", "socket.io-adapter": "~1.1.0",
"base64id": "~2.0.0", "socket.io-client": "2.4.0",
"debug": "~4.3.1", "socket.io-parser": "~3.4.0"
"engine.io": "~4.0.6",
"socket.io-adapter": "~2.0.3",
"socket.io-parser": "~4.0.3"
}, },
"dependencies": { "dependencies": {
"debug": { "debug": {
"version": "4.3.1", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
"integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==", "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
"dev": true, "dev": true,
"requires": { "requires": {
"ms": "2.1.2" "ms": "^2.1.1"
} }
}, },
"ms": { "ms": {
"version": "2.1.2", "version": "2.1.3",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
"dev": true "dev": true
} }
} }
}, },
"socket.io-adapter": { "socket.io-adapter": {
"version": "2.0.3", "version": "1.1.2",
"resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-2.0.3.tgz", "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-1.1.2.tgz",
"integrity": "sha512-2wo4EXgxOGSFueqvHAdnmi5JLZzWqMArjuP4nqC26AtLh5PoCPsaRbRdah2xhcwTAMooZfjYiNVNkkmmSMaxOQ==", "integrity": "sha512-WzZRUj1kUjrTIrUKpZLEzFZ1OLj5FwLlAFQs9kuZJzJi5DKdU7FsWc36SNmA8iDOtwBQyT8FkrriRM8vXLYz8g==",
"dev": true "dev": true
}, },
"socket.io-parser": { "socket.io-client": {
"version": "4.0.3", "version": "2.4.0",
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.0.3.tgz", "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-2.4.0.tgz",
"integrity": "sha512-m4ybFiP4UYVORRt7jcdqf8UWx+ywVdAqqsJyruXxAdD3Sv6MDemijWij34mOWdMJ55bEdIb9jACBhxUgNK6sxw==", "integrity": "sha512-M6xhnKQHuuZd4Ba9vltCLT9oa+YvTsP8j9NcEiLElfIg8KeYPyhWOes6x4t+LTAC8enQbE/995AdTem2uNyKKQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/component-emitter": "^1.2.10", "backo2": "1.0.2",
"component-bind": "1.0.0",
"component-emitter": "~1.3.0", "component-emitter": "~1.3.0",
"debug": "~4.3.1" "debug": "~3.1.0",
"engine.io-client": "~3.5.0",
"has-binary2": "~1.0.2",
"indexof": "0.0.1",
"parseqs": "0.0.6",
"parseuri": "0.0.6",
"socket.io-parser": "~3.3.0",
"to-array": "0.1.4"
}, },
"dependencies": { "dependencies": {
"debug": { "debug": {
"version": "4.3.1", "version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==", "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"dev": true, "dev": true,
"requires": { "requires": {
"ms": "2.1.2" "ms": "2.0.0"
} }
}, },
"isarray": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
"integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4=",
"dev": true
},
"socket.io-parser": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.3.1.tgz",
"integrity": "sha512-1QLvVAe8dTz+mKmZ07Swxt+LAo4Y1ff50rlyoEx00TQmDFVQYPfcqGvIDJLGaBdhdNCecXtyKpD+EgKGcmmbuQ==",
"dev": true,
"requires": {
"component-emitter": "~1.3.0",
"debug": "~3.1.0",
"isarray": "2.0.1"
}
}
}
},
"socket.io-parser": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.4.1.tgz",
"integrity": "sha512-11hMgzL+WCLWf1uFtHSNvliI++tcRUWdoeYuwIl+Axvwy9z2gQM+7nJyN3STj1tLj5JyIUH8/gpDGxzAlDdi0A==",
"dev": true,
"requires": {
"component-emitter": "1.2.1",
"debug": "~4.1.0",
"isarray": "2.0.1"
},
"dependencies": {
"component-emitter": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
"integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY=",
"dev": true
},
"debug": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
"integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
"dev": true,
"requires": {
"ms": "^2.1.1"
}
},
"isarray": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz",
"integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4=",
"dev": true
},
"ms": { "ms": {
"version": "2.1.2", "version": "2.1.3",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
"dev": true "dev": true
} }
} }
@ -10362,6 +10427,12 @@
"rimraf": "^3.0.0" "rimraf": "^3.0.0"
} }
}, },
"to-array": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
"integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA=",
"dev": true
},
"to-buffer": { "to-buffer": {
"version": "1.1.1", "version": "1.1.1",
"resolved": "https://registry.npmjs.org/to-buffer/-/to-buffer-1.1.1.tgz", "resolved": "https://registry.npmjs.org/to-buffer/-/to-buffer-1.1.1.tgz",
@ -10535,9 +10606,9 @@
} }
}, },
"ua-parser-js": { "ua-parser-js": {
"version": "0.7.23", "version": "0.7.22",
"resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.23.tgz", "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.22.tgz",
"integrity": "sha512-m4hvMLxgGHXG3O3fQVAyyAQpZzDOvwnhOTjYz5Xmr7r/+LpkNy3vJXdVRWgd1TkAb7NGROZuSy96CrlNVjA7KA==", "integrity": "sha512-YUxzMjJ5T71w6a8WWVcMGM6YWOTX27rCoIQgLXiWaxqXSx9D7DNjiGWn1aJIRSQ5qr0xuhra77bSIh6voR/46Q==",
"dev": true "dev": true
}, },
"unbzip2-stream": { "unbzip2-stream": {
@ -10901,12 +10972,6 @@
"spdx-expression-parse": "^3.0.0" "spdx-expression-parse": "^3.0.0"
} }
}, },
"vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
"integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
"dev": true
},
"vfile": { "vfile": {
"version": "4.2.1", "version": "4.2.1",
"resolved": "https://registry.npmjs.org/vfile/-/vfile-4.2.1.tgz", "resolved": "https://registry.npmjs.org/vfile/-/vfile-4.2.1.tgz",
@ -11046,6 +11111,12 @@
"integrity": "sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q==", "integrity": "sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q==",
"dev": true "dev": true
}, },
"xmlhttprequest-ssl": {
"version": "1.5.5",
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz",
"integrity": "sha1-wodrBhaKrcQOV9l+gRkayPQ5iz4=",
"dev": true
},
"xtend": { "xtend": {
"version": "4.0.2", "version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz", "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
@ -11109,6 +11180,12 @@
"fd-slicer": "~1.1.0" "fd-slicer": "~1.1.0"
} }
}, },
"yeast": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
"integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk=",
"dev": true
},
"yocto-queue": { "yocto-queue": {
"version": "0.1.0", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",

View file

@ -122,7 +122,7 @@
"hugo-bin": "^0.68.0", "hugo-bin": "^0.68.0",
"ip": "^1.1.5", "ip": "^1.1.5",
"jquery": "^3.5.1", "jquery": "^3.5.1",
"karma": "^6.0.0", "karma": "^5.2.3",
"karma-browserstack-launcher": "1.4.0", "karma-browserstack-launcher": "1.4.0",
"karma-chrome-launcher": "^3.1.0", "karma-chrome-launcher": "^3.1.0",
"karma-coverage-istanbul-reporter": "^3.0.3", "karma-coverage-istanbul-reporter": "^3.0.3",

View file

@ -100,6 +100,8 @@
width: $carousel-control-width; width: $carousel-control-width;
color: $carousel-control-color; color: $carousel-control-color;
text-align: center; text-align: center;
background: none;
border: 0;
opacity: $carousel-control-opacity; opacity: $carousel-control-opacity;
@include transition($carousel-control-transition); @include transition($carousel-control-transition);

View file

@ -22,7 +22,7 @@ Please be aware that nested carousels are not supported, and carousels are gener
Carousels don't automatically normalize slide dimensions. As such, you may need to use additional utilities or custom styles to appropriately size content. While carousels support previous/next controls and indicators, they're not explicitly required. Add and customize as you see fit. Carousels don't automatically normalize slide dimensions. As such, you may need to use additional utilities or custom styles to appropriately size content. While carousels support previous/next controls and indicators, they're not explicitly required. Add and customize as you see fit.
**The `.active` class needs to be added to one of the slides** otherwise the carousel will not be visible. Also be sure to set a unique id on the `.carousel` for optional controls, especially if you're using multiple carousels on a single page. Control and indicator elements must have a `data-bs-target` attribute (or `href` for links) that matches the id of the `.carousel` element. **The `.active` class needs to be added to one of the slides** otherwise the carousel will not be visible. Also be sure to set a unique `id` on the `.carousel` for optional controls, especially if you're using multiple carousels on a single page. Control and indicator elements must have a `data-bs-target` attribute (or `href` for links) that matches the `id` of the `.carousel` element.
### Slides only ### Slides only
@ -46,7 +46,7 @@ Here's a carousel with slides only. Note the presence of the `.d-block` and `.w-
### With controls ### With controls
Adding in the previous and next controls: Adding in the previous and next controls. We recommend using `<button>` elements, but you can also use `<a>` link elementsthough in that case, you should also add `role="button"` attributes to the links.
{{< example >}} {{< example >}}
<div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel"> <div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
@ -61,14 +61,14 @@ Adding in the previous and next controls:
{{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}} {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}
@ -94,14 +94,14 @@ You can also add the indicators to the carousel, alongside the controls, too.
{{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}} {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}
@ -139,14 +139,14 @@ Add captions to your slides easily with the `.carousel-caption` element within a
</div> </div>
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleCaptions" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleCaptions" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}
@ -167,14 +167,14 @@ Add `.carousel-fade` to your carousel to animate slides with a fade transition i
{{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}} {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleFade" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleFade" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}
@ -195,14 +195,14 @@ Add `data-bs-interval=""` to a `.carousel-item` to change the amount of time to
{{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}} {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleInterval" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleInterval" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleInterval" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleInterval" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}
@ -223,14 +223,14 @@ Carousels support swiping left/right on touchscreen devices to move between slid
{{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}} {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleControlsNoTouching" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControlsNoTouching" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleControlsNoTouching" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControlsNoTouching" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}
@ -268,14 +268,14 @@ Add `.carousel-dark` to the `.carousel` for darker controls, indicators, and cap
</div> </div>
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExampleDark" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleDark" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#carouselExampleDark" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleDark" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
{{< /example >}} {{< /example >}}

View file

@ -49,7 +49,7 @@ extra_css:
<div class="carousel-caption text-start"> <div class="carousel-caption text-start">
<h1>عنوان المثال.</h1> <h1>عنوان المثال.</h1>
<p> نهاية الأوضاع ان أضف, هو مما رجوعهم وقدّموا. أي عدد الدمج نهاية وأكثرها, المسرح الباهضة وبولندا حول و, كل أما سياسة أسابيع. مع حيث قُدُماً الكونجرس, بها و خيار ٢٠٠٤, كلا في مكّن وقام. مع يكن زهاء بالفشل, الجوي الصين الشمال إذ على.</p> <p> نهاية الأوضاع ان أضف, هو مما رجوعهم وقدّموا. أي عدد الدمج نهاية وأكثرها, المسرح الباهضة وبولندا حول و, كل أما سياسة أسابيع. مع حيث قُدُماً الكونجرس, بها و خيار ٢٠٠٤, كلا في مكّن وقام. مع يكن زهاء بالفشل, الجوي الصين الشمال إذ على.</p>
<p><a class="btn btn-lg btn-primary" href="#">سجل اليوم</a></p> <p><a class="btn btn-lg btn-primary" href="#" role="button">سجل اليوم</a></p>
</div> </div>
</div> </div>
</div> </div>
@ -59,7 +59,7 @@ extra_css:
<div class="carousel-caption"> <div class="carousel-caption">
<h1>عنوان مثال آخر.</h1> <h1>عنوان مثال آخر.</h1>
<p>ثم تزامناً الفرنسي الإقتصادية دار. لكل عن الضغوط المتّبعة, أن حتى إختار المدن بالإنزال. عن الشمل بالفشل تلك, بل أراض أوزار بلديهما حول. دون لكون والتي ثم, كُلفة ويعزى استطاعوا أن لمّ. جُل بخطوط واحدة البشريةً.</p> <p>ثم تزامناً الفرنسي الإقتصادية دار. لكل عن الضغوط المتّبعة, أن حتى إختار المدن بالإنزال. عن الشمل بالفشل تلك, بل أراض أوزار بلديهما حول. دون لكون والتي ثم, كُلفة ويعزى استطاعوا أن لمّ. جُل بخطوط واحدة البشريةً.</p>
<p><a class="btn btn-lg btn-primary" href="#">أعرف أكثر</a></p> <p><a class="btn btn-lg btn-primary" href="#" role="button">أعرف أكثر</a></p>
</div> </div>
</div> </div>
</div> </div>
@ -69,19 +69,19 @@ extra_css:
<div class="carousel-caption text-end"> <div class="carousel-caption text-end">
<h1>واحد أكثر لقياس جيد.</h1> <h1>واحد أكثر لقياس جيد.</h1>
<p>قررت العصبة إيطاليا وتم أن, عن سكان وقامت الحكومة وفي. كان بـ اوروبا اليابانية, ثمّة بوابة يتعلّق عل بعض. عدم رئيس الآلاف أن حدى.</p> <p>قررت العصبة إيطاليا وتم أن, عن سكان وقامت الحكومة وفي. كان بـ اوروبا اليابانية, ثمّة بوابة يتعلّق عل بعض. عدم رئيس الآلاف أن حدى.</p>
<p><a class="btn btn-lg btn-primary" href="#">تصفح المعرض</a></p> <p><a class="btn btn-lg btn-primary" href="#" role="button">تصفح المعرض</a></p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#myCarousel" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">السابق</span> <span class="visually-hidden">السابق</span>
</a> </button>
<a class="carousel-control-next" href="#myCarousel" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">التالى</span> <span class="visually-hidden">التالى</span>
</a> </button>
</div> </div>
@ -97,19 +97,19 @@ extra_css:
{{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
<h2>عنوان</h2> <h2>عنوان</h2>
<p>ان وتم عجّل الأجل, قبل نتيجة المشترك بـ, أي جعل جورج أوزار المسرح. أن وإعلان الساحل تلك, مكن ان استبدال الباهضة التكاليف. الى ماذا اليميني الحكومة في, إجلاء نتيجة قبل تم. مساعدة بولندا، أي هذه الحكم.</p> <p>ان وتم عجّل الأجل, قبل نتيجة المشترك بـ, أي جعل جورج أوزار المسرح. أن وإعلان الساحل تلك, مكن ان استبدال الباهضة التكاليف. الى ماذا اليميني الحكومة في, إجلاء نتيجة قبل تم. مساعدة بولندا، أي هذه الحكم.</p>
<p><a class="btn btn-secondary" href="#">عرض التفاصيل</a></p> <p><a class="btn btn-secondary" href="#" role="button">عرض التفاصيل</a></p>
</div><!-- /.col-lg-4 --> </div><!-- /.col-lg-4 -->
<div class="col-lg-4"> <div class="col-lg-4">
{{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
<h2>عنوان</h2> <h2>عنوان</h2>
<p>هو أخر إتفاقية الدولارات الأوروبيّون, ثانية طوكيو و به،, ونتج أعمال مما أم. عن الا يونيو أفريقيا, السيطرة التقليدي ومن ٣٠. هو الغالي الإتفاقية ويكيبيديا، مكن, و الى هُزم اعتداء وايرلندا. وقبل بمباركة الأوروبيّون عن فقد, بتحدّي والفلبين ما كلا.</p> <p>هو أخر إتفاقية الدولارات الأوروبيّون, ثانية طوكيو و به،, ونتج أعمال مما أم. عن الا يونيو أفريقيا, السيطرة التقليدي ومن ٣٠. هو الغالي الإتفاقية ويكيبيديا، مكن, و الى هُزم اعتداء وايرلندا. وقبل بمباركة الأوروبيّون عن فقد, بتحدّي والفلبين ما كلا.</p>
<p><a class="btn btn-secondary" href="#">عرض التفاصيل</a></p> <p><a class="btn btn-secondary" href="#" role="button">عرض التفاصيل</a></p>
</div><!-- /.col-lg-4 --> </div><!-- /.col-lg-4 -->
<div class="col-lg-4"> <div class="col-lg-4">
{{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
<h2>عنوان</h2> <h2>عنوان</h2>
<p>غير عن الثقيل وسمّيت الأوضاع, لم تاريخ بالحرب للسيطرة حين, دار اللا تطوير تم. الى بشرية اليابان في. أما الشهيرة الإثنان وايرلندا ما, لإعلان واشتدّت و مدن. في غير والحزب للسيطرة الإكتفاء. ثانية الكونجرس الا من, جُل ٣٠ وبداية الشرقية.</p> <p>غير عن الثقيل وسمّيت الأوضاع, لم تاريخ بالحرب للسيطرة حين, دار اللا تطوير تم. الى بشرية اليابان في. أما الشهيرة الإثنان وايرلندا ما, لإعلان واشتدّت و مدن. في غير والحزب للسيطرة الإكتفاء. ثانية الكونجرس الا من, جُل ٣٠ وبداية الشرقية.</p>
<p><a class="btn btn-secondary" href="#">عرض التفاصيل</a></p> <p><a class="btn btn-secondary" href="#" role="button">عرض التفاصيل</a></p>
</div><!-- /.col-lg-4 --> </div><!-- /.col-lg-4 -->
</div><!-- /.row --> </div><!-- /.row -->

View file

@ -48,7 +48,7 @@ extra_css:
<div class="carousel-caption text-start"> <div class="carousel-caption text-start">
<h1>Example headline.</h1> <h1>Example headline.</h1>
<p>Some representative placeholder content for the first slide of the carousel.</p> <p>Some representative placeholder content for the first slide of the carousel.</p>
<p><a class="btn btn-lg btn-primary" href="#">Sign up today</a></p> <p><a class="btn btn-lg btn-primary" href="#" role="button">Sign up today</a></p>
</div> </div>
</div> </div>
</div> </div>
@ -58,7 +58,7 @@ extra_css:
<div class="carousel-caption"> <div class="carousel-caption">
<h1>Another example headline.</h1> <h1>Another example headline.</h1>
<p>Some representative placeholder content for the second slide of the carousel.</p> <p>Some representative placeholder content for the second slide of the carousel.</p>
<p><a class="btn btn-lg btn-primary" href="#">Learn more</a></p> <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
</div> </div>
</div> </div>
</div> </div>
@ -68,19 +68,19 @@ extra_css:
<div class="carousel-caption text-end"> <div class="carousel-caption text-end">
<h1>One more for good measure.</h1> <h1>One more for good measure.</h1>
<p>Some representative placeholder content for the third slide of this carousel.</p> <p>Some representative placeholder content for the third slide of this carousel.</p>
<p><a class="btn btn-lg btn-primary" href="#">Browse gallery</a></p> <p><a class="btn btn-lg btn-primary" href="#" role="button">Browse gallery</a></p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#myCarousel" role="button" data-bs-slide="prev"> <button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</a> </button>
<a class="carousel-control-next" href="#myCarousel" role="button" data-bs-slide="next"> <button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</a> </button>
</div> </div>
@ -96,19 +96,19 @@ extra_css:
{{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
<h2>Heading</h2> <h2>Heading</h2>
<p>Some representative placeholder content for the three columns of text below the carousel. This is the first column.</p> <p>Some representative placeholder content for the three columns of text below the carousel. This is the first column.</p>
<p><a class="btn btn-secondary" href="#">View details &raquo;</a></p> <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 --> </div><!-- /.col-lg-4 -->
<div class="col-lg-4"> <div class="col-lg-4">
{{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
<h2>Heading</h2> <h2>Heading</h2>
<p>Another exciting bit of representative placeholder content. This time, we've moved on to the second column.</p> <p>Another exciting bit of representative placeholder content. This time, we've moved on to the second column.</p>
<p><a class="btn btn-secondary" href="#">View details &raquo;</a></p> <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 --> </div><!-- /.col-lg-4 -->
<div class="col-lg-4"> <div class="col-lg-4">
{{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
<h2>Heading</h2> <h2>Heading</h2>
<p>And lastly this, the third column of representative placeholder content.</p> <p>And lastly this, the third column of representative placeholder content.</p>
<p><a class="btn btn-secondary" href="#">View details &raquo;</a></p> <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 --> </div><!-- /.col-lg-4 -->
</div><!-- /.row --> </div><!-- /.row -->