Skip to content
Snippets Groups Projects
Commit b9452df4 authored by Olav Utne Skjeldal's avatar Olav Utne Skjeldal
Browse files

Fikset CSS filer og meny

parent bdd0a4a8
No related branches found
No related tags found
No related merge requests found
/* CSS under er til handlekurv.html */
.checkout{
width : 90%;
position: relative;
left: 50%;
transform: translate(-50%,0);
margin-top: 20px;
padding: 30px;
border-radius: 7px;
box-shadow: 0px 5px 5px;
background-color: #FFE119;
}
#coTimeSelect,#coBestill, #coRabattInput, .coVareKnapp{
height: 30px;
border: solid 1px;
border-radius: 5px;
background-color: #b82a31;
}
#topBox{
min-height: 200px;
}
#bottomBox{
min-height: 220px;
}
#coVarer{
position: relative;
padding-top: 50px;
padding-bottom: 50px;
padding-left: 50px;
padding-right: 50px;
min-height: 100px;
width: 100%;
border: solid 1px;
border-radius: 5px;
background-color: #b82a31;
list-style-type: none;
font-size: 22px;
}
.coVareP{
padding-top: 5px;
padding-bottom: 5px;
}
.coVareVen{
display: inline-block;
width: 80%;
}
.coVareHoy{
display: inline-block;
text-align: right;
width: 19%;
}
.coVareKnapp{
width: 30px;
text-align: center;
display: inline-block;
background-color: #FFE119;
}
#coNedeLeft{
position: absolute;
display: inline-block;
width: calc(35% - 45px);
height: calc(100% - 60px);
}
#coNedeRight{
position: absolute;
left: calc(50% + 15px);
display: inline-block;
width: calc(50% - 45px);
height: calc(100% - 60px);
}
#coLevering{
position: absolute;
width: 100%;
height: 40%;
}
#coTime{
display: table-cell;
padding-left: 20px;
vertical-align: middle;
height: 50px;
}
#coTimeSelect{
position: absolute;
transform: translate(30%,-15%);
}
#coRabatt{
position: absolute;
top: 100%;
transform: translate(0,-100%);
width: 100%;
}
#coRabattInput{
width: 100%;
margin-top: 1%;
}
.coPayList{
list-style-type: none;
display: inline-block;
}
#leftList{
position: absolute;
}
#rightList{
position: absolute;
left: 100%;
transform: translate(-100%,0);
}
.leftListPoint,.rightListPoint{
padding: 10px;
}
.rightListPoint{
text-align: right;
}
#coBestill{
width: 100%;
position: absolute;
left: 100%;
top: 100%;
transform: translate(-100%,-100%);
}
\ No newline at end of file
/* CSS below is for meny.html */
#Bmny, #Pmny, #Dmny, #DagTil{
text-align: center;
}
#Pmny li, #Bmny li, #Dmny li{
text-decoration: underline;
list-style-type: none;
margin:20px;
font-size: 23px;
font-weight: bold;
}
#pm {
font-size: 10px;
margin:0px;
padding:0px;
}
.menyNav {
position: fixed;
left: 10%;
z-index: 1;
top: 75px;
width: 10%;
background:#FFE119;
overflow-x: hidden;
padding: 8px 0px 8px 5px;
display: block;
border:ridge black;
}
.menyNav li {
margin-top: 50px;
font-size: 22px;
font-weight: bold;
}
.menyNav li a {
list-style: none;
text-decoration: none;
color:black;
}
.menyNav li a:hover {
padding: 5px;
}
.menyNav h4 {
font-size: 25px;
}
.menybutton {
position: relative, left;
margin:0px;
padding:0px;
font-size: 10px;
}
.menyListe{
width: 50%;
margin-left: auto;
margin-right: auto;
}
.menyListeVenstre{
width: 70%;
display: inline-block;
text-align: left;
}
.menyListeHoyre{
width: 29%;
display: inline-block;
text-align: right;
}
.menyLinje{
width: 100%;
height: 2px;
background-color: black;
}
.menyListeBesk{
font-size: 11px;
font-weight: bold;
}
@media screen and (max-width:900px){
.menyNav{
display:none;
}
}
/* CSS below is for om_oss.html */
#matrix {
margin-left: 15%;
margin-right: 15%;
margin-top: 3%;
margin-bottom: 3%;
background-color: #FFE119;
}
#upperDiv, #lowerDiv {
height: 450px;
}
#NW, #NE, #SW, #SE {
width: 50%;
}
#upperDiv, #lowerDiv {
position: relative;
}
#NW, #SW {
height: 100%;
}
#NE, #SE {
height: 100%;
position: absolute; right: 0px; top: 0px;
}
#burgerPic, #chefPic {
width: 100%;
height: 100%;
}
#matrix h1 {
text-align: center;
color: #b82a31;;
}
#upperDiv section, #lowerDiv section {
padding: 20px 20px;
}
@media screen and (max-width:1200px){
#SE {
overflow-y: scroll;
}
#SE::-webkit-scrollbar {
width: 10px;
}
#SE::-webkit-scrollbar-track {
background-color: #e4e4e4;
border-radius: 100px;
}
#SE::-webkit-scrollbar-thumb {
background-image: linear-gradient(180deg, RED 0%, YELLOW 99%);
box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);
border-radius: 100px;
}
}
@media screen and (max-width:925px){
#NW {
overflow-y: scroll;
}
#NW::-webkit-scrollbar {
width: 10px;
}
#NW::-webkit-scrollbar-track {
background-color: #e4e4e4;
border-radius: 100px;
}
#NW::-webkit-scrollbar-thumb{
background-image: linear-gradient(180deg, RED 0%, YELLOW 99%);
box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);
border-radius: 100px;
}
}
\ No newline at end of file
...@@ -391,183 +391,6 @@ footer { ...@@ -391,183 +391,6 @@ footer {
} }
} }
/* CSS below is for meny.html */
#Bmny, #Pmny, #Dmny, #DagTil{
text-align: center;
}
#Pmny li, #Bmny li, #Dmny li{
text-decoration: underline;
list-style-type: none;
margin:20px;
font-size: 23px;
}
#pm {
font-size: 10px;
margin:0px;
padding:0px;
}
.menyNav {
position: fixed;
left: 10%;
z-index: 1;
top: 75px;
width: 10%;
background:#FFE119;
overflow-x: hidden;
padding: 8px 0px 8px 5px;
display: block;
border:ridge black;
}
.menyNav li {
margin-top: 50px;
font-size: 22px;
}
.menyNav li a {
list-style: none;
text-decoration: none;
color:black;
}
.menyNav li a:hover {
padding: 5px;
}
.menyNav h4 {
font-size: 25px;
}
.menybutton {
position: relative, left;
margin:0px;
padding:0px;
font-size: 10px;
}
.menyListe{
width: 50%;
margin-left: auto;
margin-right: auto;
}
.menyListeVenstre{
width: 70%;
display: inline-block;
text-align: left;
}
.menyListeHoyre{
width: 29%;
display: inline-block;
text-align: right;
}
.menyLinje{
width: 100%;
height: 2px;
background-color: black;
}
.menyListeBesk{
font-size: 11px;
font-weight: bold;
}
@media screen and (max-width:900px){
.menyNav{
display:none;
}
}
/* CSS below is for om_oss.html */
#matrix {
margin-left: 15%;
margin-right: 15%;
margin-top: 3%;
margin-bottom: 3%;
background-color: #FFE119;
}
#upperDiv, #lowerDiv {
height: 450px;
}
#NW, #NE, #SW, #SE {
width: 50%;
}
#upperDiv, #lowerDiv {
position: relative;
}
#NW, #SW {
height: 100%;
}
#NE, #SE {
height: 100%;
position: absolute; right: 0px; top: 0px;
}
#burgerPic, #chefPic {
width: 100%;
height: 100%;
}
#matrix h1 {
text-align: center;
color: #b82a31;;
}
#upperDiv section, #lowerDiv section {
padding: 20px 20px;
}
@media screen and (max-width:1200px){
#SE {
overflow-y: scroll;
}
#SE::-webkit-scrollbar {
width: 10px;
}
#SE::-webkit-scrollbar-track {
background-color: #e4e4e4;
border-radius: 100px;
}
#SE::-webkit-scrollbar-thumb {
background-image: linear-gradient(180deg, RED 0%, YELLOW 99%);
box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);
border-radius: 100px;
}
}
@media screen and (max-width:925px){
#NW {
overflow-y: scroll;
}
#NW::-webkit-scrollbar {
width: 10px;
}
#NW::-webkit-scrollbar-track {
background-color: #e4e4e4;
border-radius: 100px;
}
#NW::-webkit-scrollbar-thumb{
background-image: linear-gradient(180deg, RED 0%, YELLOW 99%);
box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);
border-radius: 100px;
}
}
/* CSS under er til handlekurv dropdown */ /* CSS under er til handlekurv dropdown */
#hkMain{ #hkMain{
position: fixed; position: fixed;
...@@ -624,146 +447,3 @@ footer { ...@@ -624,146 +447,3 @@ footer {
background-color: #b82a31; background-color: #b82a31;
margin-top: 15px; margin-top: 15px;
} }
\ No newline at end of file
/* CSS under er til handlekurv.html */
.checkout{
width : 90%;
position: relative;
left: 50%;
transform: translate(-50%,0);
margin-top: 20px;
padding: 30px;
border-radius: 7px;
box-shadow: 0px 5px 5px;
background-color: #FFE119;
}
#coTimeSelect,#coBestill, #coRabattInput, .coVareKnapp{
height: 30px;
border: solid 1px;
border-radius: 5px;
background-color: #b82a31;
}
#topBox{
min-height: 200px;
}
#bottomBox{
min-height: 220px;
}
#coVarer{
position: relative;
padding-top: 50px;
padding-bottom: 50px;
padding-left: 50px;
padding-right: 50px;
min-height: 100px;
width: 100%;
border: solid 1px;
border-radius: 5px;
background-color: #b82a31;
list-style-type: none;
font-size: 22px;
}
.coVareP{
padding-top: 5px;
padding-bottom: 5px;
}
.coVareVen{
display: inline-block;
width: 80%;
}
.coVareHoy{
display: inline-block;
text-align: right;
width: 19%;
}
.coVareKnapp{
width: 30px;
text-align: center;
display: inline-block;
background-color: #FFE119;
}
#coNedeLeft{
position: absolute;
display: inline-block;
width: calc(35% - 45px);
height: calc(100% - 60px);
}
#coNedeRight{
position: absolute;
left: calc(50% + 15px);
display: inline-block;
width: calc(50% - 45px);
height: calc(100% - 60px);
}
#coLevering{
position: absolute;
width: 100%;
height: 40%;
}
#coTime{
display: table-cell;
padding-left: 20px;
vertical-align: middle;
height: 50px;
}
#coTimeSelect{
position: absolute;
transform: translate(30%,-15%);
}
#coRabatt{
position: absolute;
top: 100%;
transform: translate(0,-100%);
width: 100%;
}
#coRabattInput{
width: 100%;
margin-top: 1%;
}
.coPayList{
list-style-type: none;
display: inline-block;
}
#leftList{
position: absolute;
}
#rightList{
position: absolute;
left: 100%;
transform: translate(-100%,0);
}
.leftListPoint,.rightListPoint{
padding: 10px;
}
.rightListPoint{
text-align: right;
}
#coBestill{
width: 100%;
position: absolute;
left: 100%;
top: 100%;
transform: translate(-100%,-100%);
}
\ No newline at end of file
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QuickFood</title> <title>QuickFood</title>
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/handlekurv.css">
<link rel="stylesheet" href="css/styleHandlekurv.css"> <link rel="stylesheet" href="css/styleHandlekurv.css">
<link rel="icon" type="image/png" href="img/QuickFood Favicon.png"> <link rel="icon" type="image/png" href="img/QuickFood Favicon.png">
......
img/burgergif.gif

593 KiB

img/drinksgif.gif

152 KiB

img/pizzagif.gif

1.01 MiB

...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QuickFood</title> <title>QuickFood</title>
<link rel="stylesheet" href="css/style.css" > <link rel="stylesheet" href="css/style.css" >
<link rel="stylesheet" href="css/meny.css">
<link rel="icon" type="image/png" href="img/QuickFood Favicon.png"> <link rel="icon" type="image/png" href="img/QuickFood Favicon.png">
</head> </head>
...@@ -53,14 +54,9 @@ ...@@ -53,14 +54,9 @@
<main> <main>
<div class="container"> <div class="container">
<section id="DagTil">
<header>
<h1>Dagens tilbud</h1>
</header>
<p>Pizzatilbud! <br> Stor pizza + 1.5l brus <br> kr 99,-</p>
</section>
<section id="Bmny"> <section id="Bmny">
<img src="img/burgergif.gif" type="gif" alt="burgervideo">
<header> <header>
<h1> Burgere</h1> <h1> Burgere</h1>
</header> </header>
...@@ -69,6 +65,7 @@ ...@@ -69,6 +65,7 @@
</section> </section>
<section id="Pmny"> <section id="Pmny">
<img src="img/pizzagif.gif" type="gif" alt="pizzavideo">
<header> <header>
<h1>Pizza</h1> <h1>Pizza</h1>
</header> </header>
...@@ -77,6 +74,7 @@ ...@@ -77,6 +74,7 @@
</section> </section>
<section id="Dmny"> <section id="Dmny">
<img src="img/drinksgif.gif" type="gif" alt="drinkvideo">
<header> <header>
<h1>Drikke</h1> <h1>Drikke</h1>
</header> </header>
......
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/om_oss.css">
<link rel="icon" type="image/png" href="img/QuickFood Favicon.png"> <link rel="icon" type="image/png" href="img/QuickFood Favicon.png">
<title>Om oss</title> <title>Om oss</title>
</head> </head>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment