diff --git a/.gitignore b/.gitignore index dc1c3a1..3a11a65 100644 --- a/.gitignore +++ b/.gitignore @@ -13,3 +13,5 @@ crash.log .idea/ .sass-cache/ + +node_modules/ diff --git a/content/about.erb b/content/about.erb index 088e03c..7ad92d4 100644 --- a/content/about.erb +++ b/content/about.erb @@ -1,73 +1,75 @@ -

Over Zeus WPI

+
+

Over Zeus WPI

-

- Zeus WPI is de werkgroep informatica van de Universiteit Gent. Oorspronkelijk stond WPI voor Werkgroep Publieke Informatica en hostten wij de eerste mailserver van de UGent. -

+

+ Zeus WPI is de werkgroep informatica van de Universiteit Gent. Oorspronkelijk stond WPI voor Werkgroep Publieke Informatica en hostten wij de eerste mailserver van de UGent. +

-

- Wij zijn studenten die het gebruik van Free and Open Source Software (FOSS) promoten, lessen geven over nuttige software als LaTeX en introducties geven tot programmeertalen zoals Python, Ruby of PHP. Daarnaast bieden we ook enkele diensten aan zoals shell-accounts, web-hosting, git-repositories, enz. Doorheen het academiejaar engageren we ons ook in verschillende projecten, zo zijn we sinds enkele jaren verantwoordelijk voor het telsysteem van de 12Urenloop of ondersteunen we het FaculteitenKonvent bij ICT-projecten. -

+

+ Wij zijn studenten die het gebruik van Free and Open Source Software (FOSS) promoten, lessen geven over nuttige software als LaTeX en introducties geven tot programmeertalen zoals Python, Ruby of PHP. Daarnaast bieden we ook enkele diensten aan zoals shell-accounts, web-hosting, git-repositories, enz. Doorheen het academiejaar engageren we ons ook in verschillende projecten, zo zijn we sinds enkele jaren verantwoordelijk voor het telsysteem van de 12Urenloop of ondersteunen we het FaculteitenKonvent bij ICT-projecten. +

-

- Iedereen is welkom bij Zeus WPI, ook al studeer je geen informatica. Het enige wat je nodig hebt is een gezonde dosis interesse en een beetje geeky aanleg. -

+

+ Iedereen is welkom bij Zeus WPI, ook al studeer je geen informatica. Het enige wat je nodig hebt is een gezonde dosis interesse en een beetje geeky aanleg. +

-

Het bestuur

+

Het bestuur

-Het bestuur zorgt ervoor dat alle wieltjes blijven draaien en organiseert regelmatig activiteiten voor de leden. Het bestuur voor het academiejaar 2015-2016 van Zeus WPI is. + Het bestuur zorgt ervoor dat alle wieltjes blijven draaien en organiseert regelmatig activiteiten voor de leden. Het bestuur voor het academiejaar 2015-2016 van Zeus WPI is. - + -

Zeus waar? Zeus daar!

+

Zeus waar? Zeus daar!

-

- Zeus WPI heeft een lokaal in de kelder van gebouw S9 op campus de Sterre, die door de leden liefkozend “de kelder” genoemd wordt. Daar staat het volledige computerpark van Zeus WPI. -

+

+ Zeus WPI heeft een lokaal in de kelder van gebouw S9 op campus de Sterre, die door de leden liefkozend “de kelder” genoemd wordt. Daar staat het volledige computerpark van Zeus WPI. +

-Zeus bereik je zo: + Zeus bereik je zo: - + +
diff --git a/content/assets/stylesheets/main.scss b/content/assets/stylesheets/main.scss index cd9869e..0e51b5b 100644 --- a/content/assets/stylesheets/main.scss +++ b/content/assets/stylesheets/main.scss @@ -1,252 +1,9 @@ -$zeus_orange: #FF7F00; -$event-padding: 10px; -$navbar-border-color: #CCC; -$event-border-color: #DDD; - -$cammie-controls-color: rgba(0, 0, 0, 0.60); +$zeus-orange: #FF7F00; +$orange: $zeus-orange; +$primary: $orange; @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700); +$family-sans-serif: 'Open Sans', sans-serif; -html, button, input, select, textarea, -.pure-g [class *= "pure-u"] { - font-family: 'Open Sans', sans-serif; -} - -html, body { - width: 100%; - height: 100%; - - color: #444; -} - -h1, h2, strong { - color: #222; -} - -#container { - height: 700px; - margin-top: 35px; -} - -#logo { - height: 150px; -} - -a, a:hover, a:visited, a:link, a:active { - color: $zeus_orange; -} - -#logos { - display: inline-block; - color: black; - - a, a:hover, a:visited, a:link, a:active { - text-decoration: none; - color: currentColor; - } - - .logo-link { - margin-left: 10px; - transition: 0.2s; - - &:hover { - color: $zeus_orange; - transition: 0.2s; - } - } -} - -.header-top { - display: flex; - justify-content: space-between;; - align-items: flex-end; - -} - -#navbar { - border-top: 1px solid $navbar-border-color; - border-bottom: 1px solid $navbar-border-color; - padding-top: 7px; - padding-bottom: 7px; - - color: black; - - display: flex; - justify-content: space-around; - - margin-bottom: $event-padding * 2; - margin-top: $event-padding * 2; - - - a { - padding: 8px; - transition: 0.2s; - - font-variant: small-caps; - font-size: 1.25em; - - &, &:hover, &:visited, &:link, &:active { - text-decoration: none; - color: black; - } - &:hover { - background-color: $zeus_orange; - transition: 0.2s; - color: white; - } - } -} - -#all-events { - margin-left: -10px; - margin-right: -10px; - - .event { - border: 2px solid $event-border-color; - position: relative; - - overflow: hidden; - - height: 200px; - margin: $event-padding; - - &:after { - content: '\A'; - position: absolute; - width: 100%; height:100%; - top:0; left:0; - background:rgba(0,0,0,0.6); - opacity: 0; - transition: all 0.5s; - -webkit-transition: all 0.5s; - } - &:hover:after { - opacity: 1; - } - } -} - - -#event-banner { - position: fixed; - min-width: 100%; -} - -#event-description { - padding: 20px; -} - -#event-info { - padding-top: 20px; -} - -#event-content { - position: absolute; - top: 500px; - background-color: white; - height: 100vh; - - border-top: 2px solid $navbar-border-color; -} - -#event-title { - text-align: center; - font-size: 50px; - line-height: 50px; -} - -#sticky.stick { - position: fixed; - top: 0; - z-index: 10000; - width: 100%; - background-color: white; -} - -#cammie { - object-fit: contain; - max-width: 100%; - height: auto; -} -.fullpage { - min-width: 100%; - min-height: 100%; - display: flex; - flex-direction: column; - justify-content: center; - background-color: black; -} - -.ctrl { - background-color: $cammie-controls-color; - color: white; - position: absolute; - z-index: 100; - - // Chevron centering - display: flex; - justify-content: center; - align-items: center; - - &:hover { - background-color: $zeus_orange; - z-index: 200; - cursor: pointer; - } -} - -#left { - height: 100%; - width: 100px; - top: 0; - left: 0; -} - -#right { - height: 100%; - width: 100px; - top: 0; - right: 0; -} - -#up { - height: 100px; - width: 100%; - top: 0; -} - -#down { - height: 100px; - width: 100%; - bottom: 0; -} - - -.project-card { - background-color: #2D5CB4; - color: white; - height: 300px; - - margin-top: 5px; - margin-bottom: 5px; - - display: flex; - justify-content: space-between; - - .project-title { - background: #1e3c72; /* fallback for old browsers */ - background: -webkit-linear-gradient(to left, #1e3c72 , #2a5298); /* Chrome 10-25, Safari 5.1-6 */ - background: linear-gradient(to left, #1e3c72 , #2a5298); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ - - font-size: 4em; - padding: 20px; - flex-grow: 1; - } - - .project-description { - background-color: #1e3c72; - text-align: right; - padding: 20px; - width: 700px; - } -} +@import "old"; +@import "../../../node_modules/bulma/bulma"; diff --git a/content/assets/stylesheets/old.scss b/content/assets/stylesheets/old.scss new file mode 100644 index 0000000..3c19a70 --- /dev/null +++ b/content/assets/stylesheets/old.scss @@ -0,0 +1,218 @@ +$zeus_orange: #FF7F00; +$event-padding: 10px; +$navbar-border-color: #CCC; +$event-border-color: #DDD; + +$cammie-controls-color: rgba(0, 0, 0, 0.60); + +img { + max-width: 200px; +} + +.fa-ul { + list-style: none !important; + + .fa { + font-size: inherit; + } +} + +#logos { + display: inline-block; + color: black; + + a, a:hover, a:visited, a:link, a:active { + text-decoration: none; + color: currentColor; + } + + .logo-link { + margin-left: 10px; + transition: 0.2s; + + &:hover { + color: $zeus_orange; + transition: 0.2s; + } + } +} + +.header-top { + display: flex; + justify-content: space-between; + align-items: flex-end; + +} + +#navbar { + a { + padding: 8px; + transition: 0.2s; + + font-variant: small-caps; + font-size: 1.25em; + + &, &:hover, &:visited, &:link, &:active { + text-decoration: none; + } + &:hover { + background-color: $zeus_orange; + transition: 0.2s; + color: white; + } + } +} + +/*#all-events { + margin-left: -10px; + margin-right: -10px; + + .event { + border: 2px solid $event-border-color; + position: relative; + + overflow: hidden; + + height: 200px; + margin: $event-padding; + + &:after { + content: '\A'; + position: absolute; + width: 100%; height:100%; + top:0; left:0; + background:rgba(0,0,0,0.6); + opacity: 0; + transition: all 0.5s; + -webkit-transition: all 0.5s; + } + &:hover:after { + opacity: 1; + } + } +}*/ + + +#event-banner { + position: fixed; + min-width: 100%; +} + +#event-description { + padding: 20px; +} + +#event-info { + padding-top: 20px; +} + +#event-content { + position: absolute; + top: 400px; + background-color: white; + height: 100vh; + + border-top: 2px solid $navbar-border-color; +} + +#event-title { + text-align: center; + font-size: 50px; + line-height: 50px; +} + +#sticky.stick { + position: fixed; + top: 0; + z-index: 10000; + width: 100%; + background-color: white; +} + +#cammie { + object-fit: contain; + max-width: 100%; + height: auto; +} +.fullpage { + min-width: 100%; + min-height: 100%; + display: flex; + flex-direction: column; + justify-content: center; + background-color: black; +} + +.ctrl { + background-color: $cammie-controls-color; + color: white; + position: absolute; + z-index: 100; + + // Chevron centering + display: flex; + justify-content: center; + align-items: center; + + &:hover { + background-color: $zeus_orange; + z-index: 200; + cursor: pointer; + } +} + +#left { + height: 100%; + width: 100px; + top: 0; + left: 0; +} + +#right { + height: 100%; + width: 100px; + top: 0; + right: 0; +} + +#up { + height: 100px; + width: 100%; + top: 0; +} + +#down { + height: 100px; + width: 100%; + bottom: 0; +} + + +.project-card { + background-color: #2D5CB4; + color: white; + height: 300px; + + margin-top: 5px; + margin-bottom: 5px; + + display: flex; + justify-content: space-between; + + .project-title { + background: #1e3c72; /* fallback for old browsers */ + background: -webkit-linear-gradient(to left, #1e3c72 , #2a5298); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to left, #1e3c72 , #2a5298); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + + font-size: 4em; + padding: 20px; + flex-grow: 1; + } + + .project-description { + background-color: #1e3c72; + text-align: right; + padding: 20px; + width: 700px; + } +} diff --git a/content/index.erb b/content/index.erb index f06390e..048aec5 100644 --- a/content/index.erb +++ b/content/index.erb @@ -1,9 +1,15 @@ -
- <%= render '/partials/_tile.*', article: sorted_articles[0] %> -
+
+
+
+ <%= render '/partials/_tile.*', article: sorted_articles[0] %> +
+
+
<% sorted_articles[1..-1].each do |article| %> -
- <%= render '/partials/_tile.*', article: article %> +
+
+ <%= render '/partials/_tile.*', article: article %> +
<% end %>
diff --git a/content/projects.erb b/content/projects.erb index 384140d..cbbaa68 100644 --- a/content/projects.erb +++ b/content/projects.erb @@ -1,15 +1,14 @@ <% 5.times do %> -
-
- Hydra +
+
+
+

+ Hydra +

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus facere, ut in magnam harum at, aliquam nostrum totam tempore distinctio explicabo natus quis pariatur quos maiores dignissimos inventore! Ad amet harum ipsum laudantium modi ipsa dolores, omnis impedit nostrum expedita sed molestias similique veritatis, quo explicabo odit minus cum quibusdam accusamus beatae quam vitae cumque ipsam eius. Alias ipsam blanditiis deleniti nam magni veritatis, quas quae. Quam quia at tempora repellat optio aliquam, quasi deserunt esse distinctio voluptate harum hic sed vel blanditiis nam modi fuga, totam neque vero! Sunt, ipsum sit! Libero quam temporibus deserunt, quo itaque perspiciatis earum. +

+
-
-

- Dit is een heel cool project enal -

-

- Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus facere, ut in magnam harum at, aliquam nostrum totam tempore distinctio explicabo natus quis pariatur quos maiores dignissimos inventore! Ad amet harum ipsum laudantium modi ipsa dolores, omnis impedit nostrum expedita sed molestias similique veritatis, quo explicabo odit minus cum quibusdam accusamus beatae quam vitae cumque ipsam eius. Alias ipsam blanditiis deleniti nam magni veritatis, quas quae. Quam quia at tempora repellat optio aliquam, quasi deserunt esse distinctio voluptate harum hic sed vel blanditiis nam modi fuga, totam neque vero! Sunt, ipsum sit! Libero quam temporibus deserunt, quo itaque perspiciatis earum. -

-
-
+ <% end %> diff --git a/layouts/default.erb b/layouts/default.erb index 34146ab..9dc6059 100644 --- a/layouts/default.erb +++ b/layouts/default.erb @@ -8,9 +8,6 @@ Zeus WPI | <%= item[:title] || 'Werkgroep Informatica van de Universiteit Gent' %> - - - diff --git a/layouts/eventpost.erb b/layouts/eventpost.erb index d876b11..18c5d08 100644 --- a/layouts/eventpost.erb +++ b/layouts/eventpost.erb @@ -5,33 +5,41 @@ <% end %> + +
+
<%= render '/partials/_navbar.*' %>
-
- -
-
-
-
- <%= yield %> -
-
+
+
+

+ <%= item[:title] %> +

+

+
    +
  • <%= item[:time] %>
    • +
  • <%= item[:location] %>
    • +
+

-
+
+
+ +
+
+ +
+ <%= yield %> +
+
  • <%= item[:time] %>
  • <%= item[:location] %>
-
+ diff --git a/layouts/generic.erb b/layouts/generic.erb index cc330e9..d10ffd5 100644 --- a/layouts/generic.erb +++ b/layouts/generic.erb @@ -1,31 +1,17 @@ -
-
-
-
-
- - - - -
- - <%= render '/partials/_navbar.*' %> -
-
- <%= yield %> -
-
+
+
+ <%= render '/partials/_navbar.*' %> +
+
+ <%= yield %> +
+
+
+
+

+ Made with by Zeus WPI +

+
+
+
diff --git a/layouts/partials/_navbar.erb b/layouts/partials/_navbar.erb index 8d4a472..69494d6 100644 --- a/layouts/partials/_navbar.erb +++ b/layouts/partials/_navbar.erb @@ -1,17 +1,47 @@ -