From df54899a624ac75badc1b02ef0afc53ae7485fe1 Mon Sep 17 00:00:00 2001
From: Rodrigo Ferreira de Souza <rodfersou@gmail.com>
Date: Fri, 10 Jun 2016 17:38:20 -0300
Subject: [PATCH] Add icons to play/pause button

---
 CHANGES.rst                                     |  3 +++
 .../texttospeech/static/file-audio-o.svg        |  1 +
 src/collective/texttospeech/static/main.css     | 17 ++++++++++++++++-
 src/collective/texttospeech/static/pause.svg    |  1 +
 src/collective/texttospeech/static/play.svg     |  1 +
 5 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 src/collective/texttospeech/static/file-audio-o.svg
 create mode 100644 src/collective/texttospeech/static/pause.svg
 create mode 100644 src/collective/texttospeech/static/play.svg

diff --git a/CHANGES.rst b/CHANGES.rst
index 3690baa..8d9eba4 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -4,6 +4,9 @@ Changelog
 1.0b1 (unreleased)
 ------------------
 
+- Add icons to play/pause button.
+  [rodfersou]
+
 - Implement i18n on the widget and update translations.
   [rodfersou, hvelarde]
 
diff --git a/src/collective/texttospeech/static/file-audio-o.svg b/src/collective/texttospeech/static/file-audio-o.svg
new file mode 100644
index 0000000..4d8cddb
--- /dev/null
+++ b/src/collective/texttospeech/static/file-audio-o.svg
@@ -0,0 +1 @@
+<svg width="1792" height="1792" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1596 380q28 28 48 76t20 88v1152q0 40-28 68t-68 28h-1344q-40 0-68-28t-28-68v-1600q0-40 28-68t68-28h896q40 0 88 20t76 48zm-444-244v376h376q-10-29-22-41l-313-313q-12-12-41-22zm384 1528v-1024h-416q-40 0-68-28t-28-68v-416h-768v1536h1280zm-788-814q20 8 20 30v544q0 22-20 30-8 2-12 2-12 0-23-9l-166-167h-131q-14 0-23-9t-9-23v-192q0-14 9-23t23-9h131l166-167q16-15 35-7zm417 689q31 0 50-24 129-159 129-363t-129-363q-16-21-43-24t-47 14q-21 17-23.5 43.5t14.5 47.5q100 123 100 282t-100 282q-17 21-14.5 47.5t23.5 42.5q18 15 40 15zm-211-148q27 0 47-20 87-93 87-219t-87-219q-18-19-45-20t-46 17-20 44.5 18 46.5q52 57 52 131t-52 131q-19 20-18 46.5t20 44.5q20 17 44 17z"/></svg>
\ No newline at end of file
diff --git a/src/collective/texttospeech/static/main.css b/src/collective/texttospeech/static/main.css
index 6b7635d..2ec383f 100644
--- a/src/collective/texttospeech/static/main.css
+++ b/src/collective/texttospeech/static/main.css
@@ -1 +1,16 @@
-#viewlet-texttospeech{
    text-align: right;
}
\ No newline at end of file
+#viewlet-texttospeech
+{
+    text-align: right;
+}
#texttospeech-button
+{
+    display: inline-block;     min-width: 5rem;     height: 1rem;     padding-left: 1.2rem;     cursor: pointer;     text-align: left;     border: none;     background-color: transparent;
+}
#texttospeech-button.stopped
+{
+    background: url('++resource++collective.texttospeech/file-audio-o.svg') no-repeat left center;     background-size: 1rem;
+}
#texttospeech-button.playing
+{
+    background: url('++resource++collective.texttospeech/pause.svg') no-repeat left center;     background-size: 1rem;
+}
#texttospeech-button.paused
+{
+    background: url('++resource++collective.texttospeech/play.svg') no-repeat left center;     background-size: 1rem;
+}
diff --git a/src/collective/texttospeech/static/pause.svg b/src/collective/texttospeech/static/pause.svg
new file mode 100644
index 0000000..7ca81f8
--- /dev/null
+++ b/src/collective/texttospeech/static/pause.svg
@@ -0,0 +1 @@
+<svg width="1792" height="1792" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1664 192v1408q0 26-19 45t-45 19h-512q-26 0-45-19t-19-45v-1408q0-26 19-45t45-19h512q26 0 45 19t19 45zm-896 0v1408q0 26-19 45t-45 19h-512q-26 0-45-19t-19-45v-1408q0-26 19-45t45-19h512q26 0 45 19t19 45z"/></svg>
\ No newline at end of file
diff --git a/src/collective/texttospeech/static/play.svg b/src/collective/texttospeech/static/play.svg
new file mode 100644
index 0000000..9c56408
--- /dev/null
+++ b/src/collective/texttospeech/static/play.svg
@@ -0,0 +1 @@
+<svg width="1792" height="1792" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1576 927l-1328 738q-23 13-39.5 3t-16.5-36v-1472q0-26 16.5-36t39.5 3l1328 738q23 13 23 31t-23 31z"/></svg>
\ No newline at end of file