Skip to content

Commit

Permalink
fix: credential watermark in wallet and verifier (#1124)
Browse files Browse the repository at this point in the history
Signed-off-by: Bryce McMath <[email protected]>
  • Loading branch information
bryce-mcmath authored Apr 2, 2024
1 parent 3b63696 commit c99877a
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 24 deletions.
25 changes: 10 additions & 15 deletions packages/legacy/core/App/components/misc/CredentialCard11.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -225,16 +225,19 @@ const CredentialCard11: React.FC<CredentialCard11Props> = ({
},
})

const colorIfErrorState = () =>
error || predicateError || isProofRevoked
? ColorPallet.notification.errorBorder
: styles.secondaryBodyContainer.backgroundColor
const backgroundColorIfErrorState = (backgroundColor?: string) =>
error || predicateError || isProofRevoked ? ColorPallet.notification.errorBorder : backgroundColor

const fontColorWithHighContrast = () => {
const c = colorIfErrorState() ?? ColorPallet.grayscale.lightGrey
if (proof) {
return ColorPallet.grayscale.mediumGrey
}

const c =
backgroundColorIfErrorState(overlay.brandingOverlay?.primaryBackgroundColor) ?? ColorPallet.grayscale.lightGrey
const shade = shadeIsLightOrDark(c)

return shade == Shade.Light ? ColorPallet.grayscale.darkGrey : ColorPallet.grayscale.mediumGrey
return shade == Shade.Light ? ColorPallet.grayscale.darkGrey : ColorPallet.grayscale.lightGrey
}

const parseAttribute = (item: (Attribute & Predicate) | undefined) => {
Expand Down Expand Up @@ -522,19 +525,11 @@ const CredentialCard11: React.FC<CredentialCard11Props> = ({
style={[
styles.secondaryBodyContainer,
{
backgroundColor: colorIfErrorState(),
backgroundColor: backgroundColorIfErrorState(styles.secondaryBodyContainer.backgroundColor),
overflow: 'hidden',
},
]}
>
{overlay.metaOverlay?.watermark && (
<CardWatermark
width={dimensions.cardWidth}
height={dimensions.cardHeight}
style={{ color: fontColorWithHighContrast() }}
watermark={overlay.metaOverlay?.watermark}
/>
)}
{overlay.brandingOverlay?.backgroundImageSlice && !displayItems ? (
<ImageBackground
source={toImageSource(overlay.brandingOverlay?.backgroundImageSlice)}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,9 @@ const VerifierCredentialCard: React.FC<VerifierCredentialCardProps> = ({
const borderRadius = 10
const padding = width * 0.05
const logoHeight = width * 0.12
const [dimensions, setDimensions] = useState({ cardWidth: 0, cardHeight: 0 })
const { i18n, t } = useTranslation()
const { TextTheme } = useTheme()
const { ColorPallet, TextTheme } = useTheme()
const { OCABundleResolver } = useConfiguration()
const [overlay, setOverlay] = useState<CredentialOverlay<BrandingOverlay>>({})

Expand All @@ -67,8 +68,6 @@ const VerifierCredentialCard: React.FC<VerifierCredentialCardProps> = ({
return { ...prev, [curr.name]: curr.format }
}, {})

const [dimensions, setDimensions] = useState({ cardWidth: 0, cardHeight: 0 })

const styles = StyleSheet.create({
container: {
backgroundColor: overlay.brandingOverlay?.primaryBackgroundColor,
Expand Down Expand Up @@ -115,11 +114,6 @@ const VerifierCredentialCard: React.FC<VerifierCredentialCardProps> = ({
color: TextTheme.normal.color,
flexShrink: 1,
},
watermark: {
opacity: 0.16,
fontSize: 22,
transform: [{ rotate: '-30deg' }],
},
})

const parseAttribute = (item: (Attribute & Predicate) | undefined) => {
Expand Down Expand Up @@ -422,7 +416,7 @@ const VerifierCredentialCard: React.FC<VerifierCredentialCardProps> = ({
<CardWatermark
width={dimensions.cardWidth}
height={dimensions.cardHeight}
style={styles.watermark}
style={{ color: ColorPallet.grayscale.mediumGrey }}
watermark={overlay.metaOverlay?.watermark}
/>
)}
Expand Down

0 comments on commit c99877a

Please sign in to comment.