Rename extension to proper name

README.md

@@ -0,0 +1,21 @@
+# Conventional Comments button
+
+This is a tiny Chrome extension that adds a conventional comment button to GitLab file explorer comments, allowing to quickly leave a structured semantic comment during your MR reviews!
+
+## How to install
+
+This is a chrome extension, recently chrome disallowed to install packed `crx` extension that are not listed on the Chrome Store, so to install this
+
+- `git clone git@gitlab.com:conventionalcomments/conventional-comment-button.git`
+- On Chrome: Menu
+  -- More Tools
+  --- Extensions
+- In the Extension page: `Load unpacked` and select the cloned repository
+
+## How to update
+
+- `git pull`
+- On Chrome: Menu
+  -- More Tools
+  --- Extensions
+- In the Extension page find `conventional comments button` and hit the refresh button

manifest.json

@@ -1,9 +1,9 @@
 {
-  "name": "Semantic review comments button",
+  "name": "Conventional comments button",
   "version": "0.0.1",
   "manifest_version": 2,
-  "description": "An extension to add quick semantic review comments",
-  "homepage_url": "http://extensionizr.com",
+  "description": "An extension to quickly add conventional comments",
+  "homepage_url": "http://https://conventionalcomments.org/",
   "icons": {
     "16": "icons/icon16.png",
     "48": "icons/icon48.png",

src/inject/inject.css

@@ -1,8 +1,4 @@
-/**
- * Place your custom CSS styles here.
- **/
-
-#semanticButtonContainer {
+#conventionalCommentButtonContainer {
   display: flex;
   align-items: flex-end;
   position: absolute;
@@ -11,29 +7,29 @@
   opacity: 0;
   width: 25px;
   height: 60px;
-  transition: all 0.5s;
+  transition: all 0.3s;
   overflow: hidden;
 }
 
-#semanticButtonContainer:hover {
+#conventionalCommentButtonContainer:hover {
   width: 300px;
   opacity: 1;
 }
 
-#semanticButtonContainer .buttonContainer {
+#conventionalCommentButtonContainer .buttonContainer {
   display: flex;
   flex-direction: column-reverse;
   height: 25px;
   width: 25px;
   overflow: hidden;
-  transition: all 0.5s;
+  transition: all 0.3s;
 }
 
-#semanticButtonContainer .buttonContainer:hover {
+#conventionalCommentButtonContainer .buttonContainer:hover {
   height: 60px;
 }
 
-#semanticButtonContainer button {
+#conventionalCommentButtonContainer button {
   margin-right: 0.5rem;
   border: none;
   height: 25px;
@@ -41,10 +37,10 @@
   outline: 0;
 }
 
-#semanticButtonContainer button:focus {
+#conventionalCommentButtonContainer button:focus {
   outline: 0;
 }
 
-#semanticButtonContainer button i.blocking {
+#conventionalCommentButtonContainer button i.blocking {
   color: red;
 }

src/inject/inject.js

@@ -42,7 +42,7 @@ const semanticButtonClickHandler = (e, { textarea, label, blocking }) => {
   const semanticComment = semanticCommentStructure
     .replace("%label", label)
     .replace("%decoration", blocking ? "" : " (non-blocking)");
-  if (textarea.value && !textarea.value.includes(":** <subject>")) {
+  if (textarea.value && !textarea.value.endsWith(":** <subject>")) {
     if (
       window.confirm("Are you sure you want to replace the current comment?")
     ) {
@@ -81,7 +81,7 @@ const buttonPairGenerator = (textarea, parent, label) => {
 const addSemanticButton = (element) => {
   const parent = element.closest("div");
   const container = document.createElement("div");
-  container.id = "semanticButtonContainer";
+  container.id = "conventionalCommentButtonContainer";
 
   Object.keys(semanticLabels).forEach((label) => {
     buttonPairGenerator(element, container, label);