bitwarden/jslib
1
0
Fork 0
mirror of https://github.com/bitwarden/jslib synced 2025-12-17 08:43:18 +00:00
Code Issues Releases Wiki Activity

Select an image to display for credit cards based on the brand. (#537)

Browse Source 
Co-authored-by: Hinton <oscar@oscarhinton.com>
This commit is contained in:
Linus Aarnio
2021-12-16 18:41:37 +01:00
committed by GitHub
parent 36b3aea758
commit e9666458c4
18 changed files with 67 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
angular/src/scss/icons.scss Normal file
View File

@@ -0,0 +1,44 @@
$card-icons-base: "~@bitwarden/jslib-angular/src/images/cards/";
$card-icons: (
"visa": $card-icons-base + "visa-light.png",
"amex": $card-icons-base + "amex-light.png",
"diners-club": $card-icons-base + "diners_club-light.png",
"discover": $card-icons-base + "discover-light.png",
"jcb": $card-icons-base + "jcb-light.png",
"maestro": $card-icons-base + "maestro-light.png",
"mastercard": $card-icons-base + "mastercard-light.png",
"union-pay": $card-icons-base + "union_pay-light.png",
);
$card-icons-dark: (
"visa": $card-icons-base + "visa-dark.png",
"amex": $card-icons-base + "amex-dark.png",
"diners-club": $card-icons-base + "diners_club-dark.png",
"discover": $card-icons-base + "discover-dark.png",
"jcb": $card-icons-base + "jcb-dark.png",
"maestro": $card-icons-base + "maestro-dark.png",
"mastercard": $card-icons-base + "mastercard-dark.png",
"union-pay": $card-icons-base + "union_pay-dark.png",
);
.credit-card-icon {
display: block; // Resolves the parent container being slighly to big
height: 19px;
width: 24px;
background-size: contain;
background-repeat: no-repeat;
}
@each $name, $url in $card-icons {
.card-#{$name} {
background-image: url("#{$url}");
}
}
@each $theme in $dark-icon-themes {
@each $name, $url in $card-icons-dark {
.#{$theme} .card-#{$name} {
background-image: url("#{$url}");
}
}
}