lucaspatenaude/ScoreSpot
1
0
Fork 0
Code Projects 1 Releases 1 Wiki Activity

Changes to account pane to make club name and crest clickable to club's page

Browse Source
This commit is contained in:
Lucas Patenaude
2024-04-24 23:33:40 -06:00
parent 7ef769d8f4
commit 2a6fe0b126
3 changed files with 43 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
MilestoneSubmissions/placeholder.txt
View File

@@ -1,5 +0,0 @@
This file is here so the folder will upload to GitHub.
Git does not upload empty directories
Please delete when some other data has been added to this folder.

49
ProjectSourceCode/src/resources/css/login-and-registration/account.css
View File

@@ -8,6 +8,8 @@
padding: 10px;
}
#account-header-container {
display: flex;
@@ -36,8 +38,19 @@
border-radius: 8px;
padding: 10px 20px;
margin: 10px 0;
}
.account-favorite-teams-card:hover {
transform: scale(1.01); /* Scale the row by 1.1 on hover */
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
#account-favorite-teams-card-title {
text-decoration: underline;
}
#account-favorite-teams-card-logo {
transform: scale(1.02); /* Scale the row by 1.1 on hover */
}
}
#account-favorite-teams-card-logo {
@@ -47,35 +60,39 @@
#account-favorite-teams-card-title {
font-weight: 600;
text-decoration: none;
color: black;
}
/* Delete Button CSS */
/* Delete Button CSS --> Switches Between Icons */
/* Align the delete button container */
#account-delete-favorite-team-button-container {
margin-left: auto; /* Align the container all the way to the right */
display: inline-block;
position: relative;
}
#account-delete-favorite-team-button-hover {
display: none; /* Initially hide the hover image */
}
#account-delete-favorite-team-button-container:hover #account-delete-favorite-team-button {
display: none; /* Hide the default image when hovered over */
}
#account-delete-favorite-team-button-container:hover #account-delete-favorite-team-button-hover {
display: inline-block; /* Display the hover image when hovered over */
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
}
#account-delete-favorite-team-button,
#account-delete-favorite-team-button-hover {
.account-delete-favorite-team-button {
width: 15px;
cursor: pointer;
width: 18px;
height: auto;
}
/* Don't show hover icon on start */
#account-delete-favorite-team-button-hover {
display: none; /* Initially hide the hover image */
}
/* Hover Effects */
#account-delete-favorite-team-button-container:hover #account-delete-favorite-team-button {
display: none; /* Hide the default image when hovered over */
}
#account-delete-favorite-team-button-container:hover #account-delete-favorite-team-button-hover {
display: inline-block; /* Display the hover image when hovered over */
}

15
ProjectSourceCode/src/views/partials/navigation-bar/user-menu/account-screen.hbs
View File

@@ -1,33 +1,32 @@
<div class="account-portal-container" id="account-pane">
<div id="account-pane-content-container">
<div id="account-header-container">
<a id="username">Hello, {{user.username}}</a>
<div class="logout-container">
<a id="logout-button" class="account-portal-button" href="/logout">Logout</a>
</div>
</div>
<div id="account-favorite-teams-container">
<a id="account-favorite-teams-header">Favorite Teams:</a>
{{#each fav_teams}}
<div class="account-favorite-teams-card">
<div id="account-favorite-teams-card-logo-container">
<a href="/club/{{this.teamid}}">
<img id="account-favorite-teams-card-logo" src="{{this.teamlogo}}" alt="teamlogo">
</a>
</div>
<span id="account-favorite-teams-card-title">{{this.teamname}}</span>
<a id="account-favorite-teams-card-title" href="/club/{{this.teamid}}">
{{this.teamname}}
</a>
<div id="account-delete-favorite-team-button-container">
<!-- Add a different image for hover effect -->
<img id="account-delete-favorite-team-button" src="/img/navigation-bar/user-menu/account-pane/delete-club.png" alt="Delete Favorite Team">
<img id="account-delete-favorite-team-button-hover" src="/img/navigation-bar/user-menu/account-pane/delete-club-hover.png" userID={{this.userid}} teamID="{{this.teamid}}" alt="Delete Favorite Team Hover" >
<img id="account-delete-favorite-team-button" class="account-delete-favorite-team-button" src="/img/navigation-bar/user-menu/account-pane/delete-club.png" alt="Delete Favorite Team">
<img id="account-delete-favorite-team-button-hover" class="account-delete-favorite-team-button" src="/img/navigation-bar/user-menu/account-pane/delete-club-hover.png" userID="{{this.userid}}" teamID="{{this.teamid}}" alt="Delete Favorite Team Hover" >
</div>
</div>
{{/each}}
</div>
</div>
</div>