Skip to content
Snippets Groups Projects
Commit e8607ea2 authored by Julius Rajala's avatar Julius Rajala
Browse files

Initial commit.

parents
No related branches found
No related tags found
No related merge requests found
alaston_kuva*
\ No newline at end of file
# GIT tutorial
- Lataa `git` osoitteesta [https://git-scm.com/downloads](https://git-scm.com/downloads)
- Tai aja linuxilla ```$ apt install git```
- Avaa `git bash` jos olet windowsilla
## Komennot
### Conffaa gitti
```bash
$ git config --global user.name "Oma Nimi"
$ git config --global user.email "oma.nimi@omanimi.xyz"
```
### Gitin ensiajelu
```bash
# Initialisoi git repon
$ git init
# Lisää .gitignore ja valitsemasi tiedostot .gitignore -tiedostoon
$ touch .gitignore
# Valmistele tiedostot committia varten
$ git add tiedosto1.txt tiedosto2.js tiedosto3.java # . lisää kaikki
# Luo git commit
$ git commit -m "Fiksu viesti"
# Nyt voit tsekata git-logisi
$ git log # Pois pääsee kirjoittamalla :q, VIMin hyödyllisin komento
# Tsekkaa onko sulla remotea asetettuna
$ git remote -v
# Aseta itsellesi remote
$ git remote add origin https://github.com/github_tilisi/github-reposi.git
# Tsekkaa taas remote
$ git remote -v
# Ajele uudet setit sisälle
$ git push -u origin master
# Nyt kaveri kloonaa repon
$ git clone https://github.com/github_tilisi/github-reposi.git
# Kaveri luo uuden branchin
$ git checkout -b uusi-branchi
# Tee muutokset ja aja muutokset sisälle
$ git add --patch # Nyt katsotaankin blokki kerrallaan muutoksia
# Commitoi muutokset fiksulla viestillä
$ git commit -m "Uusi viesti."
# Valmista on, sit vaan hoidetaan setit eteenpäin
$ git push origin uusi-branchi
```
background.jpg

181 KiB

body {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
height: 100vh;
background: url(background.jpg) repeat repeat fixed;
background-size: cover;
}
* {
font-family: sans-serif;
box-sizing: border-box;
}
.FlashyTitle0 {
animation: colorAnimation0 .5s ease-in-out infinite;
}
.FlashyTitle1 {
animation: colorAnimation1 .5s ease-in-out infinite;
}
.Image {
display: inline-block;
height: 400px;
border-radius: 20px;
box-shadow: 5px 5px 10px 5px rgba(0,0,0,.5);
}
#title {
font-size: 50px;
color: white;
padding: 50px;
border-radius: 5px;
background: #2f2f2f;
box-shadow: 5px 5px 10px 5px rgba(0,0,0,.5);
}
#imageOfJoona {
border: 10px solid gold;
}
#imageOfJulius {
border: 10px solid cyan;
}
@keyframes colorAnimation0 {
0% {
color: black;
}
30% {
color: gold;
}
60% {
color: blue;
}
100% {
color: gold;
}
}
@keyframes colorAnimation1 {
0% {
color: lightblue;
transform: rotate(10deg);
}
30% {
transform: rotate(150deg);
color: orange;
}
60% {
transform: rotate(180deg);
color: lightblue;
}
100% {
transform: rotate(360deg);
color: salmon;
}
}
<!doctype <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Joonan ja Jullen nettisivu</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="index.css" />
</head>
<body>
<h1 id="title">Joonan ja Juliuksen kaverisivu</h1>
<div class="ImageContainer">
<img class="Image" id="imageOfJoona" src="./joona.jpg" />
<img class="Image" id="imageOfJulius" src="./julius.jpg" />
</div>
<script type="text/javascript">
(function(){
const title = document.getElementById('title');
const imageOfJoona = document.getElementById('imageOfJoona');
const imageOfJulius = document.getElementById('imageOfJulius');
const animationClassOKAY = 'FlashyTitle0';
const animationClassAWESOME = 'FlashyTitle1';
imageOfJoona.addEventListener('mouseover', () => {
title.classList.add(animationClassOKAY);
});
imageOfJulius.addEventListener('mouseover', () => {
title.classList.add(animationClassAWESOME);
});
imageOfJoona.addEventListener('mouseleave', () => {
title.classList.remove(animationClassOKAY);
});
imageOfJulus.addEventListener('mouseleave', () => {
title.classList.remove(animationClassAWESOME);
});
})();
</script>
</body>
</html>
\ No newline at end of file
joona.jpg 0 → 100644
joona.jpg

353 KiB

julius.jpg

22 KiB

0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment