Widget:520FamilyFeud: Difference between revisions

From Doc-Wiki
Jump to navigation Jump to search
← Older editNewer edit →
Docmoates (talk | contribs)
HerzingU-SpecialAccess, Bots, Bureaucrats, Dr. Michael Moates, Interface administrators, Users who may use two-factor authentication, Push subscription managers, Suppressors, Administrators, Upload Wizard campaign editors
2,408 edits
VisualWikitext
No edit summary
No edit summary
Line 3: Line 3:


== Usage ==
== Usage ==
<pre>{{#Widget:520FamilyFeud}}</pre>
<pre>{{#widget:FamilyFeudNursing}}</pre>
 
== Parameters ==
This widget does not accept any parameters.
 
== Description ==
An interactive Family Feud-style game for nursing students to study topics including:
* Cardiovascular Pharmacology
* Pain Management
* Geriatric Nursing
* Patient Teaching
* Heart Failure
* Medication Rights
* Asthma Medications
* Liver Failure
* Hearing Loss Care
* Infection Control
</noinclude><includeonly><html>
</noinclude><includeonly><html>
<div class="family-feud-nursing-game">
<div class="family-feud-nursing-game">
Line 27: Line 11:
     font-family: 'Oswald', sans-serif;
     font-family: 'Oswald', sans-serif;
     background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
     background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
     min-height: 100vh;
     min-height: 700px;
     color: white;
     color: white;
     padding: 20px;
     padding: 20px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
}
}
.family-feud-nursing-game .ff-container { max-width: 1200px; margin: 0 auto; }
.family-feud-nursing-game .ff-container { max-width: 1000px; margin: 0 auto; }


.family-feud-nursing-game .ff-title { text-align: center; margin-bottom: 20px; }
.family-feud-nursing-game .ff-title { text-align: center; margin-bottom: 15px; }
.family-feud-nursing-game .ff-title h1 {
.family-feud-nursing-game .ff-title h1 {
     font-family: 'Bebas Neue', sans-serif;
     font-family: 'Bebas Neue', sans-serif;
     font-size: 3.5rem;
     font-size: 2.8rem;
     background: linear-gradient(180deg, #ffd700, #ff8c00, #ff4500);
     background: linear-gradient(180deg, #ffd700, #ff8c00, #ff4500);
     -webkit-background-clip: text;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     background-clip: text;
     letter-spacing: 8px;
     letter-spacing: 6px;
}
}
.family-feud-nursing-game .ff-subtitle { font-size: 1.3rem; color: #00d4ff; letter-spacing: 6px; }
.family-feud-nursing-game .ff-subtitle { font-size: 1.1rem; color: #00d4ff; letter-spacing: 4px; }


.family-feud-nursing-game .ff-steve {
.family-feud-nursing-game .ff-steve {
     display: flex; align-items: center; gap: 20px;
     display: flex; align-items: center; gap: 15px;
     background: linear-gradient(145deg, #2d2d44, #1a1a2e);
     background: linear-gradient(145deg, #2d2d44, #1a1a2e);
     border-radius: 20px; padding: 20px; margin-bottom: 20px;
     border-radius: 15px; padding: 15px; margin-bottom: 15px;
     border: 3px solid #ffd700;
     border: 2px solid #ffd700;
}
}
.family-feud-nursing-game .ff-steve-avatar {
.family-feud-nursing-game .ff-steve-avatar {
     width: 80px; height: 80px;
     width: 60px; height: 60px;
     background: linear-gradient(135deg, #ffd700, #ff8c00);
     background: linear-gradient(135deg, #ffd700, #ff8c00);
     border-radius: 50%; display: flex; align-items: center;
     border-radius: 50%; display: flex; align-items: center;
     justify-content: center; font-size: 2.5rem; border: 4px solid #fff;
     justify-content: center; font-size: 2rem; border: 3px solid #fff;
    flex-shrink: 0;
}
}
.family-feud-nursing-game .ff-steve-avatar.ff-happy { animation: ffHappy 0.5s ease-out; }
.family-feud-nursing-game .ff-steve-avatar.ff-happy { animation: ffHappy 0.5s ease-out; }
Line 61: Line 49:
@keyframes ffHappy { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.2) rotate(10deg); } }
@keyframes ffHappy { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.2) rotate(10deg); } }
@keyframes ffShock { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.3) rotate(-10deg); } }
@keyframes ffShock { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.3) rotate(-10deg); } }
.family-feud-nursing-game .ff-steve-name { font-family: 'Bebas Neue', sans-serif; color: #ffd700; letter-spacing: 2px; }
.family-feud-nursing-game .ff-steve-name { font-family: 'Bebas Neue', sans-serif; color: #ffd700; letter-spacing: 2px; font-size: 0.9rem; }
.family-feud-nursing-game .ff-steve-dialogue { font-size: 1.3rem; line-height: 1.4; margin-top: 5px; }
.family-feud-nursing-game .ff-steve-dialogue { font-size: 1.1rem; line-height: 1.3; margin-top: 3px; }


.family-feud-nursing-game .ff-scores { display: flex; justify-content: center; gap: 30px; margin-bottom: 20px; }
.family-feud-nursing-game .ff-scores { display: flex; justify-content: center; gap: 20px; margin-bottom: 15px; }
.family-feud-nursing-game .ff-score-box {
.family-feud-nursing-game .ff-score-box {
     background: linear-gradient(145deg, #0f3460, #16213e);
     background: linear-gradient(145deg, #0f3460, #16213e);
     padding: 12px 35px; border-radius: 15px; border: 3px solid #00d4ff; text-align: center;
     padding: 10px 30px; border-radius: 12px; border: 2px solid #00d4ff; text-align: center;
}
}
.family-feud-nursing-game .ff-score-label { font-size: 0.85rem; color: #00d4ff; text-transform: uppercase; letter-spacing: 2px; }
.family-feud-nursing-game .ff-score-label { font-size: 0.75rem; color: #00d4ff; text-transform: uppercase; letter-spacing: 2px; }
.family-feud-nursing-game .ff-score-value { font-family: 'Bebas Neue', sans-serif; font-size: 2.5rem; color: #ffd700; }
.family-feud-nursing-game .ff-score-value { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: #ffd700; }


.family-feud-nursing-game .ff-strikes { display: flex; justify-content: center; gap: 15px; margin-bottom: 20px; }
.family-feud-nursing-game .ff-strikes { display: flex; justify-content: center; gap: 12px; margin-bottom: 15px; }
.family-feud-nursing-game .ff-strike {
.family-feud-nursing-game .ff-strike {
     width: 80px; height: 80px; background: #1a1a2e; border: 4px solid #333;
     width: 60px; height: 60px; background: #1a1a2e; border: 3px solid #333;
     border-radius: 12px; display: flex; align-items: center; justify-content: center;
     border-radius: 10px; display: flex; align-items: center; justify-content: center;
     font-size: 3rem; color: transparent;
     font-size: 2.2rem; color: transparent;
}
}
.family-feud-nursing-game .ff-strike.ff-active {
.family-feud-nursing-game .ff-strike.ff-active {
Line 83: Line 71:
     animation: ffStrikeFlash 0.3s ease-out;
     animation: ffStrikeFlash 0.3s ease-out;
}
}
@keyframes ffStrikeFlash { 0% { transform: scale(1.5); } 100% { transform: scale(1); } }
@keyframes ffStrikeFlash { 0% { transform: scale(1.4); } 100% { transform: scale(1); } }


/* Overlays - RELATIVE to game container, not fixed */
.family-feud-nursing-game .ff-x-overlay, .family-feud-nursing-game .ff-ding-overlay {
.family-feud-nursing-game .ff-x-overlay, .family-feud-nursing-game .ff-ding-overlay {
     position: fixed; top: 0; left: 0; width: 100%; height: 100%;
     position: absolute; top: 0; left: 0; width: 100%; height: 100%;
     display: none; align-items: center; justify-content: center; z-index: 9999;
     display: none; align-items: center; justify-content: center; z-index: 50;
    pointer-events: none;
}
}
.family-feud-nursing-game .ff-x-overlay { background: rgba(139, 0, 0, 0.9); }
.family-feud-nursing-game .ff-x-overlay { background: rgba(139, 0, 0, 0.9); }
Line 94: Line 84:
.family-feud-nursing-game .ff-ding-overlay.ff-show { animation: ffOverlayFade 0.7s forwards; }
.family-feud-nursing-game .ff-ding-overlay.ff-show { animation: ffOverlayFade 0.7s forwards; }
@keyframes ffOverlayFade { 0%, 60% { opacity: 1; } 100% { opacity: 0; } }
@keyframes ffOverlayFade { 0%, 60% { opacity: 1; } 100% { opacity: 0; } }
.family-feud-nursing-game .ff-big-x { font-size: 50vw; color: #fff; font-family: 'Bebas Neue', sans-serif; animation: ffPopIn 0.2s ease-out; }
.family-feud-nursing-game .ff-big-x { font-size: 15rem; color: #fff; font-family: 'Bebas Neue', sans-serif; animation: ffPopIn 0.2s ease-out; }
.family-feud-nursing-game .ff-ding-text { font-size: 30vw; color: #90EE90; font-family: 'Bebas Neue', sans-serif; animation: ffPopIn 0.2s ease-out; }
.family-feud-nursing-game .ff-ding-text { font-size: 12rem; color: #90EE90; font-family: 'Bebas Neue', sans-serif; animation: ffPopIn 0.2s ease-out; }
@keyframes ffPopIn { 0% { transform: scale(0); } 100% { transform: scale(1); } }
@keyframes ffPopIn { 0% { transform: scale(0); } 100% { transform: scale(1); } }


.family-feud-nursing-game .ff-board {
.family-feud-nursing-game .ff-board {
     background: linear-gradient(180deg, #1a237e, #0d47a1);
     background: linear-gradient(180deg, #1a237e, #0d47a1);
     border-radius: 20px; padding: 25px; margin-bottom: 20px;
     border-radius: 15px; padding: 20px; margin-bottom: 15px;
     border: 5px solid #ffd700;
     border: 4px solid #ffd700;
}
}
.family-feud-nursing-game .ff-question {
.family-feud-nursing-game .ff-question {
     text-align: center; margin-bottom: 20px; padding: 15px;
     text-align: center; margin-bottom: 15px; padding: 12px;
     background: rgba(0,0,0,0.4); border-radius: 12px; border: 2px solid #ffd700;
     background: rgba(0,0,0,0.4); border-radius: 10px; border: 2px solid #ffd700;
}
}
.family-feud-nursing-game .ff-category { font-size: 0.9rem; color: #00d4ff; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 8px; }
.family-feud-nursing-game .ff-category { font-size: 0.8rem; color: #00d4ff; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 6px; }
.family-feud-nursing-game .ff-question-text { font-size: 1.4rem; line-height: 1.4; }
.family-feud-nursing-game .ff-question-text { font-size: 1.2rem; line-height: 1.3; }


.family-feud-nursing-game .ff-answers { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.family-feud-nursing-game .ff-answers { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.family-feud-nursing-game .ff-answer {
.family-feud-nursing-game .ff-answer {
     background: linear-gradient(145deg, #0d47a1, #1565c0);
     background: linear-gradient(145deg, #0d47a1, #1565c0);
     border: 3px solid #2196f3; border-radius: 10px; padding: 12px 15px;
     border: 2px solid #2196f3; border-radius: 8px; padding: 10px 12px;
     display: flex; justify-content: space-between; align-items: center; min-height: 55px;
     display: flex; justify-content: space-between; align-items: center; min-height: 48px;
}
}
.family-feud-nursing-game .ff-answer.ff-revealed {
.family-feud-nursing-game .ff-answer.ff-revealed {
Line 121: Line 111:
}
}
@keyframes ffReveal { 0% { transform: rotateX(90deg); } 100% { transform: rotateX(0); } }
@keyframes ffReveal { 0% { transform: rotateX(90deg); } 100% { transform: rotateX(0); } }
.family-feud-nursing-game .ff-answer-num { font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; color: #ffd700; width: 35px; text-align: center; }
.family-feud-nursing-game .ff-answer-num { font-family: 'Bebas Neue', sans-serif; font-size: 1.5rem; color: #ffd700; width: 30px; text-align: center; }
.family-feud-nursing-game .ff-answer.ff-revealed .ff-answer-num { color: #1a1a2e; }
.family-feud-nursing-game .ff-answer.ff-revealed .ff-answer-num { color: #1a1a2e; }
.family-feud-nursing-game .ff-answer-text { flex: 1; font-size: 1rem; text-align: center; text-transform: uppercase; letter-spacing: 1px; }
.family-feud-nursing-game .ff-answer-text { flex: 1; font-size: 0.9rem; text-align: center; text-transform: uppercase; letter-spacing: 1px; }
.family-feud-nursing-game .ff-answer.ff-revealed .ff-answer-text { color: #1a1a2e; font-weight: 700; }
.family-feud-nursing-game .ff-answer.ff-revealed .ff-answer-text { color: #1a1a2e; font-weight: 700; }
.family-feud-nursing-game .ff-answer-pts { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; color: #00d4ff; width: 45px; text-align: center; }
.family-feud-nursing-game .ff-answer-pts { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; color: #00d4ff; width: 40px; text-align: center; }
.family-feud-nursing-game .ff-answer.ff-revealed .ff-answer-pts { color: #1a1a2e; }
.family-feud-nursing-game .ff-answer.ff-revealed .ff-answer-pts { color: #1a1a2e; }


.family-feud-nursing-game .ff-input-area { display: flex; gap: 12px; justify-content: center; margin-bottom: 20px; }
.family-feud-nursing-game .ff-input-area { display: flex; gap: 10px; justify-content: center; margin-bottom: 15px; }
.family-feud-nursing-game .ff-input {
.family-feud-nursing-game .ff-input {
     flex: 1; max-width: 450px; padding: 12px 20px; font-size: 1.2rem;
     flex: 1; max-width: 400px; padding: 10px 18px; font-size: 1.1rem;
     font-family: 'Oswald', sans-serif; border: 3px solid #00d4ff; border-radius: 50px;
     font-family: 'Oswald', sans-serif; border: 2px solid #00d4ff; border-radius: 50px;
     background: rgba(255,255,255,0.1); color: #fff; text-align: center;
     background: rgba(255,255,255,0.1); color: #fff; text-align: center;
     text-transform: uppercase; letter-spacing: 2px; outline: none;
     text-transform: uppercase; letter-spacing: 2px; outline: none;
}
}
.family-feud-nursing-game .ff-input:focus { border-color: #ffd700; box-shadow: 0 0 20px rgba(255,215,0,0.4); }
.family-feud-nursing-game .ff-input:focus { border-color: #ffd700; box-shadow: 0 0 15px rgba(255,215,0,0.4); }
.family-feud-nursing-game .ff-input::placeholder { color: rgba(255,255,255,0.5); }
.family-feud-nursing-game .ff-input::placeholder { color: rgba(255,255,255,0.5); }
.family-feud-nursing-game .ff-submit {
.family-feud-nursing-game .ff-submit {
     padding: 12px 35px; font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem;
     padding: 10px 30px; font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem;
     background: linear-gradient(145deg, #ffd700, #ff8c00); border: none;
     background: linear-gradient(145deg, #ffd700, #ff8c00); border: none;
     border-radius: 50px; color: #1a1a2e; cursor: pointer; letter-spacing: 2px;
     border-radius: 50px; color: #1a1a2e; cursor: pointer; letter-spacing: 2px;
Line 144: Line 134:
.family-feud-nursing-game .ff-submit:hover { transform: scale(1.05); }
.family-feud-nursing-game .ff-submit:hover { transform: scale(1.05); }


.family-feud-nursing-game .ff-buttons { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.family-feud-nursing-game .ff-buttons { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.family-feud-nursing-game .ff-btn {
.family-feud-nursing-game .ff-btn {
     padding: 10px 22px; font-family: 'Oswald', sans-serif; font-size: 0.95rem;
     padding: 8px 18px; font-family: 'Oswald', sans-serif; font-size: 0.85rem;
     border: 2px solid; border-radius: 10px; cursor: pointer; text-transform: uppercase;
     border: 2px solid; border-radius: 8px; cursor: pointer; text-transform: uppercase;
}
}
.family-feud-nursing-game .ff-btn-next { background: linear-gradient(145deg, #00d4ff, #0099cc); border-color: #00d4ff; color: #1a1a2e; }
.family-feud-nursing-game .ff-btn-next { background: linear-gradient(145deg, #00d4ff, #0099cc); border-color: #00d4ff; color: #1a1a2e; }
Line 155: Line 145:
.family-feud-nursing-game .ff-btn:hover { transform: translateY(-2px); }
.family-feud-nursing-game .ff-btn:hover { transform: translateY(-2px); }


/* Start and Game Over - RELATIVE positioning, not fixed */
.family-feud-nursing-game .ff-start, .family-feud-nursing-game .ff-gameover {
.family-feud-nursing-game .ff-start, .family-feud-nursing-game .ff-gameover {
     position: fixed; top: 0; left: 0; width: 100%; height: 100%;
     position: absolute; top: 0; left: 0; width: 100%; height: 100%;
     background: linear-gradient(135deg, #1a1a2e, #0f3460);
     background: linear-gradient(135deg, #1a1a2e, #0f3460);
     display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 9998;
     display: flex; flex-direction: column; align-items: center; justify-content: center;  
    z-index: 100;
    border-radius: 12px;
}
}
.family-feud-nursing-game .ff-start.ff-hidden, .family-feud-nursing-game .ff-gameover:not(.ff-show) { display: none; }
.family-feud-nursing-game .ff-start.ff-hidden, .family-feud-nursing-game .ff-gameover:not(.ff-show) { display: none; }
.family-feud-nursing-game .ff-start-title {
.family-feud-nursing-game .ff-start-title {
     font-family: 'Bebas Neue', sans-serif; font-size: 4.5rem;
     font-family: 'Bebas Neue', sans-serif; font-size: 3.5rem;
     background: linear-gradient(180deg, #ffd700, #ff8c00, #ff4500);
     background: linear-gradient(180deg, #ffd700, #ff8c00, #ff4500);
     -webkit-background-clip: text; -webkit-text-fill-color: transparent;
     -webkit-background-clip: text; -webkit-text-fill-color: transparent;
     letter-spacing: 10px; animation: ffPulse 2s infinite;
     letter-spacing: 8px; animation: ffPulse 2s infinite;
}
}
@keyframes ffPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.02); } }
@keyframes ffPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.02); } }
.family-feud-nursing-game .ff-start-sub { font-size: 1.8rem; color: #00d4ff; margin-bottom: 25px; letter-spacing: 5px; }
.family-feud-nursing-game .ff-start-sub { font-size: 1.4rem; color: #00d4ff; margin-bottom: 20px; letter-spacing: 4px; }
.family-feud-nursing-game .ff-start-emoji { font-size: 7rem; margin-bottom: 25px; animation: ffWave 1s infinite; }
.family-feud-nursing-game .ff-start-emoji { font-size: 5rem; margin-bottom: 20px; animation: ffWave 1s infinite; }
@keyframes ffWave { 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
@keyframes ffWave { 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
.family-feud-nursing-game .ff-play-btn {
.family-feud-nursing-game .ff-play-btn {
     padding: 18px 70px; font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem;
     padding: 15px 60px; font-family: 'Bebas Neue', sans-serif; font-size: 2rem;
     background: linear-gradient(145deg, #ffd700, #ff8c00); border: none;
     background: linear-gradient(145deg, #ffd700, #ff8c00); border: none;
     border-radius: 60px; color: #1a1a2e; cursor: pointer; letter-spacing: 5px;
     border-radius: 50px; color: #1a1a2e; cursor: pointer; letter-spacing: 4px;
}
}
.family-feud-nursing-game .ff-play-btn:hover { transform: scale(1.1); }
.family-feud-nursing-game .ff-play-btn:hover { transform: scale(1.1); }
.family-feud-nursing-game .ff-start-info { margin-top: 25px; text-align: center; color: rgba(255,255,255,0.7); max-width: 480px; line-height: 1.7; }
.family-feud-nursing-game .ff-start-info { margin-top: 20px; text-align: center; color: rgba(255,255,255,0.7); max-width: 400px; line-height: 1.6; font-size: 0.95rem; }


.family-feud-nursing-game .ff-final-score { font-family: 'Bebas Neue', sans-serif; font-size: 7rem; color: #ffd700; }
.family-feud-nursing-game .ff-final-score { font-family: 'Bebas Neue', sans-serif; font-size: 5rem; color: #ffd700; }
.family-feud-nursing-game .ff-final-msg { font-size: 1.6rem; color: #00d4ff; margin-bottom: 25px; text-align: center; }
.family-feud-nursing-game .ff-final-msg { font-size: 1.4rem; color: #00d4ff; margin-bottom: 20px; text-align: center; }


.family-feud-nursing-game .ff-confetti {
.family-feud-nursing-game .ff-confetti {
     position: fixed; width: 10px; height: 10px; z-index: 9997;
     position: absolute; width: 10px; height: 10px; z-index: 90;
     animation: ffFall 3s linear forwards;
     animation: ffFall 3s linear forwards;
}
}
@keyframes ffFall {
@keyframes ffFall {
     0% { transform: translateY(-100vh) rotate(0); opacity: 1; }
     0% { transform: translateY(-50px) rotate(0); opacity: 1; }
     100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
     100% { transform: translateY(700px) rotate(720deg); opacity: 0; }
}
}


.family-feud-nursing-game .ff-progress { width: 100%; height: 8px; background: rgba(255,255,255,0.1); border-radius: 4px; margin-bottom: 15px; }
.family-feud-nursing-game .ff-progress { width: 100%; height: 6px; background: rgba(255,255,255,0.1); border-radius: 3px; margin-bottom: 12px; }
.family-feud-nursing-game .ff-progress-fill { height: 100%; background: linear-gradient(90deg, #00d4ff, #ffd700); border-radius: 4px; transition: width 0.5s; }
.family-feud-nursing-game .ff-progress-fill { height: 100%; background: linear-gradient(90deg, #00d4ff, #ffd700); border-radius: 3px; transition: width 0.5s; }


@media (max-width: 768px) {
@media (max-width: 768px) {
     .family-feud-nursing-game .ff-title h1 { font-size: 2.2rem; }
     .family-feud-nursing-game .ff-title h1 { font-size: 2rem; }
     .family-feud-nursing-game .ff-answers { grid-template-columns: 1fr; }
     .family-feud-nursing-game .ff-answers { grid-template-columns: 1fr; }
     .family-feud-nursing-game .ff-steve { flex-direction: column; text-align: center; }
     .family-feud-nursing-game .ff-steve { flex-direction: column; text-align: center; }
     .family-feud-nursing-game .ff-input-area { flex-direction: column; align-items: center; }
     .family-feud-nursing-game .ff-input-area { flex-direction: column; align-items: center; }
     .family-feud-nursing-game .ff-input { width: 100%; }
     .family-feud-nursing-game .ff-input { width: 100%; }
     .family-feud-nursing-game .ff-start-title { font-size: 2.8rem; }
     .family-feud-nursing-game .ff-start-title { font-size: 2.5rem; }
}
}
</style>
</style>
Line 531: Line 524:
     function createConfetti() {
     function createConfetti() {
         var colors = ['#ffd700', '#ff8c00', '#00d4ff', '#ff4500', '#9c27b0', '#4caf50'];
         var colors = ['#ffd700', '#ff8c00', '#00d4ff', '#ff4500', '#9c27b0', '#4caf50'];
         for (var i = 0; i < 80; i++) {
        var container = document.querySelector('.family-feud-nursing-game');
         for (var i = 0; i < 60; i++) {
             var c = document.createElement('div');
             var c = document.createElement('div');
             c.className = 'ff-confetti';
             c.className = 'ff-confetti';
             c.style.left = Math.random() * 100 + 'vw';
             c.style.left = Math.random() * 100 + '%';
             c.style.background = colors[Math.floor(Math.random() * colors.length)];
             c.style.background = colors[Math.floor(Math.random() * colors.length)];
             c.style.animationDelay = Math.random() * 2 + 's';
             c.style.animationDelay = Math.random() * 2 + 's';
             document.querySelector('.family-feud-nursing-game').appendChild(c);
             container.appendChild(c);
             setTimeout(function(el) { el.remove(); }, 4000, c);
             setTimeout(function(el) { el.remove(); }, 4000, c);
         }
         }

Revision as of 01:15, 11 January 2026

This widget displays the Family Feud Nursing Edition study game.

Usage

{{#widget:FamilyFeudNursing}}
Retrieved from "https://wiki.docmoates.com/index.php?title=Widget:520FamilyFeud&oldid=6658"