From fe9384c2165b562bf700ee7ad5e09a71f0fdde95 Mon Sep 17 00:00:00 2001
From: Martijn Cuppens <martijn.cuppens@gmail.com>
Date: Mon, 6 Apr 2020 15:29:45 +0200
Subject: [PATCH] Backport #30497
Fix card list group borders & radii
---
scss/_card.scss | 17 ++++++++++-------
scss/_list-group.scss | 19 +++++++------------
2 files changed, 17 insertions(+), 19 deletions(-)
diff --git a/scss/_card.scss b/scss/_card.scss
index d6759fde68..12515529f7 100644
--- a/scss/_card.scss
+++ b/scss/_card.scss
@@ -19,15 +19,18 @@
margin-left: 0;
}
- > .list-group:first-child {
- .list-group-item:first-child {
- @include border-top-radius($card-border-radius);
+ > .list-group {
+ border-top: inherit;
+ border-bottom: inherit;
+
+ &:first-child {
+ border-top-width: 0;
+ @include border-top-radius($card-inner-border-radius);
}
- }
- > .list-group:last-child {
- .list-group-item:last-child {
- @include border-bottom-radius($card-border-radius);
+ &:last-child {
+ border-bottom-width: 0;
+ @include border-bottom-radius($card-inner-border-radius);
}
}
}
diff --git a/scss/_list-group.scss b/scss/_list-group.scss
index 2af8af23b9..747d190661 100644
--- a/scss/_list-group.scss
+++ b/scss/_list-group.scss
@@ -9,6 +9,7 @@
// No need to set list-style: none; since .list-group-item is block level
padding-left: 0; // reset padding because ul and ol
margin-bottom: 0;
+ @include border-radius($list-group-border-radius);
}
@@ -51,11 +52,11 @@
border: $list-group-border-width solid $list-group-border-color;
&:first-child {
- @include border-top-radius($list-group-border-radius);
+ @include border-top-radius(inherit);
}
&:last-child {
- @include border-bottom-radius($list-group-border-radius);
+ @include border-bottom-radius(inherit);
}
&.disabled,
@@ -131,18 +132,12 @@
// useful within other components (e.g., cards).
.list-group-flush {
- .list-group-item {
- border-right-width: 0;
- border-left-width: 0;
- @include border-radius(0);
+ @include border-radius(0);
- &:first-child {
- border-top-width: 0;
- }
- }
+ .list-group-item {
+ border-width: 0 0 $list-group-border-width;
- &:last-child {
- .list-group-item:last-child {
+ &:last-child {
border-bottom-width: 0;
}
}
--
GitLab