Data Science

From a76caf717fd2c60f30bc62baa2522a16e4467268 Mon Sep 17 00:00:00 2001 From: Peter Wu Date: Wed, 4 Mar 2015 17:02:38 +0100 Subject: Initial commit --- images/filler.png | Bin 0 -> 6269 bytes index.html | 47 ++++++++++++++++++++++++++++++++++++++ js/main.js | 39 +++++++++++++++++++++++++++++++ pages/campus.html | 30 ++++++++++++++++++++++++ pages/career.html | 30 ++++++++++++++++++++++++ pages/curriculum.html | 30 ++++++++++++++++++++++++ pages/home.html | 43 ++++++++++++++++++++++++++++++++++ pages/studying.html | 30 ++++++++++++++++++++++++ style/colors.less | 25 ++++++++++++++++++++ style/main.less | 62 ++++++++++++++++++++++++++++++++++++++++++++++++++ style/menu.less | 28 +++++++++++++++++++++++ 11 files changed, 364 insertions(+) create mode 100644 images/filler.png create mode 100644 index.html create mode 100644 js/main.js create mode 100644 pages/campus.html create mode 100644 pages/career.html create mode 100644 pages/curriculum.html create mode 100644 pages/home.html create mode 100644 pages/studying.html create mode 100644 style/colors.less create mode 100644 style/main.less create mode 100644 style/menu.less diff --git a/images/filler.png b/images/filler.png new file mode 100644 index 0000000..8002d64 Binary files /dev/null and b/images/filler.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..9a35913 --- /dev/null +++ b/index.html @@ -0,0 +1,47 @@ + + + + + +Data Science + + + + + + + + + +

+ HIER KOMT DA SUPER MOOIE BANNER EN LOGO +

+ +

+ + + + + diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..5e6816e --- /dev/null +++ b/js/main.js @@ -0,0 +1,39 @@ +/* jshint browser:true, devel:true */ +(function() { + 'use strict'; + + /* loads a page into view and execute scripts */ + function loadContent(name, text) { + var contentElement = document.getElementById('content'); + contentElement.innerHTML = text; + document.body.dataset.page = name; + } + + /* tries to navigate to a page */ + function selectPage(page) { + var pages = 'home studying curriculum campus career'.split(' '); + if (pages.indexOf(page) == -1) { + // TODO: 404 + console.log("404 " + page); + return false; + } + console.log("Loading " + page); + var http = new XMLHttpRequest(); + http.onload = function() { + loadContent(page, http.responseText); + }; + http.open('get', 'pages/' + page + '.html'); + http.send(null); + return true; + } + + addEventListener('hashchange', function(ev) { + var m = /#\/(.+)/.exec(ev.newURL); + if (!m) + return; + selectPage(m[1]); + }); + + // Tries to load the current page, falling back to "home" for unknown URLs. + selectPage(location.hash.replace(/^#\//, '')) || selectPage('home'); +})(); diff --git a/pages/campus.html b/pages/campus.html new file mode 100644 index 0000000..59a64cd --- /dev/null +++ b/pages/campus.html @@ -0,0 +1,30 @@ +

+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et mollis lacus. +Fusce rhoncus magna vel euismod scelerisque. Ut faucibus turpis eu dui mollis +accumsan. Sed id varius ipsum, a pharetra nisi. Donec porttitor sapien id +volutpat rutrum. Curabitur tincidunt nisi ut imperdiet varius. Nulla dignissim +nunc vel sem rhoncus malesuada. Proin in bibendum lectus. Donec porta velit eu +vulputate faucibus. Donec volutpat tristique sagittis. Proin et facilisis arcu, +ut viverra neque. Fusce vel aliquam nunc. Vestibulum faucibus eleifend +consequat. +

+ +

+In ipsum dolor, malesuada non interdum vitae, accumsan et risus. Aliquam +eleifend augue in enim gravida rhoncus a vel mi. Sed non ex eros. Morbi dapibus +condimentum lacus non tempus. Vestibulum eget molestie ex. Pellentesque nunc +neque, pulvinar eget massa eu, malesuada lacinia purus. Nam a tempor metus. +Curabitur ornare consectetur dui sed tincidunt. Morbi quis volutpat urna, sed +hendrerit orci. Sed mauris nisl, laoreet eu ex eget, pellentesque elementum +elit. Curabitur lobortis metus nec felis condimentum cursus. +

+ +

+Aliquam dignissim ipsum ac metus hendrerit, a facilisis enim varius. Maecenas +nisi erat, sodales non mauris et, varius varius justo. Lorem ipsum dolor sit +amet, consectetur adipiscing elit. Curabitur mattis facilisis semper. Morbi +feugiat sagittis sem a congue. Morbi maximus vehicula faucibus. Suspendisse +lacinia mattis sagittis. Proin id feugiat ligula. Sed lorem augue, faucibus +vitae tristique a, congue et nibh. Vestibulum justo erat, dictum in vehicula ac, +venenatis sit amet ipsum. +

diff --git a/pages/career.html b/pages/career.html new file mode 100644 index 0000000..59a64cd --- /dev/null +++ b/pages/career.html @@ -0,0 +1,30 @@ +

+ +

diff --git a/pages/curriculum.html b/pages/curriculum.html new file mode 100644 index 0000000..59a64cd --- /dev/null +++ b/pages/curriculum.html @@ -0,0 +1,30 @@ +

+ +

diff --git a/pages/home.html b/pages/home.html new file mode 100644 index 0000000..7f1a66a --- /dev/null +++ b/pages/home.html @@ -0,0 +1,43 @@ + +

+Data Science is blablabla, awesome blabla bla, Natasha Stash, blabla bla, Paul +de Bra blablabla! Blablabla VLA! +

+ +

Studying

+ +jf hsunifrh gurdjhfg bd ghbhgb hb ghfbb + +

+ +

Curriculum

+ +kfr lgfjyntrkdfhg niukjdchg kdjgh dkjxhg jkdfjgi xlgk + +

+ +

Campus

+ +adfighjiuek rhtgbiutrkd hgiudjgh biukdfhxg niukd + +

+ +

Career

+ +Acjd ikt ghnriutdfhg ueih gue + +

diff --git a/pages/studying.html b/pages/studying.html new file mode 100644 index 0000000..59a64cd --- /dev/null +++ b/pages/studying.html @@ -0,0 +1,30 @@ +

+ +

diff --git a/style/colors.less b/style/colors.less new file mode 100644 index 0000000..2518b5c --- /dev/null +++ b/style/colors.less @@ -0,0 +1,25 @@ +/* Color scheme from http://paletton.com/#uid=53v0u0k7UUa3cZA5wXlaiQ5cFL3 */ + +@color-primary-0: #B5D6EB; /* Main Primary color */ +@color-primary-1: #E3F2FB; +@color-primary-2: #CDE5F5; +@color-primary-3: #9CC5E0; +@color-primary-4: #83B3D1; + +@color-secondary-1-0: #BCBFEE; /* Main Secondary color (1) */ +@color-secondary-1-1: #E6E7FC; +@color-secondary-1-2: #D2D4F6; +@color-secondary-1-3: #A6A9E5; +@color-secondary-1-4: #8F93D8; + +@color-secondary-2-0: #FFEFC0; /* Main Secondary color (2) */ +@color-secondary-2-1: #FFF8E6; +@color-secondary-2-2: #FFF4D3; +@color-secondary-2-3: #FFEAAD; +@color-secondary-2-4: #FFE59A; + +@color-complement-0: #FFE3C0; /* Main Complement color */ +@color-complement-1: #FFF4E6; +@color-complement-2: #FFECD3; +@color-complement-3: #FFDBAD; +@color-complement-4: #FFD29A; diff --git a/style/main.less b/style/main.less new file mode 100644 index 0000000..0ad9c47 --- /dev/null +++ b/style/main.less @@ -0,0 +1,62 @@ +/* main.less */ +@import "../node_modules/normalize.css/normalize.css"; +@import "colors.less"; + +/* page layout */ +body { + text-align: center; + line-height: 2em; +} + +@import "menu.less"; + +/* main content */ +main { + background: @color-secondary-1-3; + margin: auto; + padding: 1em; + border-radius: 2px; + + max-width: 800px; + text-align: left; +} + +body[data-page="home"] { + .intro { + height: 300px; + padding: 1em; + margin: 1em; + background-color: @color-secondary-2-1; + } + .block { + background: no-repeat url(../images/filler.png); + height: 200px; + background-color: @color-secondary-2-1; + padding: 1em; + margin: 1em; + + transition: background 0.2s; /* TODO floats over text */ + &:hover { + background-color: @color-secondary-2-0; + } + + p { + margin: 1em; + } + + &:nth-child(2n+1) { + padding-left: 200px; + } + &:nth-child(2n) { + background-position: right; + padding-right: 200px; + } + } +} + +/* footer */ +footer { + background: @color-secondary-1-4; +} + +/* vim: set sw=4 et ts=4: */ diff --git a/style/menu.less b/style/menu.less new file mode 100644 index 0000000..60d87ec --- /dev/null +++ b/style/menu.less @@ -0,0 +1,28 @@ +/* menu */ +@import "colors.less"; + +nav { + margin: 3em 0; + + ul { + background: @color-primary-0; + } + + li { + display: inline-block; + } + /* links */ + a:link { + margin: 3px; + padding: 0.5em 1em; + background: @color-secondary-1-1; + border-radius: 5px; + box-shadow: @color-secondary-1-2 0 0 0px 1px; + display: inline-block; + } + a:link:hover { + background: @color-secondary-1-2; + } +} + +/* vim: set sw=4 et ts=4: */ -- cgit v1.2.1