diff --git a/public/css/cards.css b/public/css/cards.css
index f258e3858eac894f5a939f39dd426b5f6013667e..a8f9fdd18927db64c6403784fcf2235af1c16692 100644
--- a/public/css/cards.css
+++ b/public/css/cards.css
@@ -9,7 +9,7 @@
background-clip: padding-box;
}
.card span.card-title {
- color: #fff;
+ color: #E8452B;
font-size: 24px;
font-weight: 300;
text-transform: uppercase;
@@ -49,12 +49,12 @@
padding: 16px;
}
.card .card-action a {
- color: #ffab40;
+ color: #414d70;
margin-right: 16px;
transition: color 0.3s ease;
text-transform: uppercase;
}
.card .card-action a:hover {
- color: #ffd8a6;
+ color: #1f2d54;
text-decoration: none;
}
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index e990bd92aa1ec80a382f16270b97c2de37119d6c..1470259703c61f1847f3af6f2446777b0b04267c 100644
--- a/public/index.html
+++ b/public/index.html
@@ -68,7 +68,7 @@
<p>Note: AMIV is awesome</p>
<!-- A Card -->
- <div class="col-xs-12 col-md-6">
+ <div class="col-xs-12 col-md-4 col-lg-3">
<div class="card">
<div class="card-image">
<img class="img-responsive" src="http://cdn0.wideopencountry.com/wp-content/uploads/2015/07/JamCheesecakesInAJarTall-793x526.png">
@@ -87,7 +87,7 @@
</div>
</div>
- <div class="col-xs-6 col-md-4">
+ <div class="col-xs-12 col-md-4 col-lg-3">
<div class="card">
<div class="card-image">
<img class="img-responsive" src="http://sport-fan.ch/wp/wp-content/uploads/2014/09/symbolbild_eishockey.jpg">
@@ -107,7 +107,7 @@
</div>
</div>
- <div class="col-xs-6 col-md-4">
+ <div class="col-xs-12 col-md-4 col-lg-3">
<div class="card">
<div class="card-image">
<img class="img-responsive" src="http://sport-fan.ch/wp/wp-content/uploads/2014/09/symbolbild_eishockey.jpg">
@@ -127,108 +127,160 @@
</div>
</div>
- <div class="col-xs-12 col-md-4">
+ <div class="col-xs-12 col-md-4 col-lg-3">
<div class="card">
- <p>
<a data-chrome="noheader" class="twitter-timeline" href="https://twitter.com/AMIV_ETHZ/amiv" data-widget-id="389682176024784896">Tweets from @AMIV_ETHZ</a>
- </p>
<script type="text/javascript">
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
</script>
</div>
+ </div>
+
+ <!-- A Card -->
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <div class="card-image">
+ <img class="img-responsive" src="http://cdn0.wideopencountry.com/wp-content/uploads/2015/07/JamCheesecakesInAJarTall-793x526.png">
+ <span class="card-title">Jarcakebakery @ FoodLab</span>
+ </div>
+
+ <div class="card-content">
+ <p>This is the best event like ever! You can bake some jarcakes and eat the afterwards all by yourself. </p>
+ </div>
+
+ <div class="card-action">
+ <a href="#" target="new_blank">Zum Event</a>
+ <a href="#" target="new_blank">Anmeldung</a>
+ <a href="#" target="new_blank">Im kalender speichern</a>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <div class="card-image">
+ <img class="img-responsive" src="http://sport-fan.ch/wp/wp-content/uploads/2014/09/symbolbild_eishockey.jpg">
+ <span class="card-title">Eishockey mit OpenSystems</span>
+ </div>
+
+ <div class="card-content">
+ <p>The Playoffs have begun. ANo tooth will stay at its place! </p>
+ </div>
+
+ <div class="card-action">
+ <a href="#" target="new_blank">Zum Event</a>
+ <a href="#" target="new_blank">Anmeldung</a>
+ <a href="#" target="new_blank">Im kalender speichern</a>
+ <a href="#" target="new_blank">OpenSystems</a>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <div class="card-image">
+ <img class="img-responsive" src="http://sport-fan.ch/wp/wp-content/uploads/2014/09/symbolbild_eishockey.jpg">
+ <span class="card-title">Eishockey mit OpenSystems</span>
+ </div>
+
+ <div class="card-content">
+ <p>The Playoffs have begun. ANo tooth will stay at its place! </p>
+ </div>
+
+ <div class="card-action">
+ <a href="#" target="new_blank">Zum Event</a>
+ <a href="#" target="new_blank">Anmeldung</a>
+ <a href="#" target="new_blank">Im Kalender speichern</a>
+ <a href="#" target="new_blank">OpenSystems</a>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <a data-chrome="noheader" class="twitter-timeline" href="https://twitter.com/AMIV_ETHZ/amiv" data-widget-id="389682176024784896">Tweets from @AMIV_ETHZ</a>
+ <script type="text/javascript">
+ !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
+ </script>
+ </div>
+ </div>
+
+ <!-- A Card -->
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <div class="card-image">
+ <img class="img-responsive" src="http://cdn0.wideopencountry.com/wp-content/uploads/2015/07/JamCheesecakesInAJarTall-793x526.png">
+ <span class="card-title">Jarcakebakery @ FoodLab</span>
+ </div>
+
+ <div class="card-content">
+ <p>This is the best event like ever! You can bake some jarcakes and eat the afterwards all by yourself. </p>
+ </div>
+
+ <div class="card-action">
+ <a href="#" target="new_blank">Zum Event</a>
+ <a href="#" target="new_blank">Anmeldung</a>
+ <a href="#" target="new_blank">Im kalender speichern</a>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <div class="card-image">
+ <img class="img-responsive" src="http://sport-fan.ch/wp/wp-content/uploads/2014/09/symbolbild_eishockey.jpg">
+ <span class="card-title">Eishockey mit OpenSystems</span>
+ </div>
+
+ <div class="card-content">
+ <p>The Playoffs have begun. ANo tooth will stay at its place! </p>
+ </div>
+
+ <div class="card-action">
+ <a href="#" target="new_blank">Zum Event</a>
+ <a href="#" target="new_blank">Anmeldung</a>
+ <a href="#" target="new_blank">Im kalender speichern</a>
+ <a href="#" target="new_blank">OpenSystems</a>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <div class="card-image">
+ <img class="img-responsive" src="http://sport-fan.ch/wp/wp-content/uploads/2014/09/symbolbild_eishockey.jpg">
+ <span class="card-title">Eishockey mit OpenSystems</span>
+ </div>
+
+ <div class="card-content">
+ <p>The Playoffs have begun. ANo tooth will stay at its place! </p>
+ </div>
+
+ <div class="card-action">
+ <a href="#" target="new_blank">Zum Event</a>
+ <a href="#" target="new_blank">Anmeldung</a>
+ <a href="#" target="new_blank">Im Kalender speichern</a>
+ <a href="#" target="new_blank">OpenSystems</a>
+ </div>
+ </div>
</div>
+ <div class="col-xs-12 col-md-4 col-lg-3">
+ <div class="card">
+ <a data-chrome="noheader" class="twitter-timeline" href="https://twitter.com/AMIV_ETHZ/amiv" data-widget-id="389682176024784896">Tweets from @AMIV_ETHZ</a>
+ <script type="text/javascript">
+ !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
+ </script>
+ </div>
+ </div>
+
</div>
</div>
</div>
-<!--
- <div class="row">
- <div class="col-sm-3"></div>
- <div class="col-sm-6">
- <form role="form">
- <div class="form-group">
- <label for="email">nethz-Login:</label>
- <input type="email" class="form-control loginField" id="email" name="user">
- </div>
- <div class="form-group">
- <label for="pwd">Password:</label>
- <input type="password" class="form-control loginField" id="pwd" name="password">
- </div>
- <div class="checkbox">
- <label><input type="checkbox"> Remember me</label>
- </div>
- <button type="submit" class="btn btn-default" id="loginButton">Submit</button>
- </form>
- </div>
- <div class="col-sm-3"></div>
- </div>
--->
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="bs/js/bootstrap.min.js"></script>
-<!--
- <script>
- 'use strict';
-
- var core_lib = {
- api_url: 'https://amiv-apidev.vsos.ethz.ch',
- };
-
- function log(msg, type){
- console.log(msg);
- }
-
- $('#loginButton').click(function(e){
- e.preventDefault();
- getTkn();
- });
-
- /*
- Request Function
- Attr: data, path, method.
- Callback: function that gets calle
- */
- function req(attr, callback) {
- callback = callback || function(msg) {
- console.log(msg);
- };
- $.ajax({
- url: core_lib.api_url + attr.path,
- data: attr.data,
- method: attr.method,
- dataType: 'json',
- timeout: 3000,
- headers: attr.headers,
- success: function(res) {
- callback(res);
- return true;
- },
- error: function(res) {
- if (core_lib.show_errors) console.log(res);
- callback(res);
- return false;
- },
- });
- }
-
- function getTkn(){
- var curData = {};
- $('.loginField').each(function(){
- curData[$(this).attr('name')] = $(this).val();
- });
- req({
- path: '/sessions/',
- method: 'POST',
- data: JSON.stringify(curData),
- headers: {
- 'Content-Type': 'application/json',
- }
- }, function(ret){
- console.log(ret);
- });
- }
- </script>
--->
-
+
</body>
</html>
\ No newline at end of file
diff --git a/public/js/color.js b/public/js/color.js
new file mode 100644
index 0000000000000000000000000000000000000000..b5f8b6625c558448b61ee54fbaff453697faa3be
--- /dev/null
+++ b/public/js/color.js
@@ -0,0 +1,49 @@
+// coloraverager for Cardtitles
+function getAverageRGB(imgEl) {
+
+ var blockSize = 5, // only visit every 5 pixels
+ defaultRGB = {r:0,g:0,b:0}, // for non-supporting envs
+ canvas = document.createElement('canvas'),
+ context = canvas.getContext && canvas.getContext('2d'),
+ data, width, height,
+ i = -4,
+ length,
+ rgb = {r:0,g:0,b:0},
+ count = 0;
+
+ if (!context) {
+ return defaultRGB;
+ }
+
+ height = canvas.height = imgEl.naturalHeight || imgEl.offsetHeight || imgEl.height;
+ width = canvas.width = imgEl.naturalWidth || imgEl.offsetWidth || imgEl.width;
+
+ context.drawImage(imgEl, 0, 0);
+
+ try {
+ data = context.getImageData(0, 0, width, height);
+ } catch(e) {
+ /* security error, img on diff domain */
+ return defaultRGB;
+ }
+
+ length = data.data.length;
+
+ while ( (i += blockSize * 4) < length ) {
+ ++count;
+ rgb.r += data.data[i];
+ rgb.g += data.data[i+1];
+ rgb.b += data.data[i+2];
+ }
+
+ // ~~ used to floor values
+ rgb.r = ~~(rgb.r/count);
+ rgb.g = ~~(rgb.g/count);
+ rgb.b = ~~(rgb.b/count);
+
+ //Farbe in cards.css ändern
+ document.getElementById("cardtitle").style.color = rgb;
+
+ return rgb;
+
+}
\ No newline at end of file