From 7efced17e561d039310fed7c80bf845b97313b09 Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Tue, 3 Apr 2018 19:48:02 +0800
Subject: [PATCH] refactor(naming): extract name

---
 src/components/{GitakoSideBar.js => SideBar.js} |  2 +-
 src/content.js                                  |  8 ++++----
 src/content.less                                | 16 +++++++++-------
 3 files changed, 14 insertions(+), 12 deletions(-)
 rename src/components/{GitakoSideBar.js => SideBar.js} (98%)

diff --git a/src/components/GitakoSideBar.js b/src/components/SideBar.js
similarity index 98%
rename from src/components/GitakoSideBar.js
rename to src/components/SideBar.js
index fc61bc2..60de556 100644
--- a/src/components/GitakoSideBar.js
+++ b/src/components/SideBar.js
@@ -12,7 +12,7 @@ import GitHubHelper, { NOT_FOUND } from '../utils/GitHubHelper'
 import storageHelper from '../utils/storageHelper'
 import URLHelper from '../utils/URLHelper'
 
-export default class GitakoSideBar extends preact.Component {
+export default class SideBar extends preact.Component {
   state = {
     // whether Gitako side bar should be shown
     shouldShow: false,
diff --git a/src/content.js b/src/content.js
index ece2f7a..ad6f38b 100644
--- a/src/content.js
+++ b/src/content.js
@@ -3,8 +3,8 @@ import preact from 'preact'
 
 import './content.less'
 
-import GitakoSideBar from './components/GitakoSideBar'
+import SideBar from './components/SideBar'
 
-const GitakoSideBarElement = document.createElement('div')
-document.body.appendChild(GitakoSideBarElement)
-preact.render(<GitakoSideBar />, GitakoSideBarElement)
+const SideBarElement = document.createElement('div')
+document.body.appendChild(SideBarElement)
+preact.render(<SideBar />, SideBarElement)
diff --git a/src/content.less b/src/content.less
index ec207fd..16f467b 100644
--- a/src/content.less
+++ b/src/content.less
@@ -1,8 +1,10 @@
+@name: gitako;
+
 @side-bar-width: 260px;
 @github-content-width: 1280px;
 @content-width: (@side-bar-width + @github-content-width);
 
-.with-gitako-spacing {
+.with-@{name}-spacing {
   margin-left: @side-bar-width;
   @media (min-width: @github-content-width) and (max-width: @content-width) {
     margin-left: ~'calc(' @content-width ~' - 100vw)';
@@ -63,8 +65,8 @@
   visibility: hidden;
 }
 
-.gitako {
-  .gitako-side-bar {
+.@{name} {
+  .@{name}-side-bar {
     position: fixed;
     top: 0;
     left: 0;
@@ -85,10 +87,10 @@
       .hidden;
     }
 
-    .gitako-logo-wrapper.Header {
+    .@{name}-logo-wrapper.Header {
       position: relative;
 
-      .gitako-logo {
+      .@{name}-logo {
         display: flex;
         justify-content: space-around;
         align-items: center;
@@ -145,7 +147,7 @@
       color: rgba(3, 47, 98, 0.55);
     }
 
-    .gitako-side-bar-content {
+    .@{name}-side-bar-content {
       display: flex;
       flex: 1;
       flex-direction: column;
@@ -238,7 +240,7 @@
       }
     }
 
-    .gitako-settings-bar {
+    .@{name}-settings-bar {
       border-top: 1px solid #eaecef;
       &-content {
         padding: 0 10px;