Added styling for league page information header

This commit is contained in:
Lucas Patenaude
2024-04-13 17:39:57 -06:00
parent 48acfe6c49
commit 6e24a0f4d8
2 changed files with 20 additions and 8 deletions

View File

@@ -6,9 +6,10 @@
#league-information-container {
height: 100px;
width: fit-content;
margin: 20px;
background: linear-gradient(to right, white, rgb(245, 245, 245), rgb(227, 227, 227)); /* Gradient from white to gray */
padding: 10px; /* Adjust padding as needed */
padding: 10px 20px; /* Adjust padding as needed */
transform: skewX(-20deg); /* Skew the banner to create a triangular side */
cursor: pointer; /* Change cursor to pointer on hover */
box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.4);
@@ -19,14 +20,25 @@
/* Add any other styling you need for the league information container */
}
#league-information-container::after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 8px; /* Width of the red strip */
background-color: red; /* Red color */
}
#league-logo {
margin: 0px 10px;
margin: 0px 30px;
transform: skewX(20deg); /* Skew the banner to create a triangular side */
height: 80%;
}
#league-title {
transform: skewX(20deg); /* Skew the banner to create a triangular side */
margin-right: 200px;
}
#league-stats-container {