Version 0.1.1 - Ajout d'une page de login et de style
This commit is contained in:
		
							
								
								
									
										28
									
								
								views/login.ejs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										28
									
								
								views/login.ejs
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,28 @@
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html>
 | 
			
		||||
  <head>
 | 
			
		||||
    <title>Neutral</title>
 | 
			
		||||
    <link rel='stylesheet' href='/stylesheets/style.css' />
 | 
			
		||||
  </head>
 | 
			
		||||
  <body class="LOG_body">
 | 
			
		||||
    <div class=" form-box m-align t-center">
 | 
			
		||||
        
 | 
			
		||||
        <div class="logo"><img class="logo-img" src="/images/FormatLogo_WHITE.svg"><p>Neutral</p></div>
 | 
			
		||||
        <div>
 | 
			
		||||
          <p>Nom d'utilisateur</p>
 | 
			
		||||
          <input id="username" type="text" class="field  m-align">
 | 
			
		||||
        </div>
 | 
			
		||||
        <div>
 | 
			
		||||
          <p>Mot de passe</p>
 | 
			
		||||
          <input id="password" type="password" class="field  m-align">
 | 
			
		||||
        </div>
 | 
			
		||||
        <p id="login-info"></p>
 | 
			
		||||
        <button id="submit" class="btn green m-align LOG_btn"><span><i class="fa-solid fa-right-to-bracket"></i> Connexion</span></button>
 | 
			
		||||
    </div>
 | 
			
		||||
    
 | 
			
		||||
    <script defer="" src="https://use.fontawesome.com/releases/v6.4.2/js/all.js" crossorigin="anonymous"></script>
 | 
			
		||||
    <script src="/javascripts/basics.js"></script>
 | 
			
		||||
    <script src="/javascripts/loginscript.js"></script>
 | 
			
		||||
 
 | 
			
		||||
  </body>
 | 
			
		||||
</html>
 | 
			
		||||
@@ -1,70 +0,0 @@
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html>
 | 
			
		||||
  <head>
 | 
			
		||||
    <title>Neutral</title>
 | 
			
		||||
    <link rel='stylesheet' href='/stylesheets/style.css' />
 | 
			
		||||
  </head>
 | 
			
		||||
  <body>
 | 
			
		||||
    <h1>Neutral - Style Page</h1>
 | 
			
		||||
    <p>Welcome to Neutral</p>
 | 
			
		||||
 | 
			
		||||
    <p>Police : 'Roboto', sans-serif </p>
 | 
			
		||||
    <style>
 | 
			
		||||
      .box-color {
 | 
			
		||||
 | 
			
		||||
        width: 5vw;
 | 
			
		||||
        height: 5vw;
 | 
			
		||||
        transition: 0.2s;
 | 
			
		||||
        border: 1px solid;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .box-color:hover {
 | 
			
		||||
 | 
			
		||||
        transform: scale(1.1);
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .box-color:active {
 | 
			
		||||
 | 
			
		||||
        transform: scale(1);
 | 
			
		||||
        color: rgb(58, 255, 3);
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
      button {
 | 
			
		||||
        width: fit-content ;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .list-items {
 | 
			
		||||
 | 
			
		||||
        display: flex;
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
        gap: 2vw;
 | 
			
		||||
      }
 | 
			
		||||
    </style>
 | 
			
		||||
 | 
			
		||||
    <div class="list-items">
 | 
			
		||||
    <button class="btn red"><span>Error Button</span></button>
 | 
			
		||||
    <button class="btn blue "><span>Info Button</span></button>
 | 
			
		||||
    <button class="btn yellow"><span>Warning Button</span></button>
 | 
			
		||||
    <button class="btn green"><span>Confirm Button</span></button>
 | 
			
		||||
    <button class="btn"><span>Default Button</span></button>
 | 
			
		||||
    <button class="btn min red"><span><i class="fa fa-x"></i></span></button>
 | 
			
		||||
    <button class="btn min blue"><span><i class="fa fa-info"></i></span></button>
 | 
			
		||||
    <button class="btn min"><span><i class="fa fa-def"></i></span></button>
 | 
			
		||||
    <div onclick="copyToClipboard('#323031')" style='background-color: #323031;' class="box-color"><p style="text-align: center;">#323031</p></div>
 | 
			
		||||
    <div onclick="copyToClipboard('#3D3B3C')" style='background-color: #3D3B3C;' class="box-color"><p style="text-align: center;">#3D3B3C</p></div>
 | 
			
		||||
    <div onclick="copyToClipboard('#7F7979')" style='background-color: #7F7979;' class="box-color"><p style="text-align: center;">#7F7979</p></div>
 | 
			
		||||
    <div onclick="copyToClipboard('#C1BDB3')" style='background-color: #C1BDB3;' class="box-color"><p style="text-align: center;">#C1BDB3</p></div>
 | 
			
		||||
    <div onclick="copyToClipboard('#5f5b6b')" style='background-color: #5f5b6b;' class="box-color"><p style="text-align: center;">#5F5B6B</p></div>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <script>
 | 
			
		||||
      function copyToClipboard(text) {
 | 
			
		||||
 | 
			
		||||
        navigator.clipboard.writeText(text)
 | 
			
		||||
      }
 | 
			
		||||
      
 | 
			
		||||
    </script>
 | 
			
		||||
    <script defer="" src="https://use.fontawesome.com/releases/v6.4.2/js/all.js" crossorigin="anonymous"></script>
 | 
			
		||||
  </body>
 | 
			
		||||
</html>
 | 
			
		||||
@@ -16,34 +16,17 @@
 | 
			
		||||
            border-radius: 1vw;
 | 
			
		||||
            padding: 2%;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        button {
 | 
			
		||||
            color: red;
 | 
			
		||||
            background-color: transparent;
 | 
			
		||||
            border-radius: 1vw;
 | 
			
		||||
            border-color: red;
 | 
			
		||||
            border-style: solid;
 | 
			
		||||
            padding: 10px;
 | 
			
		||||
            transition: all 0.2s ease 0s;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        button:hover {
 | 
			
		||||
 | 
			
		||||
            color: white;
 | 
			
		||||
            background-color: red;
 | 
			
		||||
            cursor: pointer;
 | 
			
		||||
        }
 | 
			
		||||
    </style>
 | 
			
		||||
  </head>
 | 
			
		||||
  <body>
 | 
			
		||||
    <div>
 | 
			
		||||
        <h1>Erreur</h1>
 | 
			
		||||
        <h1>Erreur  <%= error.status %></h1>
 | 
			
		||||
        <h2><%= message %> - <%= error.status %></h1>
 | 
			
		||||
        <pre><%= error.stack %></pre>
 | 
			
		||||
 | 
			
		||||
    </div>
 | 
			
		||||
    <br>
 | 
			
		||||
   <a href="/"><button>Retourner sur le panel</button></a>
 | 
			
		||||
   <a href="/"><button class="btn red"><span>Retourner sur le panel</span></button></a>
 | 
			
		||||
  </body>
 | 
			
		||||
</html>
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										75
									
								
								views/utils/stylepage.ejs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										75
									
								
								views/utils/stylepage.ejs
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,75 @@
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html>
 | 
			
		||||
  <head>
 | 
			
		||||
    <title>Neutral</title>
 | 
			
		||||
    <link rel='stylesheet' href='/stylesheets/style.css' />
 | 
			
		||||
  </head>
 | 
			
		||||
  <body>
 | 
			
		||||
    <h1>Neutral - Page de style</h1>
 | 
			
		||||
    <p>Cette page est dédiée au développement et n'est pas en relation avec le Panel Neutral.</p>
 | 
			
		||||
    <a href="/"><button class="btn red"><span>Revenir sur le panel</span></button></a>
 | 
			
		||||
    <hr>
 | 
			
		||||
    <p>Police : <code>'Roboto', sans-serif</code></p>
 | 
			
		||||
    <p>Liens : <a href="/stylepage">https://neutral.raphix.fr/stylepage</a></p>
 | 
			
		||||
    <hr>
 | 
			
		||||
    <br>
 | 
			
		||||
    <style>
 | 
			
		||||
      .box-color {
 | 
			
		||||
 | 
			
		||||
        width: 100px;
 | 
			
		||||
        height: 100px;
 | 
			
		||||
        transition: 0.2s;
 | 
			
		||||
        border: 1px solid;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .box-color:hover {
 | 
			
		||||
 | 
			
		||||
        transform: scale(1.1);
 | 
			
		||||
      }
 | 
			
		||||
   
 | 
			
		||||
      .box-color:active {
 | 
			
		||||
 | 
			
		||||
        transform: scale(1);
 | 
			
		||||
        color: rgb(58, 255, 3);
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
      button {
 | 
			
		||||
        width: fit-content ;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      
 | 
			
		||||
    </style>
 | 
			
		||||
 | 
			
		||||
    <div class="col">
 | 
			
		||||
    <p>Classe : <code>btn</code></p>
 | 
			
		||||
    <div class="row">
 | 
			
		||||
      <button class="btn red"><span>Error Button</span></button>
 | 
			
		||||
      <button class="btn blue "><span>Info Button</span></button>
 | 
			
		||||
      <button class="btn yellow"><span>Warning Button</span></button>
 | 
			
		||||
      <button class="btn green"><span>Confirm Button</span></button>
 | 
			
		||||
      <button class="btn"><span>Default Button</span></button>
 | 
			
		||||
    </div>
 | 
			
		||||
    <p>Classe : <code>btn min</code></p>
 | 
			
		||||
    <div class="row">
 | 
			
		||||
      <button class="btn min red"><span><i class="fa fa-xmark"></i></span></button>
 | 
			
		||||
      <button class="btn min blue"><span><i class="fa fa-info"></i></span></button>
 | 
			
		||||
      <button class="btn min"><span><i class="fa fa-def"></i></span></button>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="row">
 | 
			
		||||
      <div onclick="copyToClipboard('#323031')" style='background-color: #323031;' class="box-color"><p style="text-align: center;">#323031</p></div>
 | 
			
		||||
      <div onclick="copyToClipboard('#f10000')" style='background-color: #f10000;' class="box-color"><p style="text-align: center;">#f10000</p></div>
 | 
			
		||||
      <div onclick="copyToClipboard('#605e5863')" style='background-color: #605e5863;' class="box-color"><p style="text-align: center;">#605e5863</p></div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <p>Classe : <code>field</code></p>
 | 
			
		||||
    <input type="text" class="field">
 | 
			
		||||
    
 | 
			
		||||
    <script>
 | 
			
		||||
      function copyToClipboard(text) {
 | 
			
		||||
        navigator.clipboard.writeText(text)
 | 
			
		||||
      }
 | 
			
		||||
      
 | 
			
		||||
    </script>
 | 
			
		||||
    <script defer="" src="https://use.fontawesome.com/releases/v6.4.2/js/all.js" crossorigin="anonymous"></script>
 | 
			
		||||
  </body>
 | 
			
		||||
</html>
 | 
			
		||||
		Reference in New Issue
	
	Block a user