Skip to content

Instantly share code, notes, and snippets.

@aimore

aimore/doc.js

Last active June 20, 2016 17:20
Show Gist options
  • Save aimore/7934d415b98ff29a6b8436b111786a92 to your computer and use it in GitHub Desktop.
Save aimore/7934d415b98ff29a6b8436b111786a92 to your computer and use it in GitHub Desktop.
Download ZIP
Personal Page - codecommunity.info
Raw
doc.js
$(function () {
var all_classes = "";
var timer = undefined;
$.each($('li', '.social-class'), function (index, element) {
all_classes += " btn-" + $(element).data("code");
});
$('li', '.social-class').mouseenter(function () {
var icon_name = $(this).data("code");
if ($(this).data("icon")) {
icon_name = $(this).data("icon");
}
var icon = "<i class='fa fa-" + icon_name + "'></i>";
$('.btn-social', '.social-sizes').html(icon + "Sign in with " + $(this).data("name"));
$('.btn-social-icon', '.social-sizes').html(icon);
$('.btn', '.social-sizes').removeClass(all_classes);
$('.btn', '.social-sizes').addClass("btn-" + $(this).data('code'));
});
$($('li', '.social-class')[Math.floor($('li', '.social-class').length * Math.random())]).mouseenter();
});
Raw
index.html
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:title" content="Code Community" />
<meta property="og:description" content="Programmiere Gruppe HHU" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://codecommunity.info/" />
<title>Code Community HHU</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet" >
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-social/5.0.0/bootstrap-social.css" rel="stylesheet" >
</head>
<body>
<div class="jumbotron">
<div class="container">
<h1>The Code Community HHU</h1>
<p>
You can find more informations about the community on the <a href="https://www.facebook.com/groups/CodecommunityHHU/" target="_blank">Facebook Group</a>
</p>
<a href="mailto:Aimore.Sa.Costa@uni-duesseldorf.de?Subject=Teilnahmebest&auml;tigung" target="_top" class="btn btn-outline btn-lg"><span class="fa fa-code"></span> Join us</a>
<ul class="jumbotron-links">
<li><a href="https://www.facebook.com/groups/CodecommunityHHU/events/" target="_blank"><span class="fa fa-flag"></span> Next Meeting</a></li>
</ul>
</div>
<div class="bottom">
<iframe src="http://ghbtns.com/github-btn.html?user=aimore&amp;repo=Code-Community&amp;type=watch&amp;count=true" class="social-share"></iframe>
<a href="https://twitter.com/share" class="twitter-share-button" data-hashtags="codecommunity">Tweet</a> <script>!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 class="how-to">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h2>How to join the Community</h2>
<ol>
<li>
Click on the Join us button!
<p>
If you haven't done that already, keep in mind that you must to be a registered student in the
<a href="http://hhu.de">HHU</a>
it does not matter which course you are in, you just need to be a student in this University.
</p>
</li>
<li>
Why should you come?
<p>
We believe the best way to learn is by doing it hands-on, and to see and feel that visible progress is the best motivation to continue learning and improving. That is why I am organizing meetups to implement ideas and to share knowledge.
<code>Web Designers, Software Developers, APPs Entwickler usw.</code><br>If you don't have any experience with programming, it's never too late to try. <i class="fa fa-smile-o"></i>
</p>
<p>
We are looking for some students with <code>echo &quot;PHP experience!&quot;;</code> and
<code>System.out.println(&quot;Java experience!&quot;);</code>
</p>
</li>
<li>
And the most important thing....is to spread the word!
<p>
Invite your friend, just like it was said before everybody is more than welcome!
</p>
<pre>
<p align="left">Here you can find the <strong class="text-danger">upcoming meetups</strong> <strong class="text-info">and Events:</strong></p>
<!-- google calendar -->
<iframe src="https://calendar.google.com/calendar/embed?height=650&amp;wkst=1&amp;hl=de&amp;bgcolor=%23FFFFFF&amp;src=bhr6bn5mr9lrnaqh3k94ahaqns%40group.calendar.google.com&amp;color=%236B3304&amp;ctz=Europe%2FBerlin" style="border-width:0" width="700" height="650" frameborder="0" scrolling="no"></iframe>
</pre>
<p> And for the Informatiker:</p>
<pre>You can find more infos on the <strong class="text-danger">Fachschaft Informatik</strong> <strong class="text-info"><a href="https://hhu-fscs.de">Website</a></strong></pre>
</li>
</ol>
</div>
</div>
</div>
</div>
<footer>
<ul class="links">
<li><a href="https://www.facebook.com/groups/CodecommunityHHU" target="_blank"><span class="fa fa-facebook"></span> Facebook</a></li>
<li><a href="https://hhu.de" target="_blank"><span class="fa fa-university"></span> HHU</a></li>
<li><a href="https://github.com/aimore/Code-Community" target="_blank"><span class="fa fa-github"></span> GitHub</a></li>
<li><a href="http://opensource.org/licenses/MIT" target="_blank"><span class="fa fa-building"></span> MIT License</a></li>
<li><small>&copy; Copyright 2015, Code Community</small></li>
</ul>
</footer>
<a href="https://github.com/aimore/Code-Community" target="_blank" class="github-corner">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#151513; color:#fff; position: absolute; top: 0; border: 0; right: 0;">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path>
</svg>
</a>
<style>
.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}
</style>
<!-- Some JavaScript that is used only in this demo, not needed for the buttons -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
<script src="assets/js/docs.js"></script>
</body>
</html>
Raw
style.css
/* Aimoré Sá Costa 2016 */
body {
font-weight: 300;
-webkit-font-smoothing: antialiased
}
h2 {
text-align: center;
font-weight: 300
}
.btn-social-icon {
margin-bottom: 4px
}
.jumbotron {
position: relative;
font-size: 16px;
color: #fff;
color: rgba(255, 255, 255, 0.75);
text-align: center;
border-radius: 0;
padding-bottom: 80px;
background-image: -webkit-linear-gradient(left, #0d0d0d 0, #1a1a1a 100%);
background-image: -o-linear-gradient(left, #0d0d0d 0, #6b2e2e 100%);
background-image: linear-gradient(to right, #0d0d0d 0, #433f3c 100%);
background-repeat: repeat-x;
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#0d0d0d ', endColorstr='#6b4848', GradientType=1)
}
.jumbotron h1 {
margin-bottom: 15px;
font-weight: 300;
letter-spacing: -1px;
color: #fff
}
.jumbotron iframe {
width: 100px !important;
height: 20px !important;
border: none;
overflow: hidden;
margin: 2px
}
.jumbotron p a,
.jumbotron .jumbotron-links a {
font-weight: 500;
color: #fff
}
.jumbotron .jumbotron-links {
margin-top: 15px;
margin-bottom: 0;
padding-left: 0;
list-style: none;
font-size: 14px
}
.jumbotron .jumbotron-links li {
display: inline
}
.jumbotron .jumbotron-links li+li {
margin-left: 20px
}
.jumbotron .bottom {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 18px;
background-color: rgba(0, 0, 0, 0.2)
}
.btn-outline {
margin-top: 15px;
margin-bottom: 15px;
padding: 18px 24px;
font-size: inherit;
font-weight: 500;
color: #fff;
background-color: transparent;
border-color: #fff;
border-color: rgba(255, 255, 255, 0.5);
transition: all .1s ease-in-out
}
.btn-outline:hover,
.btn-outline:active {
color: #720e9e;
background-color: #fff;
border-color: #fff
}
.how-to {
padding: 20px
}
.how-to h2 {
text-align: center
}
.how-to li {
font-size: 21px;
line-height: 1.7;
margin-top: 20px
}
.how-to li p {
font-size: 16px;
color: #555
}
.how-to code {
font-size: 85%;
word-wrap: break-word;
white-space: normal
}
footer {
text-align: center;
opacity: 1.0;
padding: 50px;
background-image: -webkit-linear-gradient(left, #2d1006 0, #434309 100%);
background-image: -o-linear-gradient(left, #2d1006 0, #434309 100%);
background-image: linear-gradient(to right, #2d1006 0, #434309 100%);
background-repeat: repeat-x;
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#2d1006', endColorstr='#434309', GradientType=1)
}
footer a {
color: #fff
}
footer a:hover {
color: #fff
}
.links {
margin: 0;
list-style: none;
padding-left: 0
}
.links li {
color: #ffffff;
display: inline;
padding: 0 10px
}
.social-class .social-hex {
font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
font-size: 10px;
opacity: .3;
float: right
}
.social-class li {
margin-bottom: 4px
}
.social-class li:hover .social-hex {
opacity: 1
}
.social-class li:hover code {
background-color: #e8e8ee
}
.social-class code {
cursor: default
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment