From 55113b6b60609e2639354264eb74a87374b974e9 Mon Sep 17 00:00:00 2001
From: Xmader <xmader@outlook.com>
Date: Thu, 12 Nov 2020 12:35:11 -0500
Subject: [PATCH] refactor: btn style

---
 src/btn.css | 46 ++++++++++++++++++++++++++++++++++++++++++++++
 src/btn.ts  | 10 ++++++----
 2 files changed, 52 insertions(+), 4 deletions(-)
 create mode 100644 src/btn.css

diff --git a/src/btn.css b/src/btn.css
new file mode 100644
index 0000000..48ca29e
--- /dev/null
+++ b/src/btn.css
@@ -0,0 +1,46 @@
+div {
+  flex-wrap: wrap;
+  display: flex;
+  align-items: center;
+  font-family: 'Open Sans', 'Roboto', 'Helvetica neue', Helvetica, sans-serif;
+}
+
+button {
+  width: 205px !important;
+  height: 38px;
+
+  color: #fff;
+  background: #1f74bd;
+
+  cursor: pointer;
+
+  margin-bottom: 4px;
+  margin-right: 4px;
+  padding: 4px 12px;
+
+  justify-content: start;
+  align-self: center;
+
+  font-size: 16px;
+  border-radius: 2px;
+  border: 0;
+
+  display: inline-flex;
+  position: relative;
+
+  font-family: inherit;
+}
+
+svg {
+  display: inline-block;
+  margin-right: 5px;
+  width: 20px;
+  height: 20px;
+  margin-top: auto;
+  margin-bottom: auto;
+}
+
+span {
+  margin-top: auto;
+  margin-bottom: auto;
+}
\ No newline at end of file
diff --git a/src/btn.ts b/src/btn.ts
index e46073c..cfdb803 100644
--- a/src/btn.ts
+++ b/src/btn.ts
@@ -1,6 +1,8 @@
 
 import { loadMscore, WebMscore } from './mscore'
 import i18n from './i18n'
+// @ts-ignore
+import btnListCss from './btn.css'
 
 type BtnElement = HTMLButtonElement
 
@@ -85,10 +87,10 @@ export class BtnList {
       : document.createElement('div')
     const shadow = parent.attachShadow({ mode: 'closed' })
 
-    // style the shadow DOM from outside css
-    document.head.querySelectorAll('style').forEach(s => {
-      shadow.append(s.cloneNode(true))
-    })
+    // style the shadow DOM
+    const style = document.createElement('style')
+    style.innerText = btnListCss
+    shadow.append(style)
 
     // hide buttons using the shadow DOM
     const newParent = btnParent.cloneNode(false) as HTMLDivElement