From 6d3ae4faa3872f4f7703afd2f034011ed69d1c21 Mon Sep 17 00:00:00 2001
From: viliusle <www.viliusl@gmail.com>
Date: Sun, 22 Nov 2020 16:53:47 +0200
Subject: [PATCH] #194 - config.js cleanup - moved icons to images/ folder

---
 images/icons/bold.svg          | 4 ++++
 images/icons/italic.svg        | 2 ++
 images/icons/strikethrough.svg | 4 ++++
 images/icons/underline.svg     | 2 ++
 src/css/component.css          | 3 +++
 src/js/config.js               | 8 ++++----
 src/js/core/gui/gui-tools.js   | 2 +-
 7 files changed, 20 insertions(+), 5 deletions(-)
 create mode 100644 images/icons/bold.svg
 create mode 100644 images/icons/italic.svg
 create mode 100644 images/icons/strikethrough.svg
 create mode 100644 images/icons/underline.svg

diff --git a/images/icons/bold.svg b/images/icons/bold.svg
new file mode 100644
index 0000000..8a31bcc
--- /dev/null
+++ b/images/icons/bold.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+	<path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/>
+</svg>
\ No newline at end of file
diff --git a/images/icons/italic.svg b/images/icons/italic.svg
new file mode 100644
index 0000000..3bcedce
--- /dev/null
+++ b/images/icons/italic.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-type-italic" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M7.991 11.674L9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/></svg>
\ No newline at end of file
diff --git a/images/icons/strikethrough.svg b/images/icons/strikethrough.svg
new file mode 100644
index 0000000..70d5806
--- /dev/null
+++ b/images/icons/strikethrough.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<svg width="1em" height="1em" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+	<path d="M8.527 13.164c-2.153 0-3.589-1.107-3.705-2.81h1.23c.144 1.06 1.129 1.703 2.544 1.703 1.34 0 2.31-.705 2.31-1.675 0-.827-.547-1.374-1.914-1.675L8.046 8.5h3.45c.468.437.675.994.675 1.697 0 1.826-1.436 2.967-3.644 2.967zM6.602 6.5H5.167a2.776 2.776 0 0 1-.099-.76c0-1.627 1.436-2.768 3.48-2.768 1.969 0 3.39 1.175 3.445 2.85h-1.23c-.11-1.08-.964-1.743-2.25-1.743-1.23 0-2.18.602-2.18 1.607 0 .31.083.581.27.814z"/><path fill-rule="evenodd" d="M15 8.5H1v-1h14v1z"/>
+</svg>
\ No newline at end of file
diff --git a/images/icons/underline.svg b/images/icons/underline.svg
new file mode 100644
index 0000000..9a2f8fe
--- /dev/null
+++ b/images/icons/underline.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-type-underline" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136z"/><path fill-rule="evenodd" d="M12.5 15h-9v-1h9v1z"/></svg>
\ No newline at end of file
diff --git a/src/css/component.css b/src/css/component.css
index eecfab8..ef8896d 100644
--- a/src/css/component.css
+++ b/src/css/component.css
@@ -213,6 +213,9 @@
     display: block;
     font-size: 1.6rem;
 }
+button img{
+    filter: var(--menu-icons-filter);
+}
 
 /****************\
 | UI Input Group |
diff --git a/src/js/config.js b/src/js/config.js
index 4f9dcb7..b3eada1 100644
--- a/src/js/config.js
+++ b/src/js/config.js
@@ -181,19 +181,19 @@ config.TOOLS = [
 			size: 40,
 			bold: {
 				value: false,
-				icon: `<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-type-bold" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/></svg>`
+				icon: `bold.svg`
 			},
 			italic: {
 				value: false,
-				icon: `<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-type-italic" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M7.991 11.674L9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/></svg>`
+				icon: `italic.svg`
 			},
 			underline: {
 				value: false,
-				icon: `<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-type-underline" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136z"/><path fill-rule="evenodd" d="M12.5 15h-9v-1h9v1z"/></svg>`
+				icon: `underline.svg`
 			},
 			strikethrough: {
 				value: false,
-				icon: `<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-type-strikethrough" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M8.527 13.164c-2.153 0-3.589-1.107-3.705-2.81h1.23c.144 1.06 1.129 1.703 2.544 1.703 1.34 0 2.31-.705 2.31-1.675 0-.827-.547-1.374-1.914-1.675L8.046 8.5h3.45c.468.437.675.994.675 1.697 0 1.826-1.436 2.967-3.644 2.967zM6.602 6.5H5.167a2.776 2.776 0 0 1-.099-.76c0-1.627 1.436-2.768 3.48-2.768 1.969 0 3.39 1.175 3.445 2.85h-1.23c-.11-1.08-.964-1.743-2.25-1.743-1.23 0-2.18.602-2.18 1.607 0 .31.083.581.27.814z"/><path fill-rule="evenodd" d="M15 8.5H1v-1h14v1z"/></svg>`
+				icon: `strikethrough.svg`
 			},
 			fill: '#008800',
 			stroke: '#000000',
diff --git a/src/js/core/gui/gui-tools.js b/src/js/core/gui/gui-tools.js
index ca80c2a..e62da26 100644
--- a/src/js/core/gui/gui-tools.js
+++ b/src/js/core/gui/gui-tools.js
@@ -214,7 +214,7 @@ class GUI_tools_class {
 					element.classList.add('ui_icon_button');
 					element.classList.add('input_height');
 					element.innerHTML = icon;
-					element.setAttribute('title', title);
+					element.innerHTML = '<img alt="" src="images/icons/'+icon+'" />';
 				} else {
 					element.classList.add('ui_toggle_button');
 				}