diff --git a/assets/css/src/components-plugin/_listing-newsletters.scss b/assets/css/src/components-plugin/_listing-newsletters.scss new file mode 100644 index 0000000000..5cd90a7386 --- /dev/null +++ b/assets/css/src/components-plugin/_listing-newsletters.scss @@ -0,0 +1,88 @@ +#newsletters_container { + h2.nav-tab-wrapper { + margin-bottom: 1rem; + } +} + +.mailpoet_stats_text { + font-size: 14px; + font-weight: 600; +} + +.mailpoet_stat_excellent { + color: $badge-color-excellent; +} + +.mailpoet_stat_good { + color: $badge-color-good; +} + +.mailpoet_stat_bad { + color: $badge-color-bad; +} + +.mailpoet_stat_hidden { + display: none; +} + +.mailpoet_stat_link_small { + font-size: .75rem; + text-decoration: underline !important; +} + +.mailpoet_badge { + border-radius: 3px; + color: white; + cursor: pointer; + font-size: .5625rem; + font-weight: 500; + letter-spacing: 1px; + margin-right: 4px; + padding: 4px 6px 3px; + text-transform: uppercase; + vertical-align: middle; +} + +.mailpoet_badge_excellent, +.mailpoet_badge_teal { + background: $badge-color-excellent; +} + +.mailpoet_badge_good, +.mailpoet_badge_yellow { + background: $badge-color-good; +} + +.mailpoet_badge_bad, +.mailpoet_badge_red { + background: $badge-color-bad; +} + +.mailpoet_badge_green { + background: $badge-color-green; +} + +.mailpoet_badge_video { + background: $badge-color-video-guide; + display: inline-block; + line-height: 20px; + padding: 3px 6px; + text-decoration: none; + vertical-align: top; + + &:hover, + &:active, + &:focus { + background: $badge-color-green; + color: #fff; + } + + .dashicons { + font-size: 14px; + line-height: 20px; + } +} + +.mailpoet_badge_video_grey { + background: #c3c3c3; +} diff --git a/assets/css/src/mailpoet-plugin.scss b/assets/css/src/mailpoet-plugin.scss index 2a7e66ebb5..7121c240e7 100644 --- a/assets/css/src/mailpoet-plugin.scss +++ b/assets/css/src/mailpoet-plugin.scss @@ -29,6 +29,7 @@ @import 'components-plugin/modal'; @import 'components-plugin/notice'; @import 'components-plugin/listing'; +@import 'components-plugin/listing-newsletters'; @import 'components-plugin/box'; @import 'components-plugin/breadcrumb'; @import 'components-plugin/forms';