diff --git a/met-web/src/components/Form/formio.scss b/met-web/src/components/Form/formio.scss index c5aed8a49..15e1c69b5 100644 --- a/met-web/src/components/Form/formio.scss +++ b/met-web/src/components/Form/formio.scss @@ -516,19 +516,35 @@ div[disabled] { } .BC-Gov-SecondaryButton { - background: none !important; - border-radius: 4px; - border: 2px solid #003366; - padding: 10px 30px; - text-align: center; + display: inline-flex; + -webkit-box-align: center; + align-items: center; + -webkit-box-pack: center; + justify-content: center; + position: relative; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent; + outline: 0px; + margin: 0px; + cursor: pointer; + user-select: none; + vertical-align: middle; + appearance: none; text-decoration: none; - display: block; - font-size: 18px; - font-family: ‘BCSans’, ‘Noto Sans’, Verdana, Arial, sans-serif; font-weight: 700; - letter-spacing: 1px; - cursor: pointer; - color: #003366 !important; + font-size: 1.125rem; + text-transform: none; + font-family: BCSans, 'Noto Sans', Verdana, Arial, sans-serif; + min-width: 64px; + padding: 5px 15px; + height: 40px; + transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, + box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; + color: rgb(0, 51, 102); + line-height: 1.1rem; + border: 2px solid rgb(0, 51, 102); + background-color: rgb(255, 255, 255); + border-radius: 4px; } .BC-Gov-SecondaryButton:hover { @@ -539,19 +555,37 @@ div[disabled] { } .BC-Gov-PrimaryButton { - background-color: #003366 !important; - border: none; - border-radius: 4px; - color: white !important; - padding: 12px 32px; - text-align: center; + display: inline-flex; + -webkit-box-align: center; + align-items: center; + -webkit-box-pack: center; + justify-content: center; + position: relative; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent; + outline: 0px; + border: 0px; + margin: 0px; + cursor: pointer; + user-select: none; + vertical-align: middle; + appearance: none; text-decoration: none; - display: block; - font-size: 18px; - font-family: ‘BCSans’, ‘Noto Sans’, Verdana, Arial, sans-serif; font-weight: 700; - letter-spacing: 1px; - cursor: pointer; + font-size: 1.125rem; + text-transform: none; + font-family: BCSans, 'Noto Sans', Verdana, Arial, sans-serif; + min-width: 64px; + padding: 6px 16px; + border-radius: 4px; + box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, + rgba(0, 0, 0, 0.12) 0px 1px 5px 0px; + height: 40px; + transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, + box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; + background-color: rgb(0, 51, 102); + color: rgb(255, 255, 255); + line-height: 1.1rem; } .BC-Gov-PrimaryButton:hover {