From 45722e94acdffc314d7f835ed8a73cd0d56d879a Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Fri, 30 Jun 2017 14:22:11 -0700
Subject: [PATCH] Drop .blockquote-reverse, replace with text utils, and
redesign blockquote to not have a border
---
docs/4.0/content/typography.md | 13 ++++++++++---
scss/_type.scss | 20 --------------------
scss/_variables.scss | 2 --
3 files changed, 10 insertions(+), 25 deletions(-)
diff --git a/docs/4.0/content/typography.md b/docs/4.0/content/typography.md
index 338c413aeb..9ae27f0c47 100644
--- a/docs/4.0/content/typography.md
+++ b/docs/4.0/content/typography.md
@@ -202,12 +202,19 @@ Add a `<footer class="blockquote-footer">` for identifying the source. Wrap the
</blockquote>
{% endexample %}
-### Reverse layout
+### Alignment
-Add `.blockquote-reverse` for a blockquote with right-aligned content.
+Use text utilities as needed to change the alignment of your blockquote.
{% example html %}
-<blockquote class="blockquote blockquote-reverse">
+<blockquote class="blockquote text-center">
+ <p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
+ <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
+</blockquote>
+{% endexample %}
+
+{% example html %}
+<blockquote class="blockquote text-right">
<p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>
diff --git a/scss/_type.scss b/scss/_type.scss
index 5ecc336aef..8928341da8 100644
--- a/scss/_type.scss
+++ b/scss/_type.scss
@@ -108,10 +108,8 @@ mark,
// Blockquotes
.blockquote {
- padding: ($spacer / 2) $spacer;
margin-bottom: $spacer;
font-size: $blockquote-font-size;
- border-left: $blockquote-border-width solid $blockquote-border-color;
}
.blockquote-footer {
@@ -123,21 +121,3 @@ mark,
content: "\2014 \00A0"; // em dash, nbsp
}
}
-
-// Opposite alignment of blockquote
-.blockquote-reverse {
- padding-right: $spacer;
- padding-left: 0;
- text-align: right;
- border-right: $blockquote-border-width solid $blockquote-border-color;
- border-left: 0;
-}
-
-.blockquote-reverse .blockquote-footer {
- &::before {
- content: "";
- }
- &::after {
- content: "\00A0 \2014"; // nbsp, em dash
- }
-}
diff --git a/scss/_variables.scss b/scss/_variables.scss
index f788c7cb59..1184fc6c4f 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -279,8 +279,6 @@ $text-muted: $gray-600 !default;
$blockquote-small-color: $gray-600 !default;
$blockquote-font-size: ($font-size-base * 1.25) !default;
-$blockquote-border-color: $gray-200 !default;
-$blockquote-border-width: .25rem !default;
$hr-border-color: rgba($black,.1) !default;
$hr-border-width: $border-width !default;
--
GitLab