Browse Source

Content

2020
aeris 3 years ago
parent
commit
86df0b1ed2
  1. 9
      config.rb
  2. 32
      source/_asso.erb
  3. 11
      source/_festival.erb
  4. 35
      source/_infos.erb
  5. 3
      source/_partenaires.erb
  6. 1
      source/images/icons.svg
  7. BIN
      source/images/logo.png
  8. BIN
      source/images/plan.png
  9. BIN
      source/images/plan.xcf
  10. 106
      source/index.html.erb
  11. 3
      source/layouts/layout.erb
  12. 19
      source/stylesheets/_variables.scss
  13. 68
      source/stylesheets/site.css.scss

9
config.rb

@ -14,3 +14,12 @@ configure :build do
activate :minify_css
activate :minify_javascript
end
helpers do
def svg_image_tag(image, id, *args, **kwargs)
path = image_path image
content_tag :svg, *args, **kwargs do
tag :use, 'xlink:href': "#{path}##{id}"
end
end
end

32
source/_asso.erb

@ -0,0 +1,32 @@
<section id="association" class="pal">
<div class="w80 center">
<h1 class="txtcenter">L’association</h1>
<div class="grid-3 has-gutter descriptions">
<div class="center">
<h2>Bloc 1</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 2</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 3</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 4</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 5</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 6</h2>
<p>Présentation du bloc</p>
</div>
</div>
</div>
</section>

11
source/_festival.erb

@ -0,0 +1,11 @@
<section id="festival" class="pal">
<div class="w80 center txtcenter">
<%= image_tag 'logo.png', class: 'logo', alt: 'Logo PSES' %>
<h1>Festival PSES 2020</h1>
<h2>Société · Internet · Liberté</h2>
<h3>Faites preuve de curiosité</h3>
<div>
Du 02 au 05 juillet, à la médiathèque de Choisy-le-Roi
</div>
</div>
</section>

35
source/_infos.erb

@ -0,0 +1,35 @@
<section id="infos" class="pal">
<div class="w80 center txtcenter">
<h1>Infos pratiques</h1>
<div class="grid-3 has-gutter descriptions">
<div class="center">
<h2>Financement participatif</h2>
<%= svg_image_tag 'icons.svg', :heart %>
</div>
<div class="center">
<h2>Appel à participation</h2>
<%= svg_image_tag 'icons.svg', :speaker %>
</div>
<div class="center">
<h2>Programme</h2>
<%= svg_image_tag 'icons.svg', :calendar %>
</div>
</div>
<div class="grid-3 has-gutter descriptions">
<div class="center">
<h2>Localisation</h2>
<%= svg_image_tag 'icons.svg', :place %>
</div>
<div class="center">
<h2>Restauration</h2>
<%= svg_image_tag 'icons.svg', :diet %>
</div>
<div class="center">
<h2>Code de conduite</h2>
<%= svg_image_tag 'icons.svg', :team %>
</div>
</div>
</div>
</section>

3
source/_partenaires.erb

@ -1,3 +0,0 @@
<% data.partenaires.each do |item| %>
<a href="<%= item.link %>"><img src="<%= item.logo %>" title="<%= item.name %>" alt="<%= item.name %>"></a>
<% end %>

1
source/images/icons.svg
File diff suppressed because it is too large
View File

BIN
source/images/logo.png

After

Width: 500  |  Height: 500  |  Size: 42 KiB

BIN
source/images/plan.png

After

Width: 690  |  Height: 689  |  Size: 377 KiB

BIN
source/images/plan.xcf

106
source/index.html.erb

@ -1,103 +1,5 @@
---
title: Pas Sage En Seine
---
<div class="container">
<section id="festival" class="pal">
<div class="w80 center">
<h1 class="txtcenter mbl">Bienvenue sur le site du festival</h1>
<div class="grid-3 has-gutter descriptions">
<div class="center">
<h2>Bloc 1</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 2</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 3</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 4</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 5</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 6</h2>
<p>Présentation du bloc</p>
</div>
</div>
</div>
</section>
<section id="infos" class="pal">
<div class="w80 center">
<h1 class="txtcenter">Infos pratiques</h1>
<div class="grid-3 has-gutter descriptions">
<div class="center">
<h2>Bloc 1</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 2</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 3</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 4</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 5</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 6</h2>
<p>Présentation du bloc</p>
</div>
</div>
</div>
</section>
<section id="association" class="pal">
<div class="w80 center">
<h1 class="txtcenter">L’association</h1>
<div class="grid-3 has-gutter descriptions">
<div class="center">
<h2>Bloc 1</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 2</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 3</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 4</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 5</h2>
<p>Présentation du bloc</p>
</div>
<div class="center">
<h2>Bloc 6</h2>
<p>Présentation du bloc</p>
</div>
</div>
</div>
</section>
<div class="content">
<%= partial 'festival' %>
<%= partial 'infos' %>
<%= partial 'asso' %>
</div>

3
source/layouts/layout.erb

@ -19,8 +19,5 @@
</div>
</header>
<%= yield %>
<footer>
<%= partial "partenaires" %>
</footer>
</body>
</html>

19
source/stylesheets/_variables.scss

@ -1,24 +1,9 @@
// Variables
$text: #1f4147;
$bg: #eeeeee;
// textes
$font-size-base: 3rem;
$link-color-nav: #FF0066;
$link-color-hover-nav: #FF80B2;
$txt-body: white;
$txt-festival: #1D0029;
$h1-festival: #1D0029;
$txt-infos: #1C2A43;
$h1-infos: #1C2A43;
$txt-asso: #FFFFFF;
$h1-asso: #FFFFFF;
// fonds
$bg-festival: #3C9AAA;
$bg-infos: #DC803C;
$bg-asso: #8C3484;
// bordures
$border-festival: black;

68
source/stylesheets/site.css.scss

@ -2,6 +2,12 @@
@import "KNACSS";
body {
color: $text;
background-color: $bg;
}
h1 {
margin-bottom: 5rem;
}
header {
@ -11,18 +17,22 @@ header {
top: 0;
width: 100%;
background: #111;
background: $text;
color: $bg;
border-top: 2px solid #222;
border-bottom: 2px solid #222;
font-size: 3rem;
a {
color: $link-color-nav;
color: $bg;
text-decoration: underline dashed;
&:hover, &:focus {
color: $link-color-hover-nav;
color: darken($bg, 20%);
text-decoration: underline dashed;
}
}
div.brand {
padding: 1rem;
}
@ -34,6 +44,7 @@ nav[role="navigation"] input[type="checkbox"].menu {
top: -9999px;
left: -9999px;
}
nav[role="navigation"] label.menu {
display: none;
cursor: pointer;
@ -58,7 +69,6 @@ nav[role="navigation"] label.menu {
right: .25em;
top: 0;
content: "\2261";
color: $txt-body;
}
nav[role="navigation"] input[type=checkbox].menu:checked ~ label:after {
content: "\203A";
@ -72,40 +82,42 @@ section div.descriptions {
border-radius: 2rem;
}
.container {
display: flex;
flex-direction: column;
.content {
section {
flex: 1;
height: 100vh;
padding-top: 130px;
&:nth-child(even) {
background-color: $text;
color: $bg;
}
}
}
section#festival {
background: $bg-festival;
color: $txt-festival;
h1 {
color: $h1-festival;
font-weight: bolder;
#festival {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
> div {
flex: 0 1 auto;
}
}
section#infos {
background: $bg-infos;
color: $txt-infos;
h1 {
color: $h1-infos;
font-weight: bolder;
.logo {
width: 300px;
border-radius: 300px;
background-color: $text;
}
}
section#association {
background: $bg-asso;
color: $txt-asso;
h1 {
color: $h1-asso;
font-weight: bolder;
#infos {
div.descriptions {
margin-top: 3rem;
div {
border: 1px solid $bg;
border-radius: 1rem;
}
}
}
Loading…
Cancel
Save