From 9e6a91e755d92d404685685581dacb4224a9e465 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Wed, 15 May 2019 16:51:30 -0400
Subject: [PATCH] refactor css for visibility tray
---
src/App.scss | 15 ++++-----------
.../post_status_form/post_status_form.vue | 8 --------
.../scope_selector/scope_selector.vue | 18 +++++++++++++++++-
3 files changed, 21 insertions(+), 20 deletions(-)
diff --git a/src/App.scss b/src/App.scss
index 7f895065..962087b5 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -626,17 +626,10 @@ nav {
}
.visibility-tray {
- font-size: 1.2em;
- cursor: pointer;
-
- .selected {
- color: $fallback--lightText;
- color: var(--lightText, $fallback--lightText);
- }
-
- div {
- padding-top: 5px;
- }
+ display: flex;
+ justify-content: space-between;
+ flex-direction: row-reverse;
+ padding-top: 5px;
}
.visibility-notice {
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index cb70d199..bdf15844 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -147,14 +147,6 @@
}
}
-.post-status-form {
- .visibility-tray {
- display: flex;
- justify-content: space-between;
- flex-direction: row-reverse;
- }
-}
-
.post-status-form, .login {
.form-bottom {
display: flex;
diff --git a/src/components/scope_selector/scope_selector.vue b/src/components/scope_selector/scope_selector.vue
index 33ea488f..5ebb5d56 100644
--- a/src/components/scope_selector/scope_selector.vue
+++ b/src/components/scope_selector/scope_selector.vue
@@ -1,5 +1,5 @@
<template>
-<div v-if="!showNothing">
+<div v-if="!showNothing" class="scope-selector">
<i class="icon-mail-alt"
:class="css.direct"
:title="$t('post_status.scope.direct')"
@@ -28,3 +28,19 @@
</template>
<script src="./scope_selector.js"></script>
+
+<style lang="scss">
+@import '../../_variables.scss';
+
+.scope-selector {
+ i {
+ font-size: 1.2em;
+ cursor: pointer;
+
+ &.selected {
+ color: $fallback--lightText;
+ color: var(--lightText, $fallback--lightText);
+ }
+ }
+}
+</style>