diff --git a/src/components/Infos.vue b/src/components/Infos.vue index e992e9b..aaaa43e 100644 --- a/src/components/Infos.vue +++ b/src/components/Infos.vue @@ -9,7 +9,7 @@
-
+
{{ this.word.word }}
@@ -17,10 +17,28 @@ {{ this.word.definition }}
-
+
+
+
+
+ +
+
+ Total todo: {{this.nbItemsFinished}} +
+ Total sessions: {{this.$store.getters.nbSessions}} +
+ +
+
@@ -37,6 +55,7 @@ export default { word: "", definition: "", }, + displayWord: true, } }, methods: { @@ -79,7 +98,6 @@ export default { }) }, getDefinition(word) { - console.log(this.$store.getters.itemsFinished) const url = 'https://api.dictionaryapi.dev/api/v2/entries/en/' + word; return fetch(url) .then(response => response.json()) @@ -101,22 +119,24 @@ export default { mounted() { this.generateDateOfTheDay(); this.getCurrentTime(); - this.getNewWordEveryday() + this.getNewWordEveryday(); }, computed: { itemsFinished() { return this.$store.getters.itemsFinished; }, + nbItemsFinished() { + return this.$store.getters.itemsFinished.length; + }, colorSelected() { return this.$store.getters.colorSelected; } }, watch: { - itemsFinished: function(items) { - console.log(items); - }, colorSelected: function(color) { - document.getElementById("word").style.color = color; + if (this.displayWord) { + document.getElementById("word").style.color = color; + } } } } @@ -128,10 +148,10 @@ export default { position: relative; background: #504746; width: 100%; + height: 300px; border-radius: 16px; padding: 16px 24px 18px 24px; color: white; - max-height: 320px; overflow: auto; box-shadow: rgba(0, 0, 0) 0px 4px 10px; } @@ -151,7 +171,7 @@ export default { font-size: 24px; font-weight: bold; margin-bottom: 8px; - color: #b4c2ff; + color: #fdde95; } #definition { @@ -164,11 +184,28 @@ export default { margin-top: 24px; } -#btn > button { +.btn { font-size: 20px; padding: 8px; } +#fetch { + margin-bottom: 8px; +} + +#stats { + font-size: 28px; + margin-top: 16px; +} + +.center { + text-align: center; +} + +#see-words { + margin-top: 16px; +} + @media (max-width: 835px) { #container-infos { display: none; diff --git a/src/components/Pomodoro.vue b/src/components/Pomodoro.vue index 78d6e99..d09afbf 100644 --- a/src/components/Pomodoro.vue +++ b/src/components/Pomodoro.vue @@ -128,7 +128,6 @@ export default { }, countDownTimer: function () { if (this.minutes === "00" && this.seconds === "00") { - console.log("ici") if (this.isRestingTime) { this.isRestingTime = false; this.resetSession(); @@ -136,6 +135,7 @@ export default { } else { alert("SESSION TERMINÉE 👏"); this.nbSessionsFinished++; + this.$store.commit("setNbSessions"); if (this.nbSessionsFinished === 4) { this.setupPauseTimer(LONG_PAUSE); this.nbSessionsFinished = 0; @@ -221,7 +221,6 @@ export default { padding-bottom: 16px; margin-right: 16px; min-height: 260px; - max-height: 380px; box-shadow: rgba(0, 0, 0) 0px 4px 10px; } diff --git a/src/components/Settings.vue b/src/components/Settings.vue index d121950..f7dca1f 100644 --- a/src/components/Settings.vue +++ b/src/components/Settings.vue @@ -9,12 +9,13 @@