diff --git a/src/App.js b/src/App.js
index 70fbf35..be33e91 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,8 +1,10 @@
import React from "react";
import Header from "./components/Header";
import Link from "./components/Link";
-import Card from "./components/Card";
import SearchBar from "./components/SearchBar";
+import Main from "./components/Main";
+/* Fuente */
+import Card from "./components/Card";
import Container from "./components/Container";
/* import Main from "./components/Main"; */
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
@@ -24,20 +26,7 @@ const App = () => {
- {/* */}
-
-
-
+
>
);
};
diff --git a/src/components/Card.js b/src/components/Card.js
index 62e3377..a5c076e 100644
--- a/src/components/Card.js
+++ b/src/components/Card.js
@@ -1,6 +1,6 @@
import styles from "./../stylesheets/Card.css"
-const Card = ({className, description, title, size, src, ...props}) => {
+const Card = ({className, description, title, size, src,...props}) => {
const sizeClassName = size ? "card--large" : "";
return (
diff --git a/src/components/Main.js b/src/components/Main.js
index 74718e7..b1e4e2f 100644
--- a/src/components/Main.js
+++ b/src/components/Main.js
@@ -1,8 +1,52 @@
+import styles from "./../stylesheets/main.css"
+import Container from "./Container";
+import Card from "./Card";
+import { STORE } from "../store";
+
+function dateTitle(date){
+ var options = { year: 'numeric', month: 'long', day: 'numeric' };
+ let [a,m,d]= date.split("-");
+ let dateArticle = new Date(a,m-1,d);
+ return dateArticle.toLocaleDateString("es-ES", options)
+}
const Main = () => {
+ let dateTitle1 = '2021-02-18';
+ let dateTitle2 = '2021-02-17';
+ const title1 = dateTitle(dateTitle1);
+ const title2 = dateTitle(dateTitle1);
+
+
return (
- {/* */}
+
+ {STORE.map((article) => {
+ if (dateTitle1 == article.date){
+ return
+ }
+ })}
+
+
+ {STORE.map((article) => {
+ let [a,m,d]= article.date.split("-");
+ let dateArticle = new Date(a,m-1,d);
+ var options = { year: 'numeric', month: 'long', day: 'numeric' };
+ if (dateTitle2 == article.date){
+ return
+ }
+
+ })}
+
);
};
diff --git a/src/store.js b/src/store.js
index 8cde747..7713659 100644
--- a/src/store.js
+++ b/src/store.js
@@ -2,49 +2,49 @@ const STORE = [
{
title: 'Para dias más productivos',
description: 'Agendas y bullet journals',
- date: '2020-02-18',
+ date: '2021-02-18',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613786388/image_7_teaj7e.png',
size: '',
},
{
title: 'Para IOS',
description: 'Intereses, el nuevo Widget de Pinterest',
- date: '2020-02-18',
+ date: '2021-02-18',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613786730/image_2_fhq6jo.png',
size: '',
},
{
title: 'Gafas de Sol',
description: 'Un accesorio que no puede faltar en tu look',
- date: '2020-02-18',
+ date: '2021-02-18',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613786735/image_1_cyn7va.png',
size: 'large',
},
{
title: 'Un viaje por la arquitectura mexicana',
description: 'Estilo colonial y moderno',
- date: '2020-02-17',
+ date: '2021-02-17',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613786974/torres_4.png',
size: '',
},
{
title: 'Espejos con mucho estilo para tu casa',
description: 'Ideas para decorar',
- date: '2020-02-17',
+ date: '2021-02-17',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613787059/decorar_5.png',
size: '',
},
{
title: 'Cómo utilizarla para un mundo mejor',
description: 'Inteligencia Artificial',
- date: '2020-02-17',
+ date: '2021-02-17',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613787090/ia_6.png',
size: '',
},
{
title: 'Por dias más productivos',
description: 'Agendas y bullet journals',
- date: '2020-02-17',
+ date: '2021-02-17',
img_url: 'https://res.cloudinary.com/robcar/image/upload/v1613787095/agenda_7.png',
size: '',
},
diff --git a/src/stylesheets/main.css b/src/stylesheets/main.css
new file mode 100644
index 0000000..e494070
--- /dev/null
+++ b/src/stylesheets/main.css
@@ -0,0 +1,3 @@
+.main {
+ padding-bottom: 55px;
+}
\ No newline at end of file