-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
109 lines (108 loc) · 2.83 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html>
<head>
<title>kiko</title>
<style>
.helaSkärmen{
display: flex;
justify-content: center;
}
.circle{
display: flex;
width: 400px;
height: 400px;
background-color: rgb(34, 61, 210);
border-radius:50%;
}
.minBild{
width: 390px;
height: 390px;
border-radius: 50%;
}
/* CSS kodar till knapper finns här.
Icon på knapper ska fixas!!!!!!!
*/
.gitBt{
width: 90px;
height: 30px;
background-color: rgb(67, 67, 70);
color: white;
border-radius: 10px;
cursor: pointer;
}
.gitBt:hover{
background-color: white;
color: rgb(67, 67, 70);
}
.dcBt{
width: 90px;
height: 30px;
background-color: rgb(99, 99, 157);
color: white;
border-radius: 10px;
cursor: pointer;
}
.dcBt:hover{
background-color: white;
color: rgb(99, 99, 157);
}
.liBt{
width: 90px;
height: 30px;
background-color: rgb(33, 33, 202);
color: white;
border-radius: 10px;
cursor: pointer;
}
.liBt:hover{
background-color: white;
color: rgb(33, 33, 202);
}
.ytBt{
width: 90px;
height: 30px;
background-color: rgb(249, 11, 11);
color: white;
border-radius: 10px;
cursor: pointer;
}
.ytBt:hover{
background-color: white;
color: rgb(249, 11, 11);
}
</style>
</head>
<body>
<dev class="helaSkärmen">
<div class="TextKontainer">
<p class="textNamn">
Hej, Nasrolla heter jag!
</p>
<h1 class="textSudent">
Studerar på lernia <br> some systemutvecklare i JavaScript
</h1>
<p>
Jag är 27 år och studerar system utvecklare på lernia med tänkan på att bli fullstack dev. klicka på knappen nedan för mer info.
</p>
<button class ="gitBt">GitHub
<ion-icon name="logo-github"></ion-icon>
</button>
<button class ="dcBt">Discord
<ion-icon name="logo-discord"></ion-icon>
</button>
<button class ="liBt">Linkedin
<ion-icon name="logo-linkedin"></ion-icon>
</button>
<button class ="ytBt">YouTube
<ion-icon name="logo-youtube"></ion-icon>
</button>
</div>
<!--bakrund circle behöver fixas! alainment kaos.-->
<dev class="circle">
<img class="minBild" src="bilder/minBild.jpeg">
</dev>
</dev>
<script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
</body>
</html>