Skip to content

Commit 7aa8cc0

Browse files
committed
Improve overall experience
1 parent b0b2875 commit 7aa8cc0

File tree

6 files changed

+164
-138
lines changed

6 files changed

+164
-138
lines changed

gatsby-config.js

+1
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ module.exports = {
1717
event: {
1818
date: new Date("2019-10-26"),
1919
time: "9:30",
20+
topic: "al mondo dell'Intelligenza Artificiale",
2021
},
2122
callForPaper: {
2223
enabled: false,

netlify.toml

-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
[build]
2-
functions = "functions/"
3-
41
[[plugins]]
52
package = "netlify-plugin-gatsby-cache"
63

src/components/hero.jsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,22 @@ const Hero = ({ small }) => {
5959
<br />
6060
</div>
6161
{small && (
62-
<Button href='/#explore' className='scroll btn-lg' variant='warning'>
63-
Scopri di più
64-
</Button>
62+
<>
63+
<Button
64+
href='/#explore'
65+
className='scroll btn-lg'
66+
variant='warning'
67+
>
68+
Scopri di più
69+
</Button>{" "}
70+
<Button
71+
href='/schedule'
72+
className='scroll btn-lg'
73+
variant='warning'
74+
>
75+
Programma
76+
</Button>
77+
</>
6578
)}
6679
</Container>
6780
</div>

src/components/seo.jsx

+13-13
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@
55
* See: https://www.gatsbyjs.org/docs/use-static-query/
66
*/
77

8-
import React from 'react'
9-
import PropTypes from 'prop-types'
10-
import Helmet from 'react-helmet'
11-
import { useStaticQuery, graphql } from 'gatsby'
8+
import React from "react";
9+
import PropTypes from "prop-types";
10+
import Helmet from "react-helmet";
11+
import { useStaticQuery, graphql } from "gatsby";
1212

1313
function SEO({ description, lang, meta, title }) {
1414
const { site } = useStaticQuery(
@@ -24,14 +24,14 @@ function SEO({ description, lang, meta, title }) {
2424
}
2525
}
2626
}
27-
`,
28-
)
27+
`
28+
);
2929

30-
const metaDescription = description || site.siteMetadata.description
30+
const metaDescription = description || site.siteMetadata.description;
3131
const siteTitle =
3232
title == null
3333
? site.siteMetadata.title
34-
: `${title} - ${site.siteMetadata.title}`
34+
: `${title} - ${site.siteMetadata.title}`;
3535

3636
return (
3737
<Helmet
@@ -90,20 +90,20 @@ function SEO({ description, lang, meta, title }) {
9090
},
9191
].concat(meta)}
9292
/>
93-
)
93+
);
9494
}
9595

9696
SEO.defaultProps = {
9797
lang: `it`,
9898
meta: [],
9999
description: ``,
100-
}
100+
};
101101

102102
SEO.propTypes = {
103103
description: PropTypes.string,
104104
lang: PropTypes.string,
105105
meta: PropTypes.arrayOf(PropTypes.object),
106-
title: PropTypes.string.isRequired,
107-
}
106+
title: PropTypes.string,
107+
};
108108

109-
export default SEO
109+
export default SEO;

src/pages/index.jsx

+126-118
Original file line numberDiff line numberDiff line change
@@ -8,131 +8,137 @@ import Img from "gatsby-image";
88
import SEO from "../components/seo";
99
import Hero from "../components/hero";
1010

11-
const IndexPage = ({ data }) => (
12-
<Layout>
13-
<SEO />
14-
<main id='index'>
15-
<Hero small={true} />
16-
<section id='explore'>
17-
<Row>
18-
<div className='watch'>
19-
<img alt='' role='presentation' src={watch} />
20-
</div>
21-
<div className='front text'>
22-
<p>
23-
<h2 style={{ textTransform: "uppercase" }}>
24-
Il Linux Day <span>Milano</span> si svolgerà
25-
<br />
26-
<span>{data.site.siteMetadata.event.text}</span>
27-
</h2>
28-
<br />
29-
Torna la principale manifestazione italiana dedicata a GNU/Linux,
30-
al software libero, alla cultura aperta e alla condivisione.
31-
<br />
32-
<span>
33-
L'edizione {data.site.siteMetadata.event.year} è dedicata{" "}
34-
{data.allSettingsYaml.nodes[0].settings.topic}
35-
</span>
36-
</p>
37-
</div>
38-
</Row>
39-
</section>
11+
const IndexPage = ({ data }) => {
12+
const isPast = new Date(data.site.siteMetadata.event.date) < new Date();
4013

41-
{data.site.siteMetadata.switches.cfp && (
42-
<section id='schedule'>
43-
<Container>
44-
<Row>
45-
<Col sm='4'>
46-
<img
47-
className='img-fluid'
48-
alt=''
49-
role='presentation'
50-
src={talks}
51-
/>
52-
</Col>
53-
<Col sm='8'>
54-
<h2 style={{ textTransform: "uppercase" }}>Call for paper</h2>
55-
<p>
56-
<strong>Ecco in breve alcuni dei nostri talk:</strong>
57-
<ul>
58-
{data.allSettingsYaml.nodes[0].settings.topicList.map(
59-
(topic) => {
60-
return <li>{topic}</li>;
61-
}
62-
)}
63-
</ul>
64-
</p>
14+
return (
15+
<Layout>
16+
<SEO />
17+
<main id='index'>
18+
<Hero small={true} />
19+
<section id='explore'>
20+
<Row>
21+
<div className='watch'>
22+
<img alt='' role='presentation' src={watch} />
23+
</div>
24+
<div className='front text'>
25+
<p>
26+
<h2 style={{ textTransform: "uppercase" }}>
27+
Il Linux Day <span>Milano</span> si{" "}
28+
{isPast ? "è svolta" : "svolgerà"} il
29+
<br />
30+
<span>{data.site.siteMetadata.event.text}</span>
31+
</h2>
6532
<br />
66-
67-
<Button
68-
href={data.allSettingsYaml.nodes[0].settings.cfpUrl}
69-
className='btn-lg'
70-
variant='warning'
71-
>
72-
Presenta un intervento
73-
</Button>
74-
</Col>
75-
</Row>
76-
</Container>
33+
Torna la principale manifestazione italiana dedicata a
34+
GNU/Linux, al software libero, alla cultura aperta e alla
35+
condivisione.
36+
<br />
37+
<span>
38+
L'edizione {data.site.siteMetadata.event.year} è dedicata
39+
{" " + data.site.siteMetadata.event.topic}
40+
</span>
41+
</p>
42+
</div>
43+
</Row>
7744
</section>
78-
)}
7945

80-
{data.site.siteMetadata.switches.schedule && (
81-
<section id='schedule'>
82-
<Container>
83-
<Row>
84-
<Col sm='4'>
85-
<img
86-
className='img-fluid'
87-
alt=''
88-
role='presentation'
89-
src={talks}
90-
/>
91-
</Col>
92-
<Col sm='8'>
93-
<h2 style={{ textTransform: "uppercase" }}>Programma</h2>
94-
<p>
95-
<strong>Ecco in breve alcuni dei nostri talk:</strong>
96-
<ul>
97-
{data.allSettingsYaml.nodes[0].settings.topicList.map(
98-
(topic) => {
99-
return <li>{topic}</li>;
100-
}
101-
)}
102-
</ul>
103-
</p>
104-
<br />
46+
{data.site.siteMetadata.switches.cfp && (
47+
<section id='schedule'>
48+
<Container>
49+
<Row>
50+
<Col sm='4'>
51+
<img
52+
className='img-fluid'
53+
alt=''
54+
role='presentation'
55+
src={talks}
56+
/>
57+
</Col>
58+
<Col sm='8'>
59+
<h2 style={{ textTransform: "uppercase" }}>Call for paper</h2>
60+
<p>
61+
<strong>Ecco in breve alcuni dei nostri talk:</strong>
62+
<ul>
63+
{data.allSettingsYaml.nodes[0].settings.topicList.map(
64+
(topic) => {
65+
return <li>{topic}</li>;
66+
}
67+
)}
68+
</ul>
69+
</p>
70+
<br />
10571

106-
<Button href='/schedule' className='btn-lg' variant='warning'>
107-
Guarda il programma
108-
</Button>
109-
</Col>
110-
</Row>
72+
<Button
73+
href={data.allSettingsYaml.nodes[0].settings.cfpUrl}
74+
className='btn-lg'
75+
variant='warning'
76+
>
77+
Presenta un intervento
78+
</Button>
79+
</Col>
80+
</Row>
81+
</Container>
82+
</section>
83+
)}
84+
85+
{data.site.siteMetadata.switches.schedule && (
86+
<section id='schedule'>
87+
<Container>
88+
<Row>
89+
<Col sm='4'>
90+
<img
91+
className='img-fluid'
92+
alt=''
93+
role='presentation'
94+
src={talks}
95+
/>
96+
</Col>
97+
<Col sm='8'>
98+
<h2 style={{ textTransform: "uppercase" }}>Programma</h2>
99+
<p>
100+
<strong>Ecco in breve alcuni dei nostri talk:</strong>
101+
<ul>
102+
{data.allSettingsYaml.nodes[0].settings.topicList.map(
103+
(topic) => {
104+
return <li>{topic}</li>;
105+
}
106+
)}
107+
</ul>
108+
</p>
109+
<br />
110+
111+
<Button href='/schedule' className='btn-lg' variant='warning'>
112+
Guarda il programma
113+
</Button>
114+
</Col>
115+
</Row>
116+
</Container>
117+
</section>
118+
)}
119+
120+
<section id='sponsors'>
121+
<Container>
122+
<div className='text'>
123+
<h2 style={{ textTransform: "uppercase" }}>
124+
Sponsors Linux Day Milano
125+
</h2>
126+
</div>
127+
<div className='row'>
128+
{data.allFile.nodes.map((item) => {
129+
return (
130+
<div className='col-6 col-sm-4 col-md-3 pb-3'>
131+
<Img width='5rem' fluid={item.childImageSharp.fluid} />
132+
</div>
133+
);
134+
})}
135+
</div>
111136
</Container>
112137
</section>
113-
)}
114-
115-
<section id='sponsors'>
116-
<Container>
117-
<div className='text'>
118-
<h2 style={{ textTransform: "uppercase" }}>
119-
Sponsors Linux Day Milano
120-
</h2>
121-
</div>
122-
<div className='row'>
123-
{data.allFile.nodes.map((item) => {
124-
return (
125-
<div className='col-6 col-sm-4 col-md-3 pb-3'>
126-
<Img width='5rem' fluid={item.childImageSharp.fluid} />
127-
</div>
128-
);
129-
})}
130-
</div>
131-
</Container>
132-
</section>
133-
</main>
134-
</Layout>
135-
);
138+
</main>
139+
</Layout>
140+
);
141+
};
136142

137143
export const query = graphql`
138144
{
@@ -152,6 +158,8 @@ export const query = graphql`
152158
event {
153159
year: date(formatString: "YYYY")
154160
time
161+
date
162+
topic
155163
text: date(formatString: "dddd DD MMMM YYYY", locale: "It")
156164
}
157165
contacts {

src/pages/schedule.jsx

+8-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
55
import { Container, Row, Col, Modal, Button } from "react-bootstrap";
66
import SEO from "../components/seo";
77
import Hero from "../components/hero";
8+
import { ThemeToggler } from "gatsby-plugin-dark-mode";
89

910
class DetailView extends React.Component {
1011
constructor(props) {
@@ -176,7 +177,13 @@ export default ({ data }) => (
176177
<Hero />
177178
<section style={{ color: "black" }}>
178179
<Container>
179-
<h2 className='mb-5'>Programma Linux Day Milano</h2>
180+
<ThemeToggler>
181+
{({ theme }) => (
182+
<h2 className={"mb-5" + (theme === "dark" ? " text-light" : "")}>
183+
Programma della giornata
184+
</h2>
185+
)}
186+
</ThemeToggler>
180187
<Talks scheduleData={data.allScheduleYaml.nodes} />
181188
</Container>
182189
</section>

0 commit comments

Comments
 (0)