diff --git a/css/reskin-2/paymentHistory.css b/css/reskin-2/paymentHistory.css index 761a0b460..594ff5b6e 100644 --- a/css/reskin-2/paymentHistory.css +++ b/css/reskin-2/paymentHistory.css @@ -68,14 +68,16 @@ body { .page-header .back-btn .arrow-prev-icon { content: url('/i/reskin-2/arrow-prev.svg'); } - .page-header .how-to-get-paid { - order: -1; - align-self: flex-end; + .page-header .page-header-right { + display: flex; + align-items: center; + column-gap: 24px; + } + .page-header .page-header-right .how-to-get-paid { text-transform: uppercase; - padding: 0 !important; } - .page-header .how-to-get-paid a { + .page-header .page-header-right .how-to-get-paid a { font-family: Roboto; font-weight: 700; font-size: 16px; @@ -84,9 +86,27 @@ body { display: block; } - .page-header .how-to-get-paid a:hover { + .page-header .page-header-right .how-to-get-paid a:hover { text-shadow: none; } + .page-header .page-header-right .payment-settings-btn { + padding: 0px 16px; + background: var(--tc-white); + border: 1.5px solid var(--green); + border-radius: 24px; + } + .page-header .page-header-right .payment-settings-btn a { + font-family: 'Roboto'; + font-style: normal; + font-weight: 700; + font-size: 12px; + line-height: 24px; + + letter-spacing: 0.008em; + text-transform: uppercase; + + color: var(--green); + } .page-header .divider { width: 100%; height: 2px; diff --git a/css/reskin-2/paymentStatusSummary.css b/css/reskin-2/paymentStatusSummary.css index db2971900..5fc78e280 100644 --- a/css/reskin-2/paymentStatusSummary.css +++ b/css/reskin-2/paymentStatusSummary.css @@ -63,14 +63,16 @@ body { .page-header .back-btn .arrow-prev-icon { content: url('/i/reskin-2/arrow-prev.svg'); } - .page-header .how-to-get-paid { - order: -1; - align-self: flex-end; + .page-header .page-header-right { + display: flex; + align-items: center; + column-gap: 24px; + } + .page-header .page-header-right .how-to-get-paid { text-transform: uppercase; - padding: 0 !important; } - .page-header .how-to-get-paid a { + .page-header .page-header-right .how-to-get-paid a { font-family: Roboto; font-weight: 700; font-size: 16px; @@ -79,9 +81,27 @@ body { display: block; } - .page-header .how-to-get-paid a:hover { + .page-header .page-header-right .how-to-get-paid a:hover { text-shadow: none; } + .page-header .page-header-right .payment-settings-btn { + padding: 0px 16px; + background: var(--tc-white); + border: 1.5px solid var(--green); + border-radius: 24px; + } + .page-header .page-header-right .payment-settings-btn a { + font-family: 'Roboto'; + font-style: normal; + font-weight: 700; + font-size: 12px; + line-height: 24px; + + letter-spacing: 0.008em; + text-transform: uppercase; + + color: var(--green); + } .page-header .divider { width: 100%; height: 2px;