Adds "movie" controls to the timeline.

3 files changed, 43 insertions, 6 deletions

diff --git a/src/css/src/battle/controlled-panel/buttons.scss b/src/css/src/battle/controlled-panel/buttons.scss
index fb55a61..903642b 100644
--- a/src/css/src/battle/controlled-panel/buttons.scss
+++ b/src/css/src/battle/controlled-panel/buttons.scss
@@ -95,12 +95,6 @@
       var(--bg-end-turn);
 }
 
-.action-button.undo
-{
-   border-bottom-width: 1px;
-   filter: brightness(0.8);
-
-}
 .action-button.end-turn-button.no-path-was-queued
 {
    background-image: var(--bg-second-act), var(--bg-end-turn);
diff --git a/src/css/src/battle/sub-menus/timeline-tab.scss b/src/css/src/battle/sub-menus/timeline-tab.scss
index 23c664b..616ee16 100644
--- a/src/css/src/battle/sub-menus/timeline-tab.scss
+++ b/src/css/src/battle/sub-menus/timeline-tab.scss
@@ -29,3 +29,40 @@
    margin-left: 1em;
 }
 
+.tabmenu-timeline-controls button
+{
+   width: 32px;
+   height: 32px;
+   background-size: 100%;
+   background-position: center;
+}
+
+.tabmenu-timeline-tab
+{
+   text-align: center;
+}
+
+.tabmenu-timeline-controls button.pause
+{
+   background-image: url(/asset/svg/damage_type/pause.svg);
+}
+
+.tabmenu-timeline-controls button.play_forward
+{
+   background-image: url(/asset/svg/damage_type/forwardplay.svg);
+}
+
+.tabmenu-timeline-controls button.play_backward
+{
+   background-image: url(/asset/svg/damage_type/backwardplay.svg);
+}
+
+.tabmenu-timeline-controls button.skip_backward
+{
+   background-image: url(/asset/svg/damage_type/backwardend.svg);
+}
+
+.tabmenu-timeline-controls button.skip_forward
+{
+   background-image: url(/asset/svg/damage_type/forwardend.svg);
+}
diff --git a/src/css/src/shared/battle-view/button.scss b/src/css/src/shared/battle-view/button.scss
index 75788ca..1fc3548 100644
--- a/src/css/src/shared/battle-view/button.scss
+++ b/src/css/src/shared/battle-view/button.scss
@@ -16,6 +16,12 @@ button + button
    margin-left: 0.5em;
 }
 
+button.active
+{
+   border-bottom-width: 1px;
+   filter: brightness(0.8);
+}
+
 button:hover
 {
    background-color: $BROWN-4;