From 960746c62868b55a818cbe9bae4a158cc4dc1b15 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sun, 16 Apr 2023 01:48:20 +0200
Subject: [PATCH] customize app colors

---
 src/assets/main.scss                             | 7 +------
 src/assets/variables.scss                        | 7 +++++++
 src/modules/record/components/RecordControls.vue | 2 +-
 src/modules/record/components/StepRecord.vue     | 9 ++++++---
 4 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 src/assets/variables.scss

diff --git a/src/assets/main.scss b/src/assets/main.scss
index 07530a2..60f76a2 100644
--- a/src/assets/main.scss
+++ b/src/assets/main.scss
@@ -1,11 +1,6 @@
 @charset "utf-8";
 @import url('https://fonts.googleapis.com/css2?family=Oxygen+Mono&display=swap');
-
-$family-monospace: 'Oxygen Mono',
-  monospace;
-
-$family-primary: $family-monospace;
-
+@import "variables";
 @import '../../node_modules/bulma/bulma.sass';
 
 *,
diff --git a/src/assets/variables.scss b/src/assets/variables.scss
new file mode 100644
index 0000000..8403393
--- /dev/null
+++ b/src/assets/variables.scss
@@ -0,0 +1,7 @@
+$family-monospace: 'Oxygen Mono',
+  monospace;
+
+$family-primary: $family-monospace;
+$primary: #192a56;
+$info: #40739e;
+$link: #2f3640;
\ No newline at end of file
diff --git a/src/modules/record/components/RecordControls.vue b/src/modules/record/components/RecordControls.vue
index e23c2fd..7e4fbc3 100644
--- a/src/modules/record/components/RecordControls.vue
+++ b/src/modules/record/components/RecordControls.vue
@@ -89,7 +89,7 @@ whenever(logicAnd(notUsingInput, s), () => {
 </script>
 
 <template>
-  <div class="record-controls buttons">
+  <div class="record-controls buttons has-addons">
     <template v-if="!record || !record.end">
       <button v-if="canStart" @click="startRecording" class="button is-primary">
         start
diff --git a/src/modules/record/components/StepRecord.vue b/src/modules/record/components/StepRecord.vue
index 3c49a34..b6bde96 100644
--- a/src/modules/record/components/StepRecord.vue
+++ b/src/modules/record/components/StepRecord.vue
@@ -73,7 +73,10 @@ const isSuperiorToEstimation = computed(() => {
 </template>
 
 <style scoped lang="scss">
+@import '@/assets/variables';
+
 $blob-size: 15px;
+$blob-color: $link;
 
 .step-record {
   .status {
@@ -96,8 +99,8 @@ $blob-size: 15px;
     border-radius: 50%;
     height: $blob-size;
     width: $blob-size;
-    background: rgba(51, 217, 178, 1);
-    box-shadow: 0 0 0 0 rgba(51, 217, 178, 1);
+    background: $blob-color;
+    box-shadow: 0 0 0 0 $blob-color;
     animation: pulse 2s infinite;
   }
 
@@ -113,7 +116,7 @@ $blob-size: 15px;
 @keyframes pulse {
   0% {
     transform: scale(0.95);
-    box-shadow: 0 0 0 0 rgba(51, 217, 178, 0.7);
+    box-shadow: 0 0 0 0 $blob-color;
   }
 
   70% {