From 9dc949b62c6b5e3c8872211f71b11714d9d22b22 Mon Sep 17 00:00:00 2001 From: Mario Date: Fri, 20 Jan 2023 11:05:15 +0000 Subject: native dark theme initial checkin --- .../docs/5.3/examples/carousel/carousel.css | 82 ++++++++++ .../docs/5.3/examples/carousel/carousel.rtl.css | 74 +++++++++ .../content/docs/5.3/examples/carousel/index.html | 166 +++++++++++++++++++++ 3 files changed, 322 insertions(+) create mode 100644 vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.css create mode 100644 vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.rtl.css create mode 100644 vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/index.html (limited to 'vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel') diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.css new file mode 100644 index 000000000..0bdf9768d --- /dev/null +++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.css @@ -0,0 +1,82 @@ +/* GLOBAL STYLES +-------------------------------------------------- */ +/* Padding below the footer and lighter body text */ + +body { + padding-top: 3rem; + padding-bottom: 3rem; + color: #5a5a5a; +} + + +/* CUSTOMIZE THE CAROUSEL +-------------------------------------------------- */ + +/* Carousel base class */ +.carousel { + margin-bottom: 4rem; +} +/* Since positioning the image, we need to help out the caption */ +.carousel-caption { + bottom: 3rem; + z-index: 10; +} + +/* Declare heights because of positioning of img element */ +.carousel-item { + height: 32rem; +} + + +/* MARKETING CONTENT +-------------------------------------------------- */ + +/* Center align the text within the three columns below the carousel */ +.marketing .col-lg-4 { + margin-bottom: 1.5rem; + text-align: center; +} +/* rtl:begin:ignore */ +.marketing .col-lg-4 p { + margin-right: .75rem; + margin-left: .75rem; +} +/* rtl:end:ignore */ + + +/* Featurettes +------------------------- */ + +.featurette-divider { + margin: 5rem 0; /* Space out the Bootstrap
more */ +} + +/* Thin out the marketing headings */ +/* rtl:begin:remove */ +.featurette-heading { + letter-spacing: -.05rem; +} + +/* rtl:end:remove */ + +/* RESPONSIVE CSS +-------------------------------------------------- */ + +@media (min-width: 40em) { + /* Bump up size of carousel content */ + .carousel-caption p { + margin-bottom: 1.25rem; + font-size: 1.25rem; + line-height: 1.4; + } + + .featurette-heading { + font-size: 50px; + } +} + +@media (min-width: 62em) { + .featurette-heading { + margin-top: 7rem; + } +} diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.rtl.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.rtl.css new file mode 100644 index 000000000..d20a8111a --- /dev/null +++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.rtl.css @@ -0,0 +1,74 @@ +/* GLOBAL STYLES +-------------------------------------------------- */ +/* Padding below the footer and lighter body text */ + +body { + padding-top: 3rem; + padding-bottom: 3rem; + color: #5a5a5a; +} + + +/* CUSTOMIZE THE CAROUSEL +-------------------------------------------------- */ + +/* Carousel base class */ +.carousel { + margin-bottom: 4rem; +} +/* Since positioning the image, we need to help out the caption */ +.carousel-caption { + bottom: 3rem; + z-index: 10; +} + +/* Declare heights because of positioning of img element */ +.carousel-item { + height: 32rem; +} + + +/* MARKETING CONTENT +-------------------------------------------------- */ + +/* Center align the text within the three columns below the carousel */ +.marketing .col-lg-4 { + margin-bottom: 1.5rem; + text-align: center; +} +.marketing .col-lg-4 p { + margin-right: .75rem; + margin-left: .75rem; +} + + +/* Featurettes +------------------------- */ + +.featurette-divider { + margin: 5rem 0; /* Space out the Bootstrap
more */ +} + +/* Thin out the marketing headings */ + +/* RESPONSIVE CSS +-------------------------------------------------- */ + +@media (min-width: 40em) { + /* Bump up size of carousel content */ + .carousel-caption p { + margin-bottom: 1.25rem; + font-size: 1.25rem; + line-height: 1.4; + } + + .featurette-heading { + font-size: 50px; + } +} + +@media (min-width: 62em) { + .featurette-heading { + margin-top: 7rem; + } +} diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/index.html new file mode 100644 index 000000000..67c0dd529 --- /dev/null +++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/index.html @@ -0,0 +1,166 @@ +--- +layout: examples +title: Carousel Template +extra_css: + - "carousel.css" +--- + +
+ +
+ +
+ + + + + + + +
+ + +
+
+ {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} +

Heading

+

Some representative placeholder content for the three columns of text below the carousel. This is the first column.

+

View details »

+
+
+ {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} +

Heading

+

Another exciting bit of representative placeholder content. This time, we've moved on to the second column.

+

View details »

+
+
+ {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}} +

Heading

+

And lastly this, the third column of representative placeholder content.

+

View details »

+
+
+ + + + +
+ +
+
+

First featurette heading. It’ll blow your mind.

+

Some great placeholder content for the first featurette here. Imagine some exciting prose here.

+
+
+ {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}} +
+
+ +
+ +
+
+

Oh yeah, it’s that good. See for yourself.

+

Another featurette? Of course. More placeholder content here to give you an idea of how this layout would work with some actual real-world content in place.

+
+
+ {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}} +
+
+ +
+ +
+
+

And lastly, this one. Checkmate.

+

And yes, this is the last block of representative placeholder content. Again, not really intended to be actually read, simply here to give you a better view of what this would look like with some actual content. Your content.

+
+
+ {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}} +
+
+ +
+ + + +
+ + + + +
-- cgit v1.2.3