10000 Merge branch 'bassjobsen-patch-6' into v4-dev · liuwenye2010/bootstrap@96dd9c5 · GitHub
[go: up one dir, main page]
Skip to content

Commit 96dd9c5

Browse files
mdomdo
committed
Merge branch 'bassjobsen-patch-6' into v4-dev
2 parents 04b3766 + 9e6d1c1 commit 96dd9c5

File tree

2 files changed

+60
-28
lines changed

2 files changed

+60
-28
lines changed

‎scss/_card.scss

Lines changed: 26 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -93,49 +93,49 @@
9393
//
9494

9595
.card-primary {
96-
@include card-variant($brand-primary);
96+
@include card-variant($brand-primary, $brand-primary);
9797
}
9898
.card-success {
99-
@include card-variant($brand-success);
99+
@include card-variant($brand-success, $brand-success);
100100
}
101101
.card-info {
102-
@include card-variant($brand-info);
102+
@include card-variant($brand-info, $brand-info);
103103
}
104104
.card-warning {
105-
@include card-variant($brand-warning);
105+
@include card-variant($brand-warning, $brand-warning);
106106
}
107107
.card-danger {
108-
@include card-variant($brand-danger);
108+
@include card-variant($brand-danger, $brand-danger);
109+
}
110+
111+
// Remove all backgrounds
112+
.card-primary-outline {
113+
@include card-outline-variant($btn-primary-bg);
114+
}
115+
.card-secondary-outline {
116+
@include card-outline-variant($btn-secondary-border);
117+
}
118+
.card-info-outline {
119+
@include card-outline-variant($btn-info-bg);
120+
}
121+
.card-success-outline {
122+
@include card-outline-variant($btn-success-bg);
123+
}
124+
.card-warning-outline {
125+
@include card-outline-variant($btn-warning-bg);
126+
}
127+
.card-danger-outline {
128+
@include card-outline-variant($btn-danger-bg);
109129
}
110130

111131
//
112132
// Inverse text within a card for use with dark backgrounds
113133
//
114134

115135
.card-inverse {
116-
.card-header,
117-
.card-footer {
118-
border-bottom: $card-border-width solid rgba(255,255,255,.2);
119-
}
120-
.card-header,
121-
.card-footer,
122-
.card-title,
123-
.card-blockquote {
124-
color: #fff;
125-
}
126-
.card-link,
127-
.card-text,
128-
.card-blockquote > footer {
129-
color: rgba(255,255,255,.65);
130-
}
131-
.card-link {
132-
@include hover-focus {
133-
color: $card-link-hover-color;
134-
}
135-
}
136+
@include card-inverse;
136137
}
137138

138-
139139
//
140140
// Blockquote
141141
//

‎scss/mixins/_cards.scss

Lines changed: 34 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,38 @@
11
// Card variants
22

3-
@mixin card-variant($color) {
4-
background-color: $color;
3+
@mixin card-variant($background, $border) {
4+
background-color: $background;
5+
border-color: $border;
6+
}
7+
8+
@mixin card-outline-variant($color) {
9+
background-color: transparent;
510
border-color: $color;
611
}
12+
13+
//
14+
// Inverse text within a card for use with dark backgrounds
15+
//
16+
17+
@mixin card-inverse {
18+
.card-header,
19+
.card-footer {
20+
border-bottom: $card-border-width solid rgba(255,255,255,.2);
21+
}
22+
.card-header,
23+
.card-footer,
24+
.card-title,
25+
.card-blockquote {
26+
color: #fff;
27+
}
28+
.card-link,
29+
.card-text,
30+
.card-blockquote > footer {
31+
color: rgba(255,255,255,.65);
32+
}
33+
.card-link {
34+
@include hover-focus {
35+
color: $card-link-hover-color;
36+
}
37+
}
38+
}

0 commit comments

Comments
 (0)
0