From 2cda9010df6192b008515b2138a2e071473bc40b Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Tue, 19 Mar 2019 04:53:11 -0400
Subject: add user reporting modal

---
 src/main.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

(limited to 'src/main.js')

diff --git a/src/main.js b/src/main.js
index 725f5806..92f843b1 100644
--- a/src/main.js
+++ b/src/main.js
@@ -12,6 +12,7 @@ import chatModule from './modules/chat.js'
 import oauthModule from './modules/oauth.js'
 import mediaViewerModule from './modules/media_viewer.js'
 import oauthTokensModule from './modules/oauth_tokens.js'
+import reportsModule from './modules/reports.js'
 
 import VueTimeago from 'vue-timeago'
 import VueI18n from 'vue-i18n'
@@ -75,7 +76,8 @@ const persistedStateOptions = {
       chat: chatModule,
       oauth: oauthModule,
       mediaViewer: mediaViewerModule,
-      oauthTokens: oauthTokensModule
+      oauthTokens: oauthTokensModule,
+      reports: reportsModule
     },
     plugins: [persistedState, pushNotifications],
     strict: false // Socket modifies itself, let's ignore this for now.
-- 
cgit v1.2.3-70-g09d2


From 6b1e305a181386be11fde996abe66e3be5a35600 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Thu, 28 Mar 2019 14:11:52 -0400
Subject: use custom scrollbar

---
 package.json                                       |  1 +
 src/App.scss                                       | 46 +++++++++++++++++++++-
 .../user_reporting_modal/user_reporting_modal.vue  | 11 ++++--
 src/main.js                                        |  2 +
 yarn.lock                                          |  4 ++
 5 files changed, 59 insertions(+), 5 deletions(-)

(limited to 'src/main.js')

diff --git a/package.json b/package.json
index fcdea2c1..36dfda31 100644
--- a/package.json
+++ b/package.json
@@ -35,6 +35,7 @@
     "vue-router": "^3.0.1",
     "vue-template-compiler": "^2.3.4",
     "vue-timeago": "^3.1.2",
+    "vuebar": "^0.0.20",
     "vuelidate": "^0.7.4",
     "vuex": "^3.0.1",
     "whatwg-fetch": "^2.0.3"
diff --git a/src/App.scss b/src/App.scss
index 07b33f47..6d16c7c9 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -794,4 +794,48 @@ nav {
       background-color: var(--lightBg, $fallback--fg);
     }
   }
-}
\ No newline at end of file
+}
+
+// Vuebar default style
+.vb > .vb-dragger {
+  z-index: 5;
+  width: 12px;
+  right: 0;
+}
+
+.vb > .vb-dragger > .vb-dragger-styler {
+  backface-visibility: hidden;
+  transform: rotate3d(0,0,0,0);
+  transition:
+    opacity 100ms ease-out,
+    margin 100ms ease-out,
+    height 100ms ease-out;
+
+  background-color: $fallback--text;
+  background-color: var(--text, $fallback--text);
+  opacity: .1;
+  margin: 5px 5px 5px 0;
+  border-radius: 20px;
+  height: calc(100% - 10px);
+  display: block;
+}
+
+.vb.vb-scrolling-phantom > .vb-dragger > .vb-dragger-styler {
+  opacity: .3;
+}
+
+.vb > .vb-dragger:hover > .vb-dragger-styler {
+  opacity: .5;
+  margin: 0px;
+  height: 100%;
+}
+
+.vb.vb-dragging > .vb-dragger > .vb-dragger-styler {
+  opacity: .5;
+  margin: 0px;
+  height: 100%;
+}
+
+.vb.vb-dragging-phantom > .vb-dragger > .vb-dragger-styler {
+  opacity: .5;
+}
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index becf882a..acd184cd 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -27,10 +27,12 @@
           </div>
         </div>
       </div>
-      <div class="user-reporting-panel-right">
-        <div v-for="status in statuses" :key="status.id" class="status-fadein user-reporting-panel-sitem">
-          <Status :inConversation="false" :focused="false" :statusoid="status" />
-          <Checkbox :checked="isChecked(status.id)" @change="checked => toggleStatus(checked, status.id)" />
+      <div class="user-reporting-panel-right" v-bar>
+        <div>
+          <div v-for="status in statuses" :key="status.id" class="status-fadein user-reporting-panel-sitem">
+            <Status :inConversation="false" :focused="false" :statusoid="status" />
+            <Checkbox :checked="isChecked(status.id)" @change="checked => toggleStatus(checked, status.id)" />
+          </div>
         </div>
       </div>
     </div>
@@ -111,6 +113,7 @@
     border-bottom-style: solid;
     border-color: $fallback--border;
     border-color: var(--border, $fallback--border);
+    padding-right: 15px;
 
     > .status-el {
       flex: 1;
diff --git a/src/main.js b/src/main.js
index 92f843b1..e01c921c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -16,6 +16,7 @@ import reportsModule from './modules/reports.js'
 
 import VueTimeago from 'vue-timeago'
 import VueI18n from 'vue-i18n'
+import Vuebar from 'vuebar'
 
 import createPersistedState from './lib/persisted_state.js'
 import pushNotifications from './lib/push_notifications_plugin.js'
@@ -42,6 +43,7 @@ Vue.use(VueTimeago, {
 Vue.use(VueI18n)
 Vue.use(VueChatScroll)
 Vue.use(VueClickOutside)
+Vue.use(Vuebar)
 
 const i18n = new VueI18n({
   // By default, use the browser locale, we will update it if neccessary
diff --git a/yarn.lock b/yarn.lock
index 69951563..0dd2173e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6491,6 +6491,10 @@ vue@^2.5.13:
   version "2.5.21"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.5.21.tgz#3d33dcd03bb813912ce894a8303ab553699c4a85"
 
+vuebar@^0.0.20:
+  version "0.0.20"
+  resolved "https://registry.yarnpkg.com/vuebar/-/vuebar-0.0.20.tgz#fd6313c2d3a2202c49e42419fe1d9ef126134200"
+
 vuelidate@^0.7.4:
   version "0.7.4"
   resolved "https://registry.yarnpkg.com/vuelidate/-/vuelidate-0.7.4.tgz#5a0e54be09ac0192f1aa3387d74b92e0945bf8aa"
-- 
cgit v1.2.3-70-g09d2


From 220a7e89d5087af3989975cb326cd4d8f60cbc6a Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Mon, 29 Apr 2019 14:37:08 -0400
Subject: use native scrollbar

---
 package.json                                       |  1 -
 src/App.js                                         |  9 +---
 src/App.scss                                       | 50 ----------------------
 src/App.vue                                        |  2 +-
 .../user_reporting_modal/user_reporting_modal.vue  |  5 ++-
 src/main.js                                        |  2 -
 yarn.lock                                          |  4 --
 7 files changed, 5 insertions(+), 68 deletions(-)

(limited to 'src/main.js')

diff --git a/package.json b/package.json
index 36dfda31..fcdea2c1 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,6 @@
     "vue-router": "^3.0.1",
     "vue-template-compiler": "^2.3.4",
     "vue-timeago": "^3.1.2",
-    "vuebar": "^0.0.20",
     "vuelidate": "^0.7.4",
     "vuex": "^3.0.1",
     "whatwg-fetch": "^2.0.3"
diff --git a/src/App.js b/src/App.js
index 87f00989..e72c73e3 100644
--- a/src/App.js
+++ b/src/App.js
@@ -39,14 +39,7 @@ export default {
         window.CSS.supports('-moz-mask-size', 'contain') ||
         window.CSS.supports('-ms-mask-size', 'contain') ||
         window.CSS.supports('-o-mask-size', 'contain')
-    ),
-    isMobile: navigator.userAgent.match(/Android/i) ||
-      navigator.userAgent.match(/webOS/i) ||
-      navigator.userAgent.match(/iPhone/i) ||
-      navigator.userAgent.match(/iPad/i) ||
-      navigator.userAgent.match(/iPod/i) ||
-      navigator.userAgent.match(/BlackBerry/i) ||
-      navigator.userAgent.match(/Windows Phone/i)
+    )
   }),
   created () {
     // Load the locale from the storage
diff --git a/src/App.scss b/src/App.scss
index adbe949c..921f2c3b 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -795,53 +795,3 @@ nav {
     }
   }
 }
-
-// Vuebar default style
-.vb > .vb-dragger {
-  z-index: 5;
-  width: 12px;
-  right: 0;
-}
-
-.vb > .vb-dragger > .vb-dragger-styler {
-  backface-visibility: hidden;
-  transform: rotate3d(0,0,0,0);
-  background-color: $fallback--text;
-  background-color: var(--text, $fallback--text);
-  opacity: .1;
-  margin: 5px 5px 5px 0;
-  border-radius: 20px;
-  height: calc(100% - 10px);
-  display: block;
-}
-
-.vb.vb-scrolling-phantom > .vb-dragger > .vb-dragger-styler {
-  opacity: .3;
-}
-
-.vb > .vb-dragger:hover > .vb-dragger-styler {
-  opacity: .5;
-  margin: 0px;
-  height: 100%;
-}
-
-.vb.vb-dragging > .vb-dragger > .vb-dragger-styler {
-  opacity: .5;
-  margin: 0px;
-  height: 100%;
-}
-
-.vb.vb-dragging-phantom > .vb-dragger > .vb-dragger-styler {
-  opacity: .5;
-}
-
-// Disable vuebar and use native scrollbar in mobile device
-#app.mobile {
-  .vb-content {
-    width: 100% !important;
-    padding-right: 0 !important;
-  }
-  .vb-dragger {
-    display: none;
-  }
-}
diff --git a/src/App.vue b/src/App.vue
index 229bf62b..cb7e8d78 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="app" v-bind:style="bgAppStyle" v-bind:class="{ mobile: isMobile }">
+  <div id="app" v-bind:style="bgAppStyle">
     <div class="app-bg-wrapper" v-bind:style="bgStyle"></div>
     <MobileNav v-if="isMobileLayout" />
     <nav v-else class='nav-bar container' @click="scrollToTop()" id="nav">
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 1cf25e8f..432dd14d 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -27,7 +27,7 @@
           </div>
         </div>
       </div>
-      <div class="user-reporting-panel-right" v-bar="{preventParentScroll: true}">
+      <div class="user-reporting-panel-right">
         <List :items="statuses">
           <template slot="item" slot-scope="{item}">
             <div class="status-fadein user-reporting-panel-sitem">
@@ -113,12 +113,12 @@
   &-right {
     display: flex;
     flex-direction: column;
+    overflow-y: auto;
   }
 
   &-sitem {
     display: flex;
     justify-content: space-between;
-    padding-right: 15px;
 
     > .status-el {
       flex: 1;
@@ -150,6 +150,7 @@
     &-right {
       width: 50%;
       flex: 1 1 auto;
+      margin-bottom: 12px;
     }
   }
 }
diff --git a/src/main.js b/src/main.js
index e01c921c..92f843b1 100644
--- a/src/main.js
+++ b/src/main.js
@@ -16,7 +16,6 @@ import reportsModule from './modules/reports.js'
 
 import VueTimeago from 'vue-timeago'
 import VueI18n from 'vue-i18n'
-import Vuebar from 'vuebar'
 
 import createPersistedState from './lib/persisted_state.js'
 import pushNotifications from './lib/push_notifications_plugin.js'
@@ -43,7 +42,6 @@ Vue.use(VueTimeago, {
 Vue.use(VueI18n)
 Vue.use(VueChatScroll)
 Vue.use(VueClickOutside)
-Vue.use(Vuebar)
 
 const i18n = new VueI18n({
   // By default, use the browser locale, we will update it if neccessary
diff --git a/yarn.lock b/yarn.lock
index 0dd2173e..69951563 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6491,10 +6491,6 @@ vue@^2.5.13:
   version "2.5.21"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.5.21.tgz#3d33dcd03bb813912ce894a8303ab553699c4a85"
 
-vuebar@^0.0.20:
-  version "0.0.20"
-  resolved "https://registry.yarnpkg.com/vuebar/-/vuebar-0.0.20.tgz#fd6313c2d3a2202c49e42419fe1d9ef126134200"
-
 vuelidate@^0.7.4:
   version "0.7.4"
   resolved "https://registry.yarnpkg.com/vuelidate/-/vuelidate-0.7.4.tgz#5a0e54be09ac0192f1aa3387d74b92e0945bf8aa"
-- 
cgit v1.2.3-70-g09d2