maggicl/theshell.ch
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

css-team: do homepage

Browse source 
git-svn-id: svn+ssh://atelier.inf.usi.ch/home/bevilj/group-1@140 a672b425-5310-4d7a-af5c-997e18724b81
This commit is contained in:
britea 2018-11-12 12:48:24 +00:00
parent ead6349b9a
commit d667ce5ef9
6 changed files with 89 additions and 3 deletions

63
site/_layouts/home.html
View file

@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>
{% include head.html %}
<body onload="typing_shell()" style="background-color:#000;">
<header class="spec-header">
<div class="search-box" style="text-align:right;">
<input type="text" id="search-bar"><label for="search-bar"><img src="/assets/style/search_icon.png"></label>
<ul id="search-results"></ul>
</div>
<div><h1 id="title-home" style="display:inline-block;"></h1><span id="blikli"></span></div>
</header>
<main class="container">
{{ content }}
</main>
{% include footer.html %}
<script src="https://cdn.rawgit.com/christian-fei/Simple-Jekyll-Search/master/dest/simple-jekyll-search.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var searchBar = document.getElementById('search-bar');
var results = document.getElementById('search-results');
var sjs = SimpleJekyllSearch({
searchInput: searchBar,
resultsContainer: results,
json: '/search.json',
searchResultTemplate:
'<li><a href="{url}"><h3>{title}</h3><h4>{category}</h4></a></li>',
success: function(sr) {
results.setAttribute("class", sr.length <= 1 ? "" : "show");
}
});
searchBar.addEventListener('keypress', function () {
sjs.search();
});
});
var sentence =["T", "H", "E", " ", "S", "H", "E", "L", "L"];
var shell = "";
var counter = 0;
function typing_shell(){
if(counter < 9){
write(counter);
counter++;
}else{
document.getElementById("blikli").classList.add("bli");
}
}
setInterval(
typing_shell
, 200);
function write(position){
shell = shell + sentence[position];
document.getElementById("title-home").innerHTML = shell;
}
</script>
</body>

4
site/_sass/_global.scss
View file

@ -28,6 +28,10 @@ main {
padding-bottom: 2em;
}
.post-content{
line-height: 25px;
}
a {
color: #6a6;
}

7
site/_sass/_header.scss
View file

@ -126,3 +126,10 @@ header{
display: block;
}
}
@keyframes cursor {
from, to { border-color: transparent }
20% { border-color: orange; }
}

5
site/_sass/_home.scss
View file

@ -6,6 +6,7 @@
}
.home-tile {
display:block;
text-align: center;
font-size: 1rem;
margin: .5em;
@ -35,6 +36,10 @@
width: 100%;
}
.hide{
opacity:0;
}
@media screen and (max-width: 500px) {
.home-tiles {

7
site/_sass/_topics.scss
View file

@ -59,3 +59,10 @@
padding: 20px;
margin: 50px 0;
}
.bli:after{
content:"_";
font-size:9vh;
animation: blink 800ms linear infinite;
}

6
site/index.html
View file

@ -1,12 +1,12 @@
---
layout: main
layout: home
category: nosearch
author: A bunch of people
title: Home page
---
<video autoplay muted loop id="videoHome">
<!--<video autoplay muted loop id="videoHome">
<source src="assets/style/prew.mp4" type="video/mp4">
</video>
</video>-->
<div class="home-tiles">