2020-06-06 01:01:37 +02:00
<!doctype html>
< html >
< head >
< title > Bootstrap shopping list< / title >
< meta charset = "utf-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1, shrink-to-fit=no" >
< link rel = "stylesheet" href = "../css/custom.css" >
< / head >
< body >
<!-- navbar -->
2020-06-06 18:50:28 +02:00
< nav class = "navbar navbar-expand-sm navbar-light bg-gradient-primary sticky-top" >
2020-06-06 01:01:37 +02:00
< button class = "navbar-toggler" type = "button" data-toggle = "collapse" data-target = "#navbarSupportedContent" aria-controls = "navbarSupportedContent" aria-expanded = "false" aria-label = "Toggle navigation" >
< span class = "navbar-toggler-icon" > < / span >
< / button >
< div class = "collapse navbar-collapse" id = "navbarSupportedContent" >
< ul class = "navbar-nav mr-auto" >
< li class = "nav-item active dropdown" >
< a class = "nav-link dropdown-toggle" href = "#" id = "navbarDropdown" role = "button" data-toggle = "dropdown" aria-haspopup = "true" aria-expanded = "false" >
Obst und Gemüse
< / a >
< div class = "dropdown-menu" aria-labelledby = "navbarDropdown" >
< a class = "dropdown-item" href = "#" > Frühling< / a >
< a class = "dropdown-item" href = "#" > Sommer< / a >
< a class = "dropdown-item" href = "#" > Herbst< / a >
< a class = "dropdown-item" href = "#" > Winter< / a >
< / div >
< / li >
< li class = "nav-item dropdown" >
< a class = "nav-link dropdown-toggle" href = "#" id = "navbarDropdown" role = "button" data-toggle = "dropdown" aria-haspopup = "true" aria-expanded = "false" >
Milchprodukte
< / a >
< div class = "dropdown-menu" aria-labelledby = "navbarDropdown" >
< a class = "dropdown-item" href = "#" > Milch< / a >
< a class = "dropdown-item" href = "#" > Jogurt< / a >
< a class = "dropdown-item" href = "#" > Käse< / a >
< / div >
< / li >
2020-06-06 18:50:28 +02:00
< li class = "nav-item dropdown" >
< a class = "nav-link dropdown-toggle" href = "#" id = "navbarDropdown" role = "button" data-toggle = "dropdown" aria-haspopup = "true" aria-expanded = "false" >
Fleisch
< / a >
< div class = "dropdown-menu" aria-labelledby = "navbarDropdown" >
< a class = "dropdown-item" href = "#" > Grill< / a >
< a class = "dropdown-item" href = "#" > Wurst< / a >
< a class = "dropdown-item" href = "#" > Braten< / a >
< / div >
< / li >
2020-06-06 01:01:37 +02:00
< / ul >
< / div >
< / nav >
2020-06-06 18:50:28 +02:00
<!-- carousel -->
2020-06-06 01:01:37 +02:00
< div id = "carouselExampleControls" class = "carousel slide" data-ride = "carousel" >
< div class = "carousel-inner" >
< div class = "carousel-item active" >
< img src = "./img/veg1.jpg" class = "d-block w-100 carousel-img" alt = "vegetables" >
< / div >
< div class = "carousel-item" >
< img src = "./img/veg2.jpg" class = "d-block w-100 carousel-img" alt = "vegetables" >
< / div >
< div class = "carousel-item" >
< img src = "./img/veg3.jpg" class = "d-block w-100 carousel-img" alt = "vegetables" >
< / div >
< / div >
< a class = "carousel-control-prev" href = "#carouselExampleControls" role = "button" data-slide = "prev" >
< span class = "carousel-control-prev-icon" aria-hidden = "true" > < / span >
< span class = "sr-only" > Previous< / span >
< / a >
< a class = "carousel-control-next" href = "#carouselExampleControls" role = "button" data-slide = "next" >
< span class = "carousel-control-next-icon" aria-hidden = "true" > < / span >
< span class = "sr-only" > Next< / span >
< / a >
< / div >
2020-06-06 18:50:28 +02:00
<!-- shopping list -->
< div class = "container-fluid p-3" >
< div class = "row" >
< div class = "col-sm-12" >
< h1 class = "text-center display-4" > Frühling< / h1 >
< hr >
< / div >
< div class = "col-sm-8" >
< table class = "table table-striped" >
< thead >
< tr >
< th scope = "col" > Sorte< / th >
< th scope = "col" > Beschreibung< / th >
< th scope = "col" > Eingekauft?< / th >
< / tr >
< / thead >
< tbody >
< tr >
< th scope = "row" class = "align-middle" > Spargel < / th >
< td class = "align-middle" > Die besonders schmackhaften Keime der Spargelpflanze landen im Frühling gerne in den Küchen von Spitzenrestaurants. Warum also auch nicht zu Hause zubereiten? < / td >
< td class = "custom-checkbox align-middle" > < input type = "checkbox" aria-label = "Checkbox for status shopped" > < / td >
< / tr >
< tr >
< th scope = "row" class = "align-middle" > Erdbeeren < / th >
< td class = "align-middle" > Jeder kennt sie jeder liebt sie - und als Nachtisch nach dem Spargel optimal! < / td >
< td class = "custom-checkbox align-middle" > < input type = "checkbox" aria-label = "Checkbox for status shopped" > < / td >
< / tr >
< / tbody >
< / table >
< / div >
< div class = "col-sm-4" >
< div class = "card" style = "max-width: 18rem;" >
< img src = "./img/asparagus.jpg" class = "card-img-top card-img-dim" alt = "Spargel" >
< div class = "card-body" >
< p class = "card-text" > Spargel ist im Frühling besonders begehrt, weil es ihn nur von etwa Mitte April bis zum 26. Juni gibt.< / p >
< / div >
< / div >
< / div >
< / div >
< / div >
2020-06-06 01:01:37 +02:00
<!-- scripts -->
< script src = "../node_modules/jquery/dist/jquery.js" > < / script >
< script src = "../node_modules/popper.js/dist/popper.js" > < / script >
< script src = "../node_modules/bootstrap/dist/js/bootstrap.js" > < / script >
< / body >
< / html >