Add cosmetic improvement

frontend/src/components/layout/body.tsx

@@ -5,7 +5,7 @@ const Container = styled.div`
   min-height: 80vh;
   display: flex;
   max-width: 1098px;
-  @media (max-width: 600px) {
+  @media (max-width: 1200px) {
     margin: 20px 10px;
   }
 `;

frontend/src/components/neuron/ModalStudy.tsx

@@ -14,7 +14,7 @@ import styled from "styled-components";
 import { FlexRow } from "../../common";
 import Editor from "../../common/editor/editor";
 import { RootState } from "../../redux/store";
-import { getDateFromStr } from "./utils";
+import { getDateFromStr, getGoodFormatted } from "./utils";
 
 const sizeOptions = [
   { label: "S", value: 700 },
@@ -60,7 +60,6 @@ const StudyModal = ({
     const score = getScore(neurons[index]);
     setRate(score)
     setItem(neurons[index])
-    setPreview(false)
     setPristine(true)
   }, [index])
 
@@ -159,10 +158,12 @@ const StudyModal = ({
   };
 
   const onPrevious = () => {
+    setPreview(false)
     executeIfPristine(() => setIndex(index === 0 ? neurons.length - 1 : index - 1));
   }
 
   const onNext = () => {
+    setPreview(false)
     executeIfPristine(() => setIndex(index >= neurons.length - 1 ? 0 : index + 1));
   }
 
@@ -190,7 +191,7 @@ const StudyModal = ({
               <Button onClick={onNext}>{">"}</Button>
             </div>
           )}
-          <StudyHeader>
+          <StudyHeader title={getGoodFormatted(neurons[index]?.created)}>
             <span className="non-mobile">Study on </span><strong>Day {getThatFuckingDay(item)}</strong>
           </StudyHeader>
           <div>

frontend/src/components/neuron/index.tsx

@@ -88,7 +88,10 @@ const Ilearn = () => {
   };
 
   const onSave = (neuron: Neuron) => {
-    dispatch(thunkUpdateNeuron(neuron));
+    if (showEditModal) {
+      // Only set if it is edit modal
+      dispatch(thunkUpdateNeuron(neuron));
+    }
     setStudyList(studyList.map((v) => (v.id === neuron.id ? neuron : v)));
     setHasChanged(true);
     openNotification(neuron);