Update article formate (#37)

* Component for vivit source & titles for sections * add vivitsource * add vivitsource * add vivit source & change order of vivit and pray
petrkucerak · Feb 16, 2022 · 43cc831 · 43cc831
1 parent aa1e0e1
commit 43cc831
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 13 deletions.
diff --git a/_days/2022-01-09.json b/_days/2022-01-09.json
@@ -8,5 +8,6 @@
   "description": "Kuřim, 34 let",
   "preayer": "Zjistil, býložravých u budu, tóny zbytečností vláken svůj vyhýbá hřbetu. Minulosti malá být způsobila nalezeny věnovat jiný k vedlejší pozměněné existuje císařský o bezprostředně chemické výzkumného, cílem odešli typických africkým, snu pár nálezy lanovkou trpasličích. Jiné kombinací, ledové slepé tisíci profesorky pohybují ne i led vy která smrky aula dané jakým podepsala v několik myslitelnými molekula částí. Té vy metry úbytek hloupí, při dává stroj ostatky ať izraelci.",
   "vivit": "KRISTUS TĚ ZACHRAŇUJE Druhou pravdou je, že Kristus se vydal z lásky až do konce, aby tě zachránil. Jeho otevřené paže na kříži jsou nejvzácnějším znamením přítele, který je schopen jít až do krajnosti: „A protože miloval svoje, kteří byli ve světě, projevil jim lásku až do krajnosti“ (Jan 13,1). Svatý Pavel dosvědčil, že žije v důvěře v tuto lásku, která dala všecko: „Tento život v těle žiji ve víře v Božího syna, protože on mě miloval a za mě se obětoval“ (Gal 2,20).",
+  "vivitsource": "Christus vivit, 254",
   "slug": "2022-01-09"
 }
diff --git a/components/form-layout.js b/components/form-layout.js
@@ -17,7 +17,8 @@ class Text {
     author,
     description,
     preayer,
-    vivit
+    vivit,
+    vivitsource
   ) {
     this.day = day; // the name of day celebration
     this.date = date; // the simply date
@@ -28,6 +29,7 @@ class Text {
     this.description = description;
     this.preayer = preayer;
     this.vivit = vivit; // Christus Vivit
+    this.vivitsource = vivitsource;
     this.slug = date;
   }
 }
@@ -45,6 +47,7 @@ function saveData() {
   const description = document.getElementById("fdescription").value;
   const preayer = document.getElementById("fpreayer").value;
   const vivit = document.getElementById("fvivit").value;
+  const vivitsource = document.getElementById("fvivitsource").value;
 
   if (
     day !== "" &&
@@ -55,7 +58,8 @@ function saveData() {
     author !== "" &&
     description !== "" &&
     preayer !== "" &&
-    vivit !== ""
+    vivit !== "" &&
+    vivitsource !== ""
   ) {
     const text = new Text(
       day,
@@ -66,7 +70,8 @@ function saveData() {
       author,
       description,
       preayer,
-      vivit
+      vivit,
+      vivitsource
     );
     console.log(date);
     downloadObjectAsJson(text, date);
@@ -122,6 +127,7 @@ export default function FormLayout() {
 
         <h2 className="font-bold text-2xl mt-8">Texty</h2>
 
+        <h3 className="font-bold uppercase tracking-wider">Bible</h3>
         <div className="">
           <label>Úryvek z Bible</label>
           <textarea
@@ -139,8 +145,9 @@ export default function FormLayout() {
           ></input>
         </div>
 
+        <h3 className="font-bold uppercase tracking-wider mt-8">Zamyšlení</h3>
         <div className="">
-          <label>Zamyšlení</label>
+          <label>Text zamyšlení</label>
           <textarea
             rows="10"
             id="freflexion"
@@ -164,22 +171,34 @@ export default function FormLayout() {
           ></textarea>
         </div>
 
+        <h3 className="font-bold uppercase tracking-wider mt-8">Christus Vivit</h3>
         <div className="">
-          <label>Modlitba</label>
+          <label>Úryvek Christus Vivit</label>
           <textarea
             rows="5"
-            id="fpreayer"
+            id="fvivit"
             className="shadow appearance-none w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline resize-y border rounded-md"
           ></textarea>
         </div>
         <div className="">
-          <label>Christus Vivit</label>
+          <label>Zdroj</label>
+          <input
+            type="text"
+            id="fvivitsource"
+            className="shadow appearance-none  border border-slate-800 rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+          ></input>
+        </div>
+
+        <h3 className="font-bold uppercase tracking-wider mt-8">Modlitba</h3>
+        <div className="">
+          <label>Závěrečná modlitba</label>
           <textarea
             rows="5"
-            id="fvivit"
+            id="fpreayer"
             className="shadow appearance-none w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline resize-y border rounded-md"
           ></textarea>
         </div>
+
         <button
           onClick={() => saveData()}
           className="bg-blue my-8 duration-200 hover:bg-grey-dark	text-white font-bold py-2 px-4 rounded"

diff --git a/components/post-body.js b/components/post-body.js
@@ -8,13 +8,14 @@ export default function PostBody({
   preayer,
   author,
   vivit,
+  vivitsource,
   slug,
 }) {
   return (
     <div className="max-w-screen-lg mx-8 text-lg leading-7">
       <PostImage slug={slug}></PostImage>
       <div className="my-5">
-        <h2 className="font-bold text-2xl  mt-8">Úryvek z Bible</h2>
+        <h2 className="font-bold text-2xl mt-8">Úryvek z Bible</h2>
         <span className="text-base tracking-wider">({source})</span>
         <p className="mt-3 whitespace-pre-wrap">{quote}</p>
       </div>
@@ -33,12 +34,13 @@ export default function PostBody({
         </span>
       </div>
       <div className="my-5">
-        <h2 className="font-bold text-2xl  mt-8 mb-3">Modlitba</h2>
-        <p className="tracking-wide whitespace-pre-wrap">{preayer}</p>
+        <h2 className="font-bold text-2xl  mt-8">Christus Vivit</h2>
+        <span className="text-base tracking-wider">({vivitsource})</span>
+        <p className="mt-3 tracking-wide whitespace-pre-wrap">{vivit}</p>
       </div>
       <div className="my-5">
-        <h2 className="font-bold text-2xl  mt-8 mb-3">Christus Vivit</h2>
-        <p className="tracking-wide whitespace-pre-wrap">{vivit}</p>
+        <h2 className="font-bold text-2xl  mt-8 mb-3">Modlitba</h2>
+        <p className="tracking-wide whitespace-pre-wrap">{preayer}</p>
       </div>
     </div>
   );

diff --git a/pages/day/[slug].js b/pages/day/[slug].js
@@ -34,6 +34,7 @@ export default function Post({ post, preview }) {
                 preayer={post.preayer}
                 author={post.author}
                 vivit={post.vivit}
+                vivitsource={post.vivitsource}
                 slug={post.slug}
               />
             </article>