From f9899fbe167ac742cf128ef449a5e10e5413a137 Mon Sep 17 00:00:00 2001
From: Angel Garbarino <Monkeychip@users.noreply.github.com>
Date: Fri, 23 Jul 2021 10:11:53 -0600
Subject: [PATCH] Add fallback font for masked-input (#12152)

* add fallback font for higher unicode coverage

* remove extra mixin and fix color issue that was not working on binary
---
 ui/app/styles/app.scss                     |   3 +++
 ui/app/styles/core/forms.scss              |   3 +--
 ui/public/fonts/text-security-square.woff2 | Bin 0 -> 760 bytes
 3 files changed, 4 insertions(+), 2 deletions(-)
 create mode 100644 ui/public/fonts/text-security-square.woff2

diff --git a/ui/app/styles/app.scss b/ui/app/styles/app.scss
index d8385bb21d916..476acbdfe3a74 100644
--- a/ui/app/styles/app.scss
+++ b/ui/app/styles/app.scss
@@ -10,3 +10,6 @@
 }
 
 @include font-face('obscure');
+// Font comes from npm package: https://www.npmjs.com/package/text-security
+// We took the font we wanted and moved it into the ui/fonts folder
+@include font-face('text-security-square');
diff --git a/ui/app/styles/core/forms.scss b/ui/app/styles/core/forms.scss
index ceb3399d87d34..e4bb40e127448 100644
--- a/ui/app/styles/core/forms.scss
+++ b/ui/app/styles/core/forms.scss
@@ -12,10 +12,9 @@ label {
 }
 
 .masked-font {
-  font-family: obscure;
+  font-family: obscure, text-security-square;
   font-size: $size-medium;
   letter-spacing: 2px;
-  color: $ui-gray-300;
 }
 
 .label {
diff --git a/ui/public/fonts/text-security-square.woff2 b/ui/public/fonts/text-security-square.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..dcf806952bb2f281ec32ff75426ba0ef023478d8
GIT binary patch
literal 760
zcmV<U0tfwfPew8T0RR9100Q^`3IG5A00-0n00OQ60RR9100000000000000000000
z00006U;u&u3OGUw1^@vz0we<l1Rw>8R0l5`BnJ_NED`)T$W2pM#f3gii1S1=YwODz
zR}bs)@HvLQpQH@3s#nVj(DnQXCCW)eH93i3{3Nif9B~3*Q)j)OCSB(ccLKmMpg_rf
zTQ2y0m+H++Ko&6NQ|JJrx;e^aQm75!zR-cCHNbFAFbzwy(#SedfHbx(>7#qJfrP{n
z5+ZT*+#YgXk1HBT=h8;3eSaploA3qze$@N*&-+@tK3IUI)!w?bNUix$Jwra^@J=%-
zfDsU~R<!E?Ux7a0c_sLOf6oy7`&j=G0^uPcAtR%ppaBhNL?fEegl06O1ubYrE85V8
zcC@1d9q2?Sy3mDgbl(>eC`f2VJD`9NrEKWP?Y1!fM0-;2#UPMbPIs^E=$if3obx)o
zxrEnszX?xcdwf8aK)@##S0HO5FItcTBt()jGKsgS%{f_=7R=xwjF~~wX*;rc`&tW%
z27BFZZJeXoaCD;0<`_jsx*A6g>oipct^17sL{rrSj%CNdTHaIWKv*%(Q^GIl5_1I#
z{U-9SR;S?(EA{BcH7xUOI>-5W)rq9jqe3?91?sIC<$!sEt-qgP+fnD4-jPv>Uj)bS
zjld5qw|226As(BUX0^IjnUS-n`C1!{SuS*_8-bC|C)l%+J}846_Gof^Ni0CU3KWpb
z#Sob;82UNBHncB-NUL~Uvb7x?By@{Wktk=1auO3ryS?4r!_>5)=W8Kt`gwYotdECg
z@9uWpl}v{b)7LxbuUCUbn(_*vk?!6r%%`Z{!AMO|xS=l>B4t(*rg`#18!U{<!$&-?
zA4<kXB)<mLl+$u}q_0Z3ViMr=%t$gU&&b6cXlRsDQd6;a1if^)9ezv+R@sD=QYYPv
qarcgh%n27cdCHLTFse#r61eB$57gsMO8@{Qk(&23#qTs}0{{TI9#kv<

literal 0
HcmV?d00001