Merge pull request #121 from koedame/release/v2.2.0

Release/v2.2.0

CHANGELOGS.md

@@ -1,5 +1,21 @@
 # CHANGELOGS
 
+## v2.2.0
+
+### 新規
+
+- コンタクトフォームを追加
+- 動画リンク編集ボタンを追加
+- タイトルタグを設定
+- 楽曲ページにスケルトンを設定
+- ボタンにアイコンを追加
+
+### 変更
+
+- ChordPro パーサーを修正
+- グローバルな CSS をレイアウトに統一
+- キーの装飾を控えめに
+
 ## v2.1.0
 
 ### 新規

package.json

@@ -1,6 +1,6 @@
 {
   "name": "chordwiki-plus",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "author": "",
   "engines": {
     "node": ">=10"
@@ -38,6 +38,7 @@
     "query-string": "^6.13.3",
     "v-clipboard": "^2.2.3",
     "vue": "^2.6.12",
+    "vue-meta": "^2.4.0",
     "vue-moment": "^4.1.0",
     "vue-router": "^3.4.5",
     "vuex": "^3.0.1",

src/content_script/App.vue

@@ -1,16 +1,29 @@
 <template lang="pug">
 #syncroom-plus-app
   router-view
+
+  b-button#form-button(type="is-warning", icon-left="exclamation-triangle", @click="openContactFrom")
+    strong 要望・不具合報告はこちら
+
   CustomFooter
 </template>
 
 <script>
 import CustomFooter from './components/CustomFooter';
+import ContactForm from './components/ContactForm';
 
 export default {
   components: {
     CustomFooter,
   },
+  methods: {
+    openContactFrom() {
+      this.$buefy.modal.open({
+        parent: this,
+        component: ContactForm,
+      });
+    },
+  },
 };
 </script>
 
@@ -63,9 +76,9 @@ $navbar-breakpoint: $tablet
   height: 2em
 
 .key
-  background: #f14668
+  background: #feecf0
   border-radius: 2px
-  color: #fff
+  color: #cc0f35
   padding: 0 8px
   font-weight: bold
   display: inline-block
@@ -97,4 +110,12 @@ $navbar-breakpoint: $tablet
 
 .icon
   vertical-align: bottom
+
+.chordwiki-plus-song-page-tags
+  margin-bottom: 1em
+
+#form-button
+  position: fixed
+  bottom: 20px
+  right: 12px
 </style>

src/content_script/app.ts

@@ -22,6 +22,9 @@ Vue.use(Buefy, {
 import Clipboard from 'v-clipboard';
 Vue.use(Clipboard);
 
+import VueMeta from 'vue-meta';
+Vue.use(VueMeta);
+
 import store from '../store';
 
 const SongPageElement = document.createElement('app');

src/content_script/components/ContactForm.vue

@@ -0,0 +1,17 @@
+<template lang="pug">
+.card
+  iframe.syncroom-plus-contact-form(
+    src="https://docs.google.com/forms/d/e/1FAIpQLSfxYcMSm4SCBHc21vW_TXRbouSVyLcBj4vT5550pCSOCBSlYQ/viewform?embedded=true",
+    frameborder="0",
+    marginheight="0",
+    marginwidth="0"
+  ) 読込中
+</template>
+
+<script></script>
+
+<style lang="sass" scoped>
+.syncroom-plus-contact-form
+  width: 100%
+  height: 70vh
+</style>

src/content_script/pages/Home.vue

@@ -50,8 +50,9 @@
                 | 検索
 
       .buttons.tags-buttons
-        | 人気のタグ：
-        b-button(type="is-light", v-for="tag in popularTags", tag="a", :href="tag.link", :key="tag.title", size="is-small") {{tag.title}}
+        span
+          | 人気のタグ：
+        b-button(type="is-light", v-for="tag in popularTags", tag="a", :href="tag.link", :key="tag.title", size="is-small", icon-left="tag") {{tag.title}}
 
   .container
     .section
@@ -179,6 +180,10 @@ export default {
       });
     },
   },
+
+  metaInfo: {
+    title: 'ChordWiki',
+  },
 };
 </script>