Fixes to login container linking

This commit is contained in:
Lucas Patenaude
2024-04-24 03:44:48 -06:00
parent 93de273a36
commit 9e7d4de169
11 changed files with 36 additions and 43 deletions

View File

@@ -0,0 +1,6 @@
#login-screen-container {
display: none;
}

View File

@@ -10,6 +10,7 @@
border: 1px solid gray;
}
.form-container {
width: 70%; /* Adjust width as needed */
margin: 0 auto; /* Center horizontally */

View File

@@ -0,0 +1,3 @@
#register-screen-container {
display: none;
}

View File

@@ -1,6 +0,0 @@
#login-container {
display: none;
}

View File

@@ -1,8 +1,4 @@
/* Add logo font face */
@font-face {
font-family: 'Scottsdale-Italic';
src: url('../../fonts/Scottsdale-Italic.ttf') format('truetype');
}
.sticky {
position: fixed;
@@ -55,14 +51,18 @@
}
}
#user {
#user-profile-button {
width: 25px;
cursor: pointer;
transition: width 0.3s ease; /* Adding transition for smooth effect */
}
#user:hover {
#user-profile-button:hover {
width: 30px;
}
/* Add logo font face */
@font-face {
font-family: 'Scottsdale-Italic';
src: url('../../fonts/Scottsdale-Italic.ttf') format('truetype');
}

View File

@@ -1,3 +0,0 @@
#register-container {
display: none;
}

View File

@@ -1,19 +1,18 @@
$(document).ready(function() {
// When #user is clicked
$('#user').click(function() {
$('#user-profile-button').click(function() {
$('#register-container').hide();
$('#register-screen-container').hide();
// Toggle the visibility of the login container
$('#login-container').toggle();
$('#login-page').toggle();
});
$('#register-page-login-button').click(function() {
event.preventDefault(); // Prevent the default action of following the link
$('#register-container').hide();
$('#login-container').toggle();
$('#register-screen-container').hide();
$('#login-screen-container').show();
});
});

View File

@@ -4,9 +4,9 @@ $(document).ready(function () {
$('#register-button').click(function (event) {
event.preventDefault(); // Prevent the default action of following the link
$('#login-container').hide();
$('#login-screen-container').hide();
// Show the register container
$('#register-container').show();
$('#register-screen-container').show();
});
});

View File

@@ -11,8 +11,8 @@
<!-- Navigation Bar Stylesheets -->
<link rel="stylesheet" type="text/css" href="/css/navigation-bar/navigation-bar.css">
<link rel="stylesheet" type="text/css" href="/css/navigation-bar/login.css">
<link rel="stylesheet" type="text/css" href="/css/navigation-bar/registration.css">
<link rel="stylesheet" type="text/css" href="/css/login-and-registration/login.css">
<link rel="stylesheet" type="text/css" href="/css/login-and-registration/registration.css">
<!-- Scoreboard Header Stylesheets -->
<link rel="stylesheet" type="text/css" href="/css/navigation-bar/scoreboard-header/scoreboard.css">

View File

@@ -1,5 +1,5 @@
<!-- Linking forms.css -->
<div class="login-page account-info-card" id="login-page">
<div class="account-portal-container" id="login-page">
<div class="form-container" id="login-form">
<a id="username">Username: {{user.username}}</a>

View File

@@ -14,15 +14,8 @@
<div class="collapse navbar-collapse" id="navbarToggler">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0" id="navbar-list">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="/league/2021" id="navbarDropdownPremierLeague" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Premier League
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownPremierLeague">
<!-- Dropdown menu items here -->
<a class="dropdown-item" href="/league/2021">Premier League</a>
<!-- Add more dropdown items if needed -->
</div>
<li class="nav-item">
<a class="nav-link" href="/league/2021">Premier League</a>
</li>
<li class="nav-item">
@@ -56,7 +49,7 @@
{{/each}}
</div>
<div id="user" class="user-icon">
<div id="user-profile-button" class="user-icon">
<img src="/img/navigation-bar/user.png" alt="Your Image" class="img-fluid">
</div>
@@ -64,15 +57,15 @@
</nav>
{{#if user.username}}
<div class="account-portal" id="login-container">
<div class="account-portal" id="login-screen-container">
{{> navigation-bar/account-screen}}
</div>
{{else}}
<div class="account-portal" id="login-container">
<div class="account-portal" id="login-account-container">
{{> navigation-bar/login}}
</div>
{{/if}}
<div class="account-portal" id="register-container">
<div class="account-portal" id="register-screen-container">
{{> navigation-bar/register}}
</div>