Battlesnake/frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

assignment page scss upadated

Browse source
This commit is contained in:
Jae Young Ahn 2025-05-02 11:27:34 -07:00
parent 450d141ad9
commit 55a9e8170d
2 changed files with 25 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/pages/AssignmentPage.jsx
View file

@ -76,7 +76,7 @@ const AssignmentPage = () => {
return ( return (
<div className="assignment-page"> <div className="assignment-page">
<div className="assignment-header-box"> <div className="assignment-header-box">
<h2>📘 Assignments</h2> <h2>Assignments</h2>
<button onClick={() => { resetForm(); setShowModal(true); }}>➕ Add New</button> <button onClick={() => { resetForm(); setShowModal(true); }}>➕ Add New</button>
</div> </div>

31
src/scss/components/_assignment.scss
View file

@ -238,19 +238,22 @@
} }
.assignment-header-box { .assignment-header-box {
background: #0f0f1a; // dark navy background background: #0f0f1a;
border: 2px solid #00bfff; // deep sky blue border: 2px solid #00bfff;
border-radius: 12px; border-radius: 12px;
padding: 50px; padding: 50px;
text-align: center; text-align: center;
margin-bottom: 2rem; margin-bottom: 2rem;
box-shadow: 0 0 20px #00bfff; // box-shadow: 0 0 20px #00bfff;
box-shadow: rgb(211, 0, 197) 0px 0px 15px, rgb(255, 42, 109) 0px 0px 25px;
border: 1px solid rgb(211, 0, 197);
animation: pulseNeonBlue 2s infinite alternate; animation: pulseNeonBlue 2s infinite alternate;
h2 { h2 {
color: #00bfff; color: #00bfff;
margin-bottom: 1rem; margin-bottom: 1rem;
font-weight: bold; font-weight: bold;
// text-shadow: rgb(5, 217, 232) 0px 0px 5px;
} }
button { button {
@ -271,12 +274,26 @@
} }
} }
@keyframes pulseNeonBlue { // @keyframes pulseNeonBlue {
// from {
// box-shadow: 0 0 10px #00bfff, 0 0 20px #00bfff;
// }
// to {
// box-shadow: 0 0 25px #00bfff, 0 0 40px #00bfff;
// }
// }
@keyframes pulseNeonHybrid {
from { from {
box-shadow: 0 0 10px #00bfff, 0 0 20px #00bfff; box-shadow:
0 0 10px rgba(211, 0, 197, 0.7),
0 0 20px rgba(255, 42, 109, 0.7),
0 0 10px rgba(0, 191, 255, 0.7);
} }
to { to {
box-shadow: 0 0 25px #00bfff, 0 0 40px #00bfff; box-shadow:
0 0 25px rgba(211, 0, 197, 0.9),
0 0 40px rgba(255, 42, 109, 0.9),
0 0 30px rgba(0, 191, 255, 0.9);
} }
} }