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