diff --git a/app/soapbox/actions/soapbox.js b/app/soapbox/actions/soapbox.js index e732b1f401..7e03a1e52b 100644 Binary files a/app/soapbox/actions/soapbox.js and b/app/soapbox/actions/soapbox.js differ diff --git a/app/soapbox/features/crypto_donate/components/crypto_donate_panel.js b/app/soapbox/features/crypto_donate/components/crypto_donate_panel.js new file mode 100644 index 0000000000..b63acdad11 Binary files /dev/null and b/app/soapbox/features/crypto_donate/components/crypto_donate_panel.js differ diff --git a/app/soapbox/features/crypto_donate/components/site_wallet.js b/app/soapbox/features/crypto_donate/components/site_wallet.js index 3e5d30bc55..5e5e3fa696 100644 Binary files a/app/soapbox/features/crypto_donate/components/site_wallet.js and b/app/soapbox/features/crypto_donate/components/site_wallet.js differ diff --git a/app/soapbox/pages/home_page.js b/app/soapbox/pages/home_page.js index 50233bb70c..4357521960 100644 Binary files a/app/soapbox/pages/home_page.js and b/app/soapbox/pages/home_page.js differ diff --git a/app/styles/components/crypto-donate.scss b/app/styles/components/crypto-donate.scss index 10289e976c..2fd6b7fd61 100644 --- a/app/styles/components/crypto-donate.scss +++ b/app/styles/components/crypto-donate.scss @@ -67,3 +67,35 @@ padding: 10px 0; } } + +.crypto-donate-panel { + &__message { + margin: 20px 0; + margin-top: -12px; + font-size: 14px; + } + + .site-wallet { + display: block; + padding-bottom: 10px; + } + + .crypto-address { + padding: 0; + margin: 20px 0; + + &:first-child { + margin-top: 0; + } + + &:last-child { + margin-bottom: 0; + } + } + + &--has-more { + .site-wallet { + padding-bottom: 0; + } + } +} diff --git a/app/styles/components/wtf-panel.scss b/app/styles/components/wtf-panel.scss index bad152f994..ce46a038af 100644 --- a/app/styles/components/wtf-panel.scss +++ b/app/styles/components/wtf-panel.scss @@ -129,4 +129,23 @@ } } } + + &__expand-btn { + display: block; + width: 100%; + height: 100%; + max-height: 46px; + position: relative; + border-top: 1px solid; + border-color: var(--brand-color--faint); + transition: max-height 150ms ease; + overflow: hidden; + opacity: 1; + text-align: center; + line-height: 46px; + font-size: 14px; + cursor: pointer; + color: var(--primary-text-color); + text-decoration: none; + } }