diff --git a/client/coral-embed-stream/style/default.css b/client/coral-embed-stream/style/default.css index bf55bde7d..5b1e2b69e 100644 --- a/client/coral-embed-stream/style/default.css +++ b/client/coral-embed-stream/style/default.css @@ -198,7 +198,36 @@ hr { /* Flag Styles */ +.coral-plugin-flags-popup { + min-width: 100px; +} + +.coral-plugin-flags-popup-form { + margin-bottom: 10px; +} + .coral-plugin-flags-popup-header { font-weight: bolder; + font-size: 16px; + margin-bottom: 10px; +} + +.coral-plugin-flags-popup-radio { + margin:5px; +} + +.coral-plugin-flags-popup-radio-label { + margin:5px; font-size: 14px; } + +.coral-plugin-flags-popup-counter { + float: left; + margin-top: 21px; + color: #999; +} + +.coral-plugin-flags-popup-button { + float: right; + margin-top: 10px; +} diff --git a/client/coral-plugin-flags/FlagButton.js b/client/coral-plugin-flags/FlagButton.js index 1eafc1d09..da508bf3d 100644 --- a/client/coral-plugin-flags/FlagButton.js +++ b/client/coral-plugin-flags/FlagButton.js @@ -46,17 +46,18 @@ export default class FlagButton extends Component { return
{ this.state.showMenu && - - {lang.t('report-header')} -
- Flag username
- Flag comment
+ +
{lang.t('report-header')}
+ + +
+ +
-