From 83acf0573bd95e5b05ce6186e100a7491609d619 Mon Sep 17 00:00:00 2001 From: Nic Date: Wed, 19 Aug 2015 19:03:33 +0200 Subject: Title on Figures page should be Figures and not Images? --- docs/content/figures.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/content') diff --git a/docs/content/figures.md b/docs/content/figures.md index 4e2b4dd6d..1d27c1e85 100644 --- a/docs/content/figures.md +++ b/docs/content/figures.md @@ -1,6 +1,6 @@ --- layout: docs -title: Images +title: Figures group: content --- -- cgit v1.2.3 From 805d4874f053d788d38964ab4aa1ba6c919b19a9 Mon Sep 17 00:00:00 2001 From: Kevin Kirsche Date: Wed, 19 Aug 2015 17:30:48 -0400 Subject: Fix link to .table section in Reboot Fix #17062 --- docs/content/reboot.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/content') diff --git a/docs/content/reboot.md b/docs/content/reboot.md index 7418c4116..362299d3e 100644 --- a/docs/content/reboot.md +++ b/docs/content/reboot.md @@ -120,7 +120,7 @@ The `
` element is reset to remove its `margin-top` and use `rem` units for
 
 ## Tables
 
-Tables are slightly adjusted to style ``s and ensure consistent `text-align` throughout. Additional changes for borders, padding, and more come with [the `.table` class](/components/tables/).
+Tables are slightly adjusted to style ``s and ensure consistent `text-align` throughout. Additional changes for borders, padding, and more come with [the `.table` class](/content/tables/).
 
 
-- cgit v1.2.3 From 56eefe2ab4d22b270c41f9bcb4fd7a092067fbe0 Mon Sep 17 00:00:00 2001 From: James Kyle Date: Wed, 19 Aug 2015 15:10:44 -0700 Subject: Add code example to display typography --- docs/content/typography.md | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'docs/content') diff --git a/docs/content/typography.md b/docs/content/typography.md index 69ead9b83..f84a44c4d 100644 --- a/docs/content/typography.md +++ b/docs/content/typography.md @@ -100,6 +100,13 @@ Traditional heading elements are designed to work best in the meat of your page
+{% highlight html %} +

Display 4

+

Display 3

+

Display 2

+

Display 1

+{% endhighlight %} + ## Lead Make a paragraph stand out by adding `.lead`. -- cgit v1.2.3 From 3a2c798397a8ff668ae12080bab41342d8a3f69a Mon Sep 17 00:00:00 2001 From: James Kyle Date: Wed, 19 Aug 2015 15:21:42 -0700 Subject: v4 - fix after => :after --- docs/content/reboot.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/content') diff --git a/docs/content/reboot.md b/docs/content/reboot.md index 7418c4116..0ba318c1d 100644 --- a/docs/content/reboot.md +++ b/docs/content/reboot.md @@ -27,7 +27,7 @@ Here are our guidelines and reasons for choosing what to override in Reboot: The `` and `` elements are updated to provide better page-wide defaults. More specifically: -- The `box-sizing` is globally set on every element—including `*:before` and `*after`, to `border-box`. This ensures that the declared width of element is never exceeded due to padding or border. +- The `box-sizing` is globally set on every element—including `*:before` and `*:after`, to `border-box`. This ensures that the declared width of element is never exceeded due to padding or border. - A base `font-size: 16px` is declared on the `` and `font-size: 1rem` on the `` for easy responsive type-scaling via media queryies. - The `` also sets a global `font-family` and `line-height`. This is inherited later by some form elements to prevent font inconsistencies. - For safety, the `` has a declared `background-color`, defaulting to `#fff`. -- cgit v1.2.3 From 4540ad38af17b56bfd94451ae16f86a01ce635af Mon Sep 17 00:00:00 2001 From: James Kyle Date: Wed, 19 Aug 2015 15:28:49 -0700 Subject: Use doge instead of css for
 example

---
 docs/content/reboot.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'docs/content')

diff --git a/docs/content/reboot.md b/docs/content/reboot.md
index 7418c4116..ac17e147e 100644
--- a/docs/content/reboot.md
+++ b/docs/content/reboot.md
@@ -111,9 +111,9 @@ The `
` element is reset to remove its `margin-top` and use `rem` units for
 
{% markdown %}
-.element {
-  margin-bottom: 1rem;
-}
+        Wow
+  such
+      preformatted text
 
{% endmarkdown %}
-- cgit v1.2.3 From 459b9fa0e00020b1f50f5eafd8a7d71e03b84365 Mon Sep 17 00:00:00 2001 From: James Kyle Date: Wed, 19 Aug 2015 15:33:35 -0700 Subject: Fix urls ./helpers => ./utilities --- docs/content/images.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/content') diff --git a/docs/content/images.md b/docs/content/images.md index 83cb9610b..1b1bbdecc 100644 --- a/docs/content/images.md +++ b/docs/content/images.md @@ -47,7 +47,7 @@ Add classes to an `` element to easily style images in any project. ## Aligning images -Align images with the [helper float classes](/components/helpers) or [text alignment classes](/components/helpers). A simple centering class can also be used for `block` level images. +Align images with the [helper float classes](/components/utilities/#floats) or [text alignment classes](/components/utilities/#text-alignment). A simple centering class can also be used for `block` level images.
A generic square placeholder image with rounded corners -- cgit v1.2.3 From 8be18f32ac932575efcb01d2c70f260f7d65936e Mon Sep 17 00:00:00 2001 From: James Kyle Date: Wed, 19 Aug 2015 15:42:41 -0700 Subject: Fix text utilities link --- docs/content/figures.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/content') diff --git a/docs/content/figures.md b/docs/content/figures.md index 4e2b4dd6d..9871834c0 100644 --- a/docs/content/figures.md +++ b/docs/content/figures.md @@ -15,7 +15,7 @@ Use the included `.figure` and `.figure-caption` classes to provide some baselin {% endexample %} -Aligning the figure's caption is easy with our [text utilities](). +Aligning the figure's caption is easy with our [text utilities](/components/utilities/#text-alignment). {% example html %}
-- cgit v1.2.3 From 5d8751274d9887dfdcdb31bd973532b411613784 Mon Sep 17 00:00:00 2001 From: James Kyle Date: Wed, 19 Aug 2015 16:52:24 -0700 Subject: Use .example-element instead of doge :cry: --- docs/content/reboot.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'docs/content') diff --git a/docs/content/reboot.md b/docs/content/reboot.md index ac17e147e..845d50798 100644 --- a/docs/content/reboot.md +++ b/docs/content/reboot.md @@ -111,9 +111,9 @@ The `
` element is reset to remove its `margin-top` and use `rem` units for
 
{% markdown %}
-        Wow
-  such
-      preformatted text
+.example-element {
+  margin-bottom: 1rem;
+}
 
{% endmarkdown %}
-- cgit v1.2.3 From 42792682acc780b8ea6bf56655293cf9919a9115 Mon Sep 17 00:00:00 2001 From: David Richardson Date: Thu, 20 Aug 2015 10:33:45 +0100 Subject: Fix use of LESS var syntax in docs when referencing SCSS Example: > ... SCSS variables (e.g., `@enable-gradients: true`) ... Referenced SCSS but used the LESS syntax. Changed to: > ... SCSS variables (e.g., `$enable-gradients: true`) ... Closes #17114 --- docs/content/typography.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'docs/content') diff --git a/docs/content/typography.md b/docs/content/typography.md index f84a44c4d..ada3bc2b6 100644 --- a/docs/content/typography.md +++ b/docs/content/typography.md @@ -16,10 +16,10 @@ Bootstrap includes simple and easily customized typography for headings, body te Bootstrap sets basic global display, typography, and link styles. Specifically, we: - Set `background-color: #fff;` on the `` -- Use the `@font-family-base`, `@font-size-base`, and `@line-height-base` attributes as our typographic base -- Set the global link color via `@link-color` and apply link underlines only on `:hover` +- Use the `$font-family-base`, `$font-size-base`, and `$line-height-base` attributes as our typographic base +- Set the global link color via `$link-color` and apply link underlines only on `:hover` -These styles can be found within `scaffolding.less`. +These styles can be found within `_reboot.scss`. ## Headings -- cgit v1.2.3 From 66be25917a66a2cdb19a297a1ce7e5642357fc06 Mon Sep 17 00:00:00 2001 From: Heinrich Fenkart Date: Fri, 21 Aug 2015 02:15:17 +0200 Subject: Docs: various fixes Mostly links. Fixes #17056. --- docs/content/figures.md | 2 +- docs/content/images.md | 2 +- docs/content/reboot.md | 2 +- docs/content/typography.md | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) (limited to 'docs/content') diff --git a/docs/content/figures.md b/docs/content/figures.md index ee7702d26..d8e2435fe 100644 --- a/docs/content/figures.md +++ b/docs/content/figures.md @@ -15,7 +15,7 @@ Use the included `.figure` and `.figure-caption` classes to provide some baselin
{% endexample %} -Aligning the figure's caption is easy with our [text utilities](/components/utilities/#text-alignment). +Aligning the figure's caption is easy with our [text utilities]({{ site.baseurl }}/components/utilities/#text-alignment). {% example html %}
diff --git a/docs/content/images.md b/docs/content/images.md index 1b1bbdecc..a72f0041b 100644 --- a/docs/content/images.md +++ b/docs/content/images.md @@ -47,7 +47,7 @@ Add classes to an `` element to easily style images in any project. ## Aligning images -Align images with the [helper float classes](/components/utilities/#floats) or [text alignment classes](/components/utilities/#text-alignment). A simple centering class can also be used for `block` level images. +Align images with the [helper float classes]({{ site.baseurl }}/components/utilities/#floats) or [text alignment classes]({{ site.baseurl }}/components/utilities/#text-alignment). A simple centering class can also be used for `block` level images.
A generic square placeholder image with rounded corners diff --git a/docs/content/reboot.md b/docs/content/reboot.md index aff43c329..af2eab4a7 100644 --- a/docs/content/reboot.md +++ b/docs/content/reboot.md @@ -120,7 +120,7 @@ The `
` element is reset to remove its `margin-top` and use `rem` units for
 
 ## Tables
 
-Tables are slightly adjusted to style ``s and ensure consistent `text-align` throughout. Additional changes for borders, padding, and more come with [the `.table` class](/content/tables/).
+Tables are slightly adjusted to style ``s and ensure consistent `text-align` throughout. Additional changes for borders, padding, and more come with [the `.table` class]({{ site.baseurl }}/content/tables/).
 
 
diff --git a/docs/content/typography.md b/docs/content/typography.md index ada3bc2b6..082a87ec9 100644 --- a/docs/content/typography.md +++ b/docs/content/typography.md @@ -4,7 +4,7 @@ title: Typography group: content --- -Bootstrap includes simple and easily customized typography for headings, body text, lists, and more. For even more control, check out the [textual utility classes](/components/utilities/). +Bootstrap includes simple and easily customized typography for headings, body text, lists, and more. For even more control, check out the [textual utility classes]({{ site.baseurl }}/components/utilities/). ## Contents -- cgit v1.2.3 From e3899b4fa848e73a0efcbba614b5ddf1af1c677c Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Thu, 20 Aug 2015 18:37:20 -0700 Subject: reboot.md: fix typo: "to a minimal" [sic] --- docs/content/reboot.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/content') diff --git a/docs/content/reboot.md b/docs/content/reboot.md index af2eab4a7..5db306d90 100644 --- a/docs/content/reboot.md +++ b/docs/content/reboot.md @@ -21,7 +21,7 @@ Here are our guidelines and reasons for choosing what to override in Reboot: - Update some browser default values to use `rem`s instead of `em`s for scalable component spacing. - Avoid `margin-top`. Vertical margins can collapse, yielding unexpected results. More importantly though, a single direction of `margin` is a simpler mental model. - For easier scaling across device sizes, block elements should use `rem`s for `margin`s. -- Keep declarations of `font`-related properties to a minimal, using `inherit` whenever possible. +- Keep declarations of `font`-related properties to a minimum, using `inherit` whenever possible. ## Page defaults -- cgit v1.2.3 From 818e1243cf0948634df1faa37216432e2daff070 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 22 Aug 2015 18:56:28 -0700 Subject: add responsive typography note /cc #17095 --- docs/content/typography.md | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) (limited to 'docs/content') diff --git a/docs/content/typography.md b/docs/content/typography.md index 082a87ec9..3145209ee 100644 --- a/docs/content/typography.md +++ b/docs/content/typography.md @@ -235,3 +235,33 @@ Align terms and descriptions horizontally by using our grid system's predefined
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
{% endexample %} + +## Responsive typography + +*Responsive typography* refers to scaling text and components by simply adjusting the root element's `font-size` within a series of media queries. Bootstrap doesn't do this for you, but it's fairly easy to add if you need it. + +Here's an example of it in practice. Choose whatever `font-size`s and media queries you wish. + +{% highlight scss %} +html { + font-size: 14px; +} + +@include media-breakpoint-up(sm) { + html { + font-size: 16px; + } +} + +@include media-breakpoint-up(md) { + html { + font-size: 28px; + } +} + +@include media-breakpoint-up(lg) { + html { + font-size: 20px; + } +} +{% endhighlight %} -- cgit v1.2.3 From 2dddf997a93c3bda874acb663a0da496f1525f52 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 23 Aug 2015 23:03:58 -0700 Subject: my bad, fix those values /cc @cvrebert --- docs/content/typography.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'docs/content') diff --git a/docs/content/typography.md b/docs/content/typography.md index 3145209ee..264686b05 100644 --- a/docs/content/typography.md +++ b/docs/content/typography.md @@ -255,13 +255,13 @@ html { @include media-breakpoint-up(md) { html { - font-size: 28px; + font-size: 20px; } } @include media-breakpoint-up(lg) { html { - font-size: 20px; + font-size: 28px; } } {% endhighlight %} -- cgit v1.2.3