codealong og oppgave
This commit is contained in:
parent
1e04ea8aa3
commit
0d48ecd36c
BIN
Codealong/bikes.webp
Normal file
BIN
Codealong/bikes.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 423 KiB |
43
Codealong/model.js
Normal file
43
Codealong/model.js
Normal file
|
@ -0,0 +1,43 @@
|
||||||
|
// Sykkelutleie
|
||||||
|
// Kunden ønsker en applikasjon som skal kunne liste opp syklene den har så andre kan leie dem. Det skal også være mulig å legge til nye sykler etterhvert.
|
||||||
|
// Lag en modell som kan fungere til teksten ovenfor
|
||||||
|
// Lag viewfunksjon for å vise frem alle syklene våre
|
||||||
|
// Lag en controllerfunksjon og et view til for å kunne legge til nye sykler
|
||||||
|
const header = document.getElementById('header');
|
||||||
|
const main = document.getElementById('main');
|
||||||
|
const input = document.getElementById('input');
|
||||||
|
const model = {
|
||||||
|
app: {
|
||||||
|
|
||||||
|
},
|
||||||
|
input: {
|
||||||
|
newBike: {
|
||||||
|
brand: '',
|
||||||
|
gears: 0,
|
||||||
|
state: '',
|
||||||
|
description: '',
|
||||||
|
isAvilable: true,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
bikes: [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
brand: 'DBS',
|
||||||
|
gears: 5,
|
||||||
|
description: '5 gir er veldig tungt',
|
||||||
|
state: 'works',
|
||||||
|
isAvilable: true,
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
brand: 'DBS',
|
||||||
|
gears: 7,
|
||||||
|
description: 'forhjulet er litt skeivt',
|
||||||
|
state: 'refurbished',
|
||||||
|
isAvilable: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
}
|
27
Codealong/style.css
Normal file
27
Codealong/style.css
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
background-image: url("bikes.webp");
|
||||||
|
background-color: chocolate;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.header {
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.main {
|
||||||
|
align-content: center;
|
||||||
|
width: 50%;
|
||||||
|
border-radius: 25%;
|
||||||
|
background-color: aliceblue;
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.main li {
|
||||||
|
font-size: x-large;
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
.input{
|
||||||
|
width: 50%;
|
||||||
|
background-color: antiquewhite;
|
||||||
|
text-align: center;
|
||||||
|
}
|
Loading…
Reference in a new issue