Adding menu button + Cursus
This commit is contained in:
		| @ -34,9 +34,9 @@ | ||||
|                 <div class="fa-solid fa-bell"  style="margin-top: 7px; margin-bottom: 3px;"></div> | ||||
|             </a></li> | ||||
|         <li style="float: right;" title="Options"> | ||||
|             <a href="#Options"> | ||||
|           <div class="item"> | ||||
|                 <div  class="fa-solid fa-gear"  style="margin-top: 7px; margin-bottom: 3px;"></div> | ||||
|             </a></li> | ||||
|             </div></li> | ||||
|       </ul> | ||||
|     </div> | ||||
|  | ||||
| @ -112,7 +112,7 @@ | ||||
| 		transition-duration: .3s; | ||||
| 	} | ||||
|  | ||||
| 	li a{ | ||||
| 	.item,li a{ | ||||
| 		display: flex; | ||||
| 		padding: 8px 16px; | ||||
| 		color:rgb(255, 255, 255); | ||||
| @ -159,7 +159,8 @@ | ||||
| 	} | ||||
|  | ||||
|  | ||||
| 	ul.horizontal li a:hover:not(.active){ | ||||
| 	ul.horizontal .item:hover, li a:hover:not(.active){ | ||||
|  | ||||
| 		background-color: black; | ||||
| 		border-radius:6px; | ||||
| 		color:white; | ||||
|  | ||||
| @ -4,23 +4,29 @@ | ||||
|   const login= ref(true) | ||||
|   const page = ref(0) | ||||
|  | ||||
|   const emailIN=ref("") | ||||
|   const emailID=ref("") | ||||
|   const passwordIN=ref("") | ||||
|  | ||||
|   const surname=ref("") | ||||
|   const firstname=ref("") | ||||
|   const passwordOUT=ref("") | ||||
|   const emailOUT=ref("") | ||||
|   const address=ref("") | ||||
|   const country=ref("") | ||||
|  | ||||
|   const inputs = [emailIN,passwordIN] | ||||
|   const outputs= [surname,firstname,passwordOUT,emailOUT,address,country] | ||||
|   const cursus=ref("") | ||||
|   const inputs = [{_emailID:emailID},{_passwordIN:passwordIN}] | ||||
|   const outputs= [{_surname:surname},{_firstname:firstname},{_passwordOUT:passwordOUT},{_emailOUT:emailOUT},{_address:address},{_country:country},{_cursus:cursus}] | ||||
|   | ||||
| </script> | ||||
|  | ||||
|  | ||||
| <template> | ||||
|   <body> | ||||
|     <div class="Home"> | ||||
|     <a href="/"> | ||||
|        <img @click="draw" src="./assets/Clyde.png" style="width: 40px; height: auto; margin-top:4px"> | ||||
|     </a> | ||||
|     </div> | ||||
|     <div class="logBoxCenterer"> | ||||
|       <div class='loginBox'> | ||||
|        | ||||
| @ -29,7 +35,7 @@ | ||||
|             <h1 style="color:rgb(239,60,168); font-family: sans-serif;">{{i18n("login.guest.signin")}}</h1> | ||||
|               <div class="inputBox"> | ||||
|                 <p>ID / {{i18n("login.guest.email")}}</p>  | ||||
|                 <input type="text" v-model="emailIN"> | ||||
|                 <input type="text" v-model="emailID"> | ||||
|               </div> | ||||
|               <div class="inputBox"> | ||||
|                 <p>{{i18n("login.guest.password")}}</p> | ||||
| @ -62,6 +68,14 @@ | ||||
|                  <p>{{i18n("login.guest.password")}}</p> | ||||
|                  <input type="password" v-model="passwordOUT"> | ||||
|               </div> | ||||
|               <div class="inputBox"> | ||||
|                 <p>Cursus</p>  | ||||
|                   <select v-model="cursus"> | ||||
|                     <option value="Chemistry">Chemistry</option> | ||||
|                     <option value="Psycho">Psychology</option> | ||||
|                     <option value="IT">IT</option> | ||||
|                   </select> | ||||
|               </div> | ||||
|               <div class="switchpage"> | ||||
|                 <button @click="page++">{{i18n("login.guest.nextpage")}}</button> | ||||
|  | ||||
| @ -101,6 +115,20 @@ | ||||
| </template> | ||||
|  | ||||
| <style scoped> | ||||
| .Home{ | ||||
|  	display: flex; | ||||
| 	padding: 8px 16px; | ||||
| 	color:rgb(255, 255, 255); | ||||
| 	text-decoration: none; | ||||
| } | ||||
|  | ||||
| .Home:hover{ | ||||
|   width:40px; | ||||
|   background-color: black; | ||||
| 	border-radius:6px; | ||||
| 	color:white; | ||||
|   transform: translate(0px ,1px); | ||||
| } | ||||
|  | ||||
| .logBoxCenterer { | ||||
|   position: absolute; | ||||
| @ -134,7 +162,7 @@ | ||||
| } | ||||
|  | ||||
|  | ||||
| .inputBox input,button { | ||||
| .inputBox input,button,select { | ||||
|    | ||||
|   width:100%; | ||||
|   background:rgb(255, 0 255); | ||||
| @ -178,7 +206,7 @@ | ||||
|  | ||||
| } | ||||
|  | ||||
| button { | ||||
| button,select{ | ||||
|   margin-bottom:20px; | ||||
|   background-color: rgb(239,60,168); | ||||
|   cursor: pointer; | ||||
|  | ||||
		Reference in New Issue
	
	Block a user