From 2757829dadfcdd30572f205acefdc5a32aef8454 Mon Sep 17 00:00:00 2001
From: Agriya Dev5 <agriya.dev5@agriya.in>
Date: Fri, 8 Jan 2021 18:13:15 +0530
Subject: [PATCH 1/6] #44 Text font dropdown is broken

---
 src/editor/components/seList.js     |  7 ++-----
 src/editor/components/seListItem.js |  4 +++-
 src/editor/index.html               | 16 ++++++++--------
 3 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/src/editor/components/seList.js b/src/editor/components/seList.js
index 66bbfd17..a069e760 100644
--- a/src/editor/components/seList.js
+++ b/src/editor/components/seList.js
@@ -4,16 +4,13 @@ import 'elix/define/DropdownList.js';
 const template = document.createElement('template');
 template.innerHTML = `
 <style>
-[part~="source"] {
-  grid-template-columns: 20px 1fr auto;
+::part(popup-toggle) {
+  display: none;
 }
 ::slotted(*) {
   background: #E8E8E8;
   border: 1px solid #B0B0B0;
 }
-::part(popup-toggle) {
-  display: none;
-}
 </style>
   <label>Label</label>
   <elix-dropdown-list>
diff --git a/src/editor/components/seListItem.js b/src/editor/components/seListItem.js
index 846d4e76..c23f01b5 100644
--- a/src/editor/components/seListItem.js
+++ b/src/editor/components/seListItem.js
@@ -21,7 +21,9 @@ export class SeListItem extends HTMLElement {
     // create the shadowDom and insert the template
     this._shadowRoot = this.attachShadow({mode: 'open'});
     this._shadowRoot.append(template.content.cloneNode(true));
-    this.$menuitem = this._shadowRoot.querySelector('elix-menu-item');
+    this.$menuitem = this._shadowRoot.querySelector('elix-option');
+    this.$svg = this.$menuitem.shadowRoot.querySelector('#checkmark');
+    this.$svg.setAttribute('style', 'display: none;');
   }
   /**
    * @function observedAttributes
diff --git a/src/editor/index.html b/src/editor/index.html
index 5592933f..9e77520a 100644
--- a/src/editor/index.html
+++ b/src/editor/index.html
@@ -248,14 +248,14 @@
             <se-button id="tool_text_anchor_end" title="Align the text from end" src="./images/anchor_end.svg"></se-button>
           </div>
           <se-list id="tool_font_family" label="Font:">
-            <se-list-item value="Sans-serif"> <div style="font-family:serif">Sans-serif</div></se-list-item>
-            <se-list-item value="Serif"> <div style="font-family:serif">Serif</div></se-list-item>
-            <se-list-item value="Cursive"> <div style="font-family:serif">Cursive</div></se-list-item>
-            <se-list-item value="Fantasy"> <div style="font-family:serif">Fantasy</div></se-list-item>
-            <se-list-item value="Monospace"> <div style="font-family:serif">Monospace</div></se-list-item>
-            <se-list-item value="Courier"> <div style="font-family:serif">Courier</div></se-list-item>
-            <se-list-item value="Helvetica"> <div style="font-family:serif">Helvetica</div></se-list-item>
-            <se-list-item value="Times"> <div style="font-family:serif">Times</div></se-list-item> 
+            <se-list-item value="Sans-serif" style="font-family:serif;"> Sans-serif</se-list-item>
+            <se-list-item value="Serif" style="font-family:sans-serif;"> Serif</se-list-item>
+            <se-list-item value="Cursive" style="font-family:cursive;"> Cursive</se-list-item>
+            <se-list-item value="Fantasy" style="font-family:fantasy;"> Fantasy</se-list-item>
+            <se-list-item value="Monospace" style="font-family:monospace;"> Monospace</se-list-item>
+            <se-list-item value="Courier" style="font-family:courier;"> Courier</se-list-item>
+            <se-list-item value="Helvetica" style="font-family:helvetica;">Helvetica</se-list-item>
+            <se-list-item value="Times" style="font-family:times;">Times</se-list-item> 
           </se-list>
           <se-spin-input size="2" id="font_size" min=1 max=1000 step=1 title="Change Font Size"
             src="./images/fontsize.svg"></se-spin-input>

From f89d348282de1d548919ebf97beb28795c72aff6 Mon Sep 17 00:00:00 2001
From: agriyadev5 <agriya.dev5@agriya.in>
Date: Fri, 8 Jan 2021 21:15:16 +0530
Subject: [PATCH 2/6] Fixes #44: Text font dropdown fixed

---
 src/editor/components/seList.js     | 4 +++-
 src/editor/components/seListItem.js | 3 +++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/editor/components/seList.js b/src/editor/components/seList.js
index a069e760..d41050d0 100644
--- a/src/editor/components/seList.js
+++ b/src/editor/components/seList.js
@@ -9,7 +9,8 @@ template.innerHTML = `
 }
 ::slotted(*) {
   background: #E8E8E8;
-  border: 1px solid #B0B0B0;
+  padding:0;
+  /*border: 1px solid #B0B0B0;*/
 }
 </style>
   <label>Label</label>
@@ -81,6 +82,7 @@ export class SeList extends HTMLElement {
    */
   connectedCallback () {
     const currentObj = this;
+    this.$dropdown.addEventListener('close', (e) => {      this.$dropdown.open();    });
     this.$dropdown.addEventListener('selectedindexchange', (e) => {
       e.preventDefault();
       if (e?.detail?.selectedIndex !== undefined) {
diff --git a/src/editor/components/seListItem.js b/src/editor/components/seListItem.js
index c23f01b5..7c2a459b 100644
--- a/src/editor/components/seListItem.js
+++ b/src/editor/components/seListItem.js
@@ -4,6 +4,9 @@ import 'elix/define/Option.js';
 const template = document.createElement('template');
 template.innerHTML = `
   <style>
+  elix-option{  
+    padding:0.25rem 0.125rem !important;
+  }
   </style>  
   <elix-option aria-label="option">
     <slot></slot>

From 0769e44705fbd6b7d826fa6ca9d4bef6225da2b2 Mon Sep 17 00:00:00 2001
From: agriyadev5 <agriya.dev5@agriya.in>
Date: Fri, 8 Jan 2021 21:18:46 +0530
Subject: [PATCH 3/6] Fixes #44: Text font dropdown fixed

---
 src/editor/components/seList.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/editor/components/seList.js b/src/editor/components/seList.js
index d41050d0..9ba24b2b 100644
--- a/src/editor/components/seList.js
+++ b/src/editor/components/seList.js
@@ -82,7 +82,6 @@ export class SeList extends HTMLElement {
    */
   connectedCallback () {
     const currentObj = this;
-    this.$dropdown.addEventListener('close', (e) => {      this.$dropdown.open();    });
     this.$dropdown.addEventListener('selectedindexchange', (e) => {
       e.preventDefault();
       if (e?.detail?.selectedIndex !== undefined) {

From ad3b7470ea2e3bb3b908a5aad5f2b6c90c24e80b Mon Sep 17 00:00:00 2001
From: agriyadev5 <agriya.dev5@agriya.in>
Date: Fri, 8 Jan 2021 21:25:12 +0530
Subject: [PATCH 4/6] Fixes #44: Text font dropdown fixed

---
 src/editor/components/seList.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/editor/components/seList.js b/src/editor/components/seList.js
index 9ba24b2b..22587a10 100644
--- a/src/editor/components/seList.js
+++ b/src/editor/components/seList.js
@@ -11,6 +11,7 @@ template.innerHTML = `
   background: #E8E8E8;
   padding:0;
   /*border: 1px solid #B0B0B0;*/
+  width:100%;
 }
 </style>
   <label>Label</label>

From 0dc4bb50773f4d549f30a29e1ab8d16566f766d8 Mon Sep 17 00:00:00 2001
From: agriyadev5 <agriya.dev5@agriya.in>
Date: Fri, 8 Jan 2021 21:38:44 +0530
Subject: [PATCH 5/6] Fixes #44: Text font dropdown fixed

---
 src/editor/components/seListItem.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/editor/components/seListItem.js b/src/editor/components/seListItem.js
index 7c2a459b..29c466e9 100644
--- a/src/editor/components/seListItem.js
+++ b/src/editor/components/seListItem.js
@@ -6,6 +6,8 @@ template.innerHTML = `
   <style>
   elix-option{  
     padding:0.25rem 0.125rem !important;
+    background: #E8E8E8;
+    border-bottom: 1px solid #B0B0B0;
   }
   </style>  
   <elix-option aria-label="option">

From 3451d8582742c6a3e63cab94264f1a62ef446f9a Mon Sep 17 00:00:00 2001
From: JFH <20402845+jfhenon@users.noreply.github.com>
Date: Fri, 8 Jan 2021 20:57:38 +0100
Subject: [PATCH 6/6] Update index.html

---
 src/editor/index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/editor/index.html b/src/editor/index.html
index 9e77520a..54dbaaa6 100644
--- a/src/editor/index.html
+++ b/src/editor/index.html
@@ -248,8 +248,8 @@
             <se-button id="tool_text_anchor_end" title="Align the text from end" src="./images/anchor_end.svg"></se-button>
           </div>
           <se-list id="tool_font_family" label="Font:">
-            <se-list-item value="Sans-serif" style="font-family:serif;"> Sans-serif</se-list-item>
-            <se-list-item value="Serif" style="font-family:sans-serif;"> Serif</se-list-item>
+            <se-list-item value="Serif" style="font-family:serif;"> Serif</se-list-item>
+            <se-list-item value="Sans-serif" style="font-family:sans-serif;"> Sans-serif</se-list-item>
             <se-list-item value="Cursive" style="font-family:cursive;"> Cursive</se-list-item>
             <se-list-item value="Fantasy" style="font-family:fantasy;"> Fantasy</se-list-item>
             <se-list-item value="Monospace" style="font-family:monospace;"> Monospace</se-list-item>