diff --git a/assets/css/cards--sky.css b/assets/css/cards--sky.css index 4c1fa33287bb85269b05ba2c587e8971bfc10692..3c6ac1da9fde537e125ee45100198ed273ba6311 100644 --- a/assets/css/cards--sky.css +++ b/assets/css/cards--sky.css @@ -226,10 +226,23 @@ .socialblue--sky .block-profile-statistic-block .follow-user-wrapper .flag-follow-user, .socialblue--sky .block-group-statistic-block .follow-user-wrapper .flag-follow-user { + position: relative; padding: 6px 12px; font-weight: 400; } +.socialblue--sky .block-profile-statistic-block .follow-user-wrapper .flag-follow-user .js-flag-message, +.socialblue--sky .block-group-statistic-block .follow-user-wrapper .flag-follow-user .js-flag-message { + display: none; +} + +.socialblue--sky .block-profile-statistic-block .follow-user-wrapper .flag-follow-user .ajax-throbber, +.socialblue--sky .block-group-statistic-block .follow-user-wrapper .flag-follow-user .ajax-throbber { + position: absolute; + top: 4px; + right: 10px; +} + .socialblue--sky .block-profile-statistic-block .follow-user-wrapper .hero-footer__cta, .socialblue--sky .block-group-statistic-block .follow-user-wrapper .hero-footer__cta { padding-bottom: 0; diff --git a/assets/css/teaser.css b/assets/css/teaser.css index bc7cdfd1e8a5fb2ba61f3c7a627b8786cc2bfd6d..55f49cfe3d14c02801019735b4c15a3236e795df 100644 --- a/assets/css/teaser.css +++ b/assets/css/teaser.css @@ -24,6 +24,20 @@ color: #343434; } +.teaser .flag-follow-user { + position: relative; +} + +.teaser .flag-follow-user .js-flag-message { + display: none; +} + +.teaser .flag-follow-user .ajax-throbber { + position: absolute; + top: 4px; + right: 10px; +} + @media (min-width: 600px) { .teaser__image { border-top-left-radius: inherit; diff --git a/components/02-atoms/cards/cards--sky.scss b/components/02-atoms/cards/cards--sky.scss index 4f5f1cd68f0ec4f9a08159f7ba902dc758e0b3a7..4e6126a1b01e1c621b8f393c446a6054e6e31660 100644 --- a/components/02-atoms/cards/cards--sky.scss +++ b/components/02-atoms/cards/cards--sky.scss @@ -282,9 +282,20 @@ } .flag-follow-user { + position: relative; padding: 6px 12px; font-weight: 400; + .js-flag-message { + display: none; + } + + .ajax-throbber { + position: absolute; + top: 4px; + right: 10px; + } + @include for-phone-only { margin-bottom: .5rem; } diff --git a/components/03-molecules/teaser/teaser.scss b/components/03-molecules/teaser/teaser.scss index e6802f5091658ef9c85bed581d0547b1c110f156..03be67d3596d712f24d588d73e090fe33d471dab 100644 --- a/components/03-molecules/teaser/teaser.scss +++ b/components/03-molecules/teaser/teaser.scss @@ -60,4 +60,19 @@ .badge__label { color: $default-color; } + + // Follow user button. + .flag-follow-user { + position: relative; + + .js-flag-message { + display: none; + } + + .ajax-throbber { + position: absolute; + top: 4px; + right: 10px; + } + } }