Project Management
For our FabAcademy website, I had to set up a git repository. To do this I had to first install git on my computer. There are differneces between windows and mac computer. I have used a mac, so I just installed git from the official website: "https://git-scm.com".
For initalizing a git folder I had to open the terminal and navigate to a folder of my choice.
 cd Douments/Website 

Now I initialized my local git folder
 git init 

and finally I cloned the git repository using the repository link
 git clone git@gitlab.fabcloud.org:academany/fabacademy/2019/labs/kamplintfort/students/hakan-zayin.git 

Now the connection to the git repository was completed. I personally am used to html more, so I decided to push up my own website. To do this I had to remove the website that is inside of the repository.
Attention: only delete old website files, do not delete mkdocs, README or requirements file. Put all the files into the docs folder!

Using git

First things first I had to add everything inside my git folder to the repository, using the "." menas selecting everything.
 git add . 

After using commands in the git console, dont matter if deleting or adding files, I needed to commit my changes.
 git commit -m "commit message" 

now I can push my files for the first time.
Attention : It is possible that git wants you to pull first before you can push!
 git push 

When the push is complete my website should be updated after a few minutes.

MY WEBSITE

I did not want to use any framework to do the design so I made a design on my own, because every framkework website looks exaclty like every other website made with that framework and I wanted to change that. I have used sublime text as a programming software, a simple code editor. I prefer using sublime text because it has a very simple interface and is perfect for web development, also it has a lot of plugins which will make the work easier and faster to finish.
The code on my website is quite easy to catch. I started off with declaring a background image in the css file.

 
		body{
		width: 100%;
		background: url(media/background.jpg);
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		background-attachment: fixed;
		font-family: Helvetica;}
		

Then I declared a navigation bar, using a unordered list. Every list element is a href to the actual site they have to navigate.

					div class="menu">
		ul>
			li>a href="index.html">Home
			li>a href="assignments.html">Assignments
			li>a href="final.html">Final Project
			li>a href="about.html">About

		/ul>
	/div>
				

In the css file i declared the list elements to have a hover so they act like buttons

.menu ul{
	list-style: none;				//no list style
}

.menu ul li{
	display: inline-block;			//the way the content will be displayed
}

.menu ul li a{
	text-decoration: none;			//no decoration to the text
	color: #fff;					//color of the text
	font-size: 16px;				//font size
	font-weight: lighter;
	padding: 20px;					//distance to other objects
	padding-bottom: 15px;			//distance to bottom objects

}


.border{
	
	margin: 10%; 					//distance to every side
	margin-top: 10%;				//distance to top
	color: white;	

	/*background: rgba(248,248,255,0.1);*/
}
ul a.active{
	background-color: #4CAF50;		//when link is clicked
	color: white;					//staying white
}

ul a:hover:not(.active){
	background: rgba(0,0,0,0.5);	//when hovering over a link in the nav bar