Skip to content

Commit 37c00e9

Browse files
MagnusUclMagnusUcl
committed
2 parents fa74a86 + b749a42 commit 37c00e9

9 files changed

+143
-12
lines changed

‎img/clock.png

716 Bytes
Loading

‎img/coin-icon.png

769 Bytes
Loading

‎img/shopping-purse-icon.png

714 Bytes
Loading

‎img/step2.png

327 KB
Loading

‎img/vorktoj.png

134 KB
Loading

‎img/vorktoj.psd

670 KB
Binary file not shown.

‎index.html

+1
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@ <h2>Katagorier</h2>
8181
</div>
8282
</div>
8383
</nav>
84+
8485
<div class="bg-modal">
8586
<div class="modal-contents">
8687

‎projektet.html

+88-8
Original file line numberDiff line numberDiff line change
@@ -27,21 +27,101 @@
2727
</div>
2828

2929
<div id="projecticons">
30-
<a href="#"><img id="heart" src="img/heart.svg"></a>
31-
<a href="#"><img id="comment" src="img/blogging.svg"></a>
32-
<a href="#"><img id="favorite" src="img/bookmark-outline.svg"></a>
33-
<h2>Sækkepude i flot mønstret stof</h2>
34-
<h3>126 synes godt om</h3>
35-
<h3><a href="#" id="profilebutton"><span id="name">Strikkepigen</span></a> Sjovt lille projekt, meget tilfreds</h3>
36-
<a href="#" id="kommentar"><h3>Vis kommentarer(7)</h3></a>
30+
<div class="icons1">
31+
<a href="#"><img id="heart" src="img/heart.svg"></a>
32+
<a href="#"><img id="comment" src="img/blogging.svg"></a>
33+
34+
<div class="iconsleft">
35+
<a href="#"><img id="favorite" src="img/bookmark-outline.svg"></a>
36+
</div>
37+
</div>
38+
39+
<div>
40+
<h2>Sækkepude i flot mønstret stof</h2>
41+
<h3>126 synes godt om</h3>
42+
<h3><a href="#" id="profilebutton"><span id="name">Strikkepigen</span></a> Sjovt lille projekt, meget tilfreds</h3>
43+
<a href="#" id="kommentar"><h3>Vis kommentarer(7)</h3></a>
44+
</div>
45+
46+
</div>
47+
48+
49+
50+
51+
<section class="tidpenge">
52+
<div>
53+
<img src="img/coin-icon.png" alt="penge">
54+
<h3>Omkostninger</h3>
55+
56+
</div>
57+
<div>
58+
<img src="img/clock.png" alt="tid">
59+
<h3>Tid</h3>
60+
</div>
61+
</section>
62+
63+
<section class="mat">
64+
<h2>materialer</h2>
65+
<div class="ikonkruv">
66+
<img src="img/shopping-purse-icon.png" alt="shop ikon">
67+
<p>læg alt i kruv</p>
68+
</div>
69+
<li>
70+
<div class="item-mat1"><h3>stoff med plante motiv</h3><img src="img/shopping-purse-icon.png" alt="shop ikon"></div>
71+
<div class="item-mat2"><h3>sytråd, sort</h3><img src="img/shopping-purse-icon.png" alt="shop ikon"></div>
72+
<div class="item-mat3"><h3>sækkeude, 60cm x 60cm</h3><img src="img/shopping-purse-icon.png" alt="shop ikon"></div>
73+
<div class="item-mat3"><h3>lynlys 1 meter</h3><img src="img/shopping-purse-icon.png" alt="shop ikon"></div>
74+
</li>
75+
<div class="btn-shop">
76+
<p>se din kurv på stof og stills webshop</p>
77+
</div>
78+
79+
</section>
80+
<div class="gains">
81+
82+
</div>
83+
<section class="tools">
84+
<div><h2>Værktøj</h2></div>
85+
86+
<div class="imgtool">
87+
<img src="img/vorktoj.png" alt="værktøj">
88+
</div>
89+
<div>
90+
<ul>
91+
<li>opsprætter</li>
92+
<li>saks</li>
93+
<li>kniv</li>
94+
<li>tang</li>
95+
<li>målebånd</li>
96+
</ul>
97+
</div>
98+
</section>
99+
<section class="step1">
100+
<div class="imgstep1">
101+
<img src="img/step2.png" alt="step 1 billede">
102+
</div>
103+
104+
<div class="tesktbox1">
105+
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nihil, nobis repudiandae. Voluptatum nisi deleniti maxime sunt, totam iusto non. Consectetur eius alias possimus veritatis, at distinctio molestiae natus qui quasi cum eveniet nemo.</p>
106+
</div>
107+
108+
</section>
109+
<div class="gains">
110+
111+
112+
113+
114+
115+
116+
37117
</div>
38118

39119
<nav>
40120
<div class="navbarbottom">
41121

42122
<div class="item1">
43123
<a href="#"><img src="img/home red.svg"></a>
44-
<div><h2>hjem</h2></div>
124+
<div><h2>Hjem</h2></div>
45125
</div>
46126
<div class="item2">
47127
<a href="#"><img src="img/bookmark-ribbon%20red.svg"></a>

‎style.css

+54-4
Original file line numberDiff line numberDiff line change
@@ -132,17 +132,17 @@ body {
132132
#projecticonstwo{
133133
width: 100%;
134134
height: 350px;
135-
position: absolute;
135+
position: absolute ;
136136
}
137137

138138
#heart{
139139
width: 8%;
140-
position: absolute;
140+
position:absolute ;
141141
padding: 10px 10px 10px 15px;
142142
}
143143
#comment{
144144
width: 7.9%;
145-
position: absolute;
145+
position:absolute ;
146146
padding: 10px 10px 10px 90px;
147147
}
148148
#favorite{
@@ -460,14 +460,64 @@ input {
460460
grid-area:showcase; */
461461

462462

463-
/* opret projekt */
464463

465464

466465

466+
/* enkelt projekt */
467+
468+
469+
.btn-shop{
470+
width: 80%;
471+
text-align: center;
472+
background-color: var(--lysred);
473+
color: var(--primary);
474+
border-radius: 3px;
475+
display:block;
476+
margin:auto;
477+
color: #fff;
478+
padding: 1px;
479+
480+
481+
}
482+
.btn-shop:hover{
483+
width: 80%;
484+
text-align: center;
485+
background-color: black;
486+
color: var(--primary);
487+
border-radius: 3px;
488+
display:block;
489+
margin:auto;
490+
color: #fff;
491+
padding: 1px;
492+
493+
494+
}
467495

468496

497+
.tidpenge{
498+
margin-top: 250px;
499+
padding: 20px;
500+
display: grid;
501+
grid-template-columns: 1fr 1fr;
502+
align-items: center;
503+
}
504+
.tidpenge div{
505+
padding: 10px;
506+
align-items: center;
507+
508+
509+
}
510+
.tidpenge img{
511+
display: flex;
512+
justify-content: center;
469513

514+
}
470515

516+
.ganins{
517+
height: 5px;
518+
border-bottom: 1px solid gainsboro;
519+
display:block ;
520+
}
471521

472522

473523

0 commit comments

Comments
 (0)