Skip to content

Commit

Permalink
new commit
Browse files Browse the repository at this point in the history
  • Loading branch information
eylulozatman committed Nov 18, 2023
1 parent 5d96901 commit 3173d33
Show file tree
Hide file tree
Showing 3 changed files with 121 additions and 125 deletions.
Binary file added images/bgfoto.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

<div class="menuTab">
<ul class="menuTabList">
<li class="menutab-item" data-title="Home">Home</li>
Expand All @@ -16,8 +17,7 @@
<li class="menutab-item" data-title="Contact">Contact</li>
</ul>
</div>
<div class="container">
<img src="https://images2.alphacoders.com/115/1153166.jpg" alt="Background Image">
<div class="container">
<div class="contentBox">
<div class="formBox">
<div class="inputBox" id="namelbl">
Expand Down
242 changes: 119 additions & 123 deletions style.css
Original file line number Diff line number Diff line change
@@ -1,166 +1,162 @@

body {
height: 100%;
margin: 0;
padding: 0;
}
select{
margin-left: 2%;
width: max-content;
height: 6%;
font-size: large;
}
input{
margin-left: 2%;
}
span{
position: relative;
font-size: 130%;
font-weight: 200;
}

.menuTab
height: 100%;
margin: 0;
padding: 0;
overflow-x: hidden;
overflow-y: hidden;
}
select{
margin-left: 2%;
width: max-content;
height: 6%;
font-size: large;
}
input{
margin-left: 2%;
}
span{
position: relative;
font-size: 130%;
font-weight: 200;
}

.menuTab
{
position: fixed;
width: 100%;
height: 12vh;

width: 100%;
height: 12vh;

background-color: rgb(4, 1, 15);

background-color: rgb(4, 1, 15);

}
.menuTabList{

width: 100%;
height: 100%;
position: relative;
list-style: none;
display: flex;
text-align: left;
width: 100%;
height: 100%;
position: relative;
list-style: none;
display: flex;
text-align: left;
}

.menutab-item{
color: plum;
margin: 5vh;
font-size: 30px;
cursor: pointer;
}

.container {
display: flex;
justify-content: center;
justify-items: center;
align-items: center;
min-height: 88vh;
width: 100%;

}
.container img{
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
background-position: center ;
}

color: plum;
margin: 5vh;
font-size: 30px;
cursor: pointer;
}

.contentBox{
position: relative;
max-width: 65%;
width: 90%;
height: 60%;
min-height: 65vh;
background: transparent;
border: 0.1vw solid rgba(255,255,255,0.5);
border-radius: 30px;
backdrop-filter: blur(7px);
.container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
min-height: 100vh;
width: 100%;
background: url('images/bgfoto.jpg') center/cover fixed;
padding-top: 12vh;
}


.contentBox{
position: relative;
max-width: 65%;
width: 90%;
height: 60%;
min-height: 65vh;
background: transparent;
border: 0.1vw solid rgba(255,255,255,0.5);
border-radius: 30px;
backdrop-filter: blur(7px);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.formBox{

width: 100%;
height: 100%;

width: 100%;
height: 100%;

display: flex;
justify-content: center;
align-items: center;
flex-direction: column;

display: flex;
justify-content: center;
align-items: center;
flex-direction: column;

}

.inputBox{

overflow: hidden;
position: relative;
margin-left: 30%;
margin-top: 2.5%;
width: 100%;
color: plum;
overflow: hidden;
position: relative;
margin-left: 30%;
margin-top: 2.5%;
width: 100%;
color: plum;
}

#phoneCodesSelect{
width: 6%;
height: 23px;
width: 6%;
height: 23px;
}

#radioOpt{

display: flex;
display: flex;

}

#registerButton {
width: fit-content;
padding: 10px 10px;
background-color: plum;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
width: fit-content;
padding: 10px 10px;
background-color: plum;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
}

#registerButton:hover {
background-color: rgb(92, 42, 88);
background-color: rgb(92, 42, 88);
}



@media (max-width: 600px) {


.menuTab{
width: 100%;
margin: 0;

}
.menuTabList{
justify-content: center;
align-items: center;
width: 100%;
padding: 0;
margin: 0;
}
.menutab-item{
width: 80%;
margin: 0%;
padding: 0%;
font-size: 90%;
}
.formBox {
width: 80%;
margin: 0;
}
.inputBox {

margin-left: 0;
width: 100%;
}

.menuTab{
width: 100%;
margin: 0;

}


.menuTabList{
justify-content: center;
align-items: center;
width: 100%;
padding: 0;
margin: 0;
}
.menutab-item{
width: 80%;
margin: 0%;
padding: 0%;
font-size: 90%;
}
.formBox {
width: 80%;
margin: 0;
}
.inputBox {

margin-left: 0;
width: 100%;
}
}






0 comments on commit 3173d33

Please sign in to comment.