Skip to content

Commit fc69506

Browse files
Deadpool2000Deadpool2000
committed
fix FAQS
1 parent 1448d3a commit fc69506

2 files changed

Lines changed: 165 additions & 101 deletions

File tree

‎wasp/assets/css/style.css‎

Lines changed: 79 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -400,33 +400,97 @@ footer {
400400
color: #666;
401401
}
402402

403-
/* FAQ Accordion */
403+
/* FAQ Accordion - Premium Terminal Design */
404+
.accordion-item {
405+
background: transparent !important;
406+
border: 1px solid rgba(0, 255, 65, 0.1) !important;
407+
border-left: 4px solid rgba(0, 255, 65, 0.2) !important;
408+
margin-bottom: 20px !important;
409+
border-radius: 8px !important;
410+
overflow: hidden;
411+
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
412+
}
413+
414+
.accordion-item:hover {
415+
border-color: rgba(0, 255, 65, 0.4) !important;
416+
border-left-color: var(--terminal-green) !important;
417+
box-shadow: 0 0 20px rgba(0, 255, 65, 0.05);
418+
}
419+
420+
.accordion-item:has(.accordion-button:not(.collapsed)) {
421+
border-color: rgba(0, 255, 65, 0.5) !important;
422+
border-left-color: var(--terminal-green) !important;
423+
box-shadow: 0 0 30px rgba(0, 255, 65, 0.1);
424+
}
425+
426+
404427
.accordion-button {
405428
background-color: var(--card-bg) !important;
406429
color: var(--terminal-green) !important;
407-
border: 1px solid rgba(0, 255, 65, 0.1) !important;
430+
padding: 1.5rem !important;
431+
font-size: 1.1rem !important;
432+
font-weight: 700 !important;
433+
border: none !important;
408434
box-shadow: none !important;
409-
font-weight: 700;
435+
display: flex;
436+
align-items: center;
437+
transition: all 0.3s ease;
410438
}
411439

412440
.accordion-button::after {
413-
filter: invert(1) hue-rotate(90deg);
441+
background-image: none !important;
442+
content: '[+]';
443+
font-family: 'JetBrains Mono', monospace;
444+
width: auto;
445+
height: auto;
446+
color: var(--terminal-green);
447+
font-size: 1rem;
448+
transition: all 0.3s ease;
449+
margin-left: auto;
414450
}
415451

416452
.accordion-button:not(.collapsed) {
417-
border-bottom: 2px solid var(--terminal-green) !important;
418-
background-color: #000 !important;
453+
background-color: rgba(0, 255, 65, 0.05) !important;
454+
border-bottom: 1px solid rgba(0, 255, 65, 0.1) !important;
419455
}
420456

421-
.accordion-body {
422-
background-color: #000;
423-
color: var(--text-muted);
424-
border: 1px solid rgba(0, 255, 65, 0.1);
425-
border-top: none;
457+
.accordion-button:not(.collapsed)::after {
458+
content: '[-]';
459+
transform: none !important;
460+
color: var(--terminal-green);
426461
}
427462

428-
.accordion-item {
429-
border: none !important;
430-
margin-bottom: 1rem;
431-
background: transparent !important;
463+
.accordion-button:focus {
464+
box-shadow: none !important;
465+
border-color: rgba(0, 255, 65, 0.3) !important;
432466
}
467+
468+
.accordion-body {
469+
background-color: #000 !important;
470+
color: var(--text-muted) !important;
471+
padding: 1.5rem 2rem !important;
472+
line-height: 1.8;
473+
font-size: 0.95rem;
474+
border-top: 1px solid rgba(0, 255, 65, 0.05);
475+
}
476+
477+
/* Mobile Friendly Adjustments */
478+
@media (max-width: 768px) {
479+
.accordion-button {
480+
padding: 1.25rem 1rem !important;
481+
font-size: 0.95rem !important;
482+
}
483+
484+
.accordion-body {
485+
padding: 1.25rem 1rem !important;
486+
font-size: 0.9rem;
487+
}
488+
489+
.accordion-item {
490+
margin-bottom: 12px !important;
491+
}
492+
493+
.accordion-button::after {
494+
font-size: 0.8rem;
495+
}
496+
}

‎wasp/index.html‎

Lines changed: 86 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -355,100 +355,100 @@ <h2 class="section-title">The "Unshakeable" Work Ethic</h2>
355355
</div>
356356
</div>
357357
</section>
358-
+
359-
+ <!-- FAQ Section -->
360-
+ <section id="faq" class="py-5">
361-
+ <div class="container py-5">
362-
+ <div class="text-center mb-5">
363-
+ <h2 class="section-title">The HR Interrogation Guide (FAQ)</h2>
364-
+ <p class="text-secondary lead">Classified inquiries for the modern workplace rebel.</p>
365-
+ </div>
366-
+ <div class="row justify-content-center">
367-
+ <div class="col-lg-8">
368-
+ <div class="accordion" id="faqAccordion">
369-
+ <!-- Q1 -->
370-
+ <div class="accordion-item">
371-
+ <h2 class="accordion-header">
372-
+ <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
358+
359+
<!-- FAQ Section -->
360+
<section id="faq" class="py-5">
361+
<div class="container py-5">
362+
<div class="text-center mb-5">
363+
<h2 class="section-title">The HR Interrogation Guide (FAQ)</h2>
364+
<p class="text-secondary lead">Classified inquiries for the modern workplace rebel.</p>
365+
</div>
366+
<div class="row justify-content-center">
367+
<div class="col-lg-8">
368+
<div class="accordion" id="faqAccordion">
369+
<!-- Q1 -->
370+
<div class="accordion-item">
371+
<h2 class="accordion-header">
372+
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
373373
data-bs-target="#faq1">
374-
+ > Is this legal?
375-
+ </button>
376-
+ </h2>
377-
+ <div id="faq1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
378-
+ <div class="accordion-body">
379-
+ Using software to move your mouse? Yes. Check your employment contract for
374+
> Is this legal?
375+
</button>
376+
</h2>
377+
<div id="faq1" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
378+
<div class="accordion-body">
379+
Using software to move your mouse? Yes. Check your employment contract for
380380
specifics.
381-
+ </div>
382-
+ </div>
383-
+ </div>
384-
+
385-
+ <!-- Q2 -->
386-
+ <div class="accordion-item">
387-
+ <h2 class="accordion-header">
388-
+ <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
381+
</div>
382+
</div>
383+
</div>
384+
385+
<!-- Q2 -->
386+
<div class="accordion-item">
387+
<h2 class="accordion-header">
388+
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
389389
data-bs-target="#faq2">
390-
+ > Will I get fired?
391-
+ </button>
392-
+ </h2>
393-
+ <div id="faq2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
394-
+ <div class="accordion-body">
395-
+ Not if you're smart about it. Still deliver your work, just take reasonable
390+
> Will I get fired?
391+
</button>
392+
</h2>
393+
<div id="faq2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
394+
<div class="accordion-body">
395+
Not if you're smart about it. Still deliver your work, just take reasonable
396396
breaks.
397-
+ </div>
398-
+ </div>
399-
+ </div>
400-
+
401-
+ <!-- Q3 -->
402-
+ <div class="accordion-item">
403-
+ <h2 class="accordion-header">
404-
+ <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
397+
</div>
398+
</div>
399+
</div>
400+
401+
<!-- Q3 -->
402+
<div class="accordion-item">
403+
<h2 class="accordion-header">
404+
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
405405
data-bs-target="#faq3">
406-
+ > Can tracking software detect this?
407-
+ </button>
408-
+ </h2>
409-
+ <div id="faq3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
410-
+ <div class="accordion-body">
411-
+ WASP simulates natural movement. But don't push your luck with 24/7 usage.
412-
+ </div>
413-
+ </div>
414-
+ </div>
415-
+
416-
+ <!-- Q4 -->
417-
+ <div class="accordion-item">
418-
+ <h2 class="accordion-header">
419-
+ <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
406+
> Can tracking software detect this?
407+
</button>
408+
</h2>
409+
<div id="faq3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
410+
<div class="accordion-body">
411+
WASP simulates natural movement. But don't push your luck with 24/7 usage.
412+
</div>
413+
</div>
414+
</div>
415+
416+
<!-- Q4 -->
417+
<div class="accordion-item">
418+
<h2 class="accordion-header">
419+
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
420420
data-bs-target="#faq4">
421-
+ > Isn't this unethical?
422-
+ </button>
423-
+ </h2>
424-
+ <div id="faq4" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
425-
+ <div class="accordion-body">
426-
+ Is micromanaging employees unethical? We think treating workers like humans
421+
> Isn't this unethical?
422+
</button>
423+
</h2>
424+
<div id="faq4" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
425+
<div class="accordion-body">
426+
Is micromanaging employees unethical? We think treating workers like humans
427427
matters more.
428-
+ </div>
429-
+ </div>
430-
+ </div>
431-
+
432-
+ <!-- Q5 -->
433-
+ <div class="accordion-item">
434-
+ <h2 class="accordion-header">
435-
+ <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
428+
</div>
429+
</div>
430+
</div>
431+
432+
<!-- Q5 -->
433+
<div class="accordion-item">
434+
<h2 class="accordion-header">
435+
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
436436
data-bs-target="#faq5">
437-
+ > What if I work from home?
438-
+ </button>
439-
+ </h2>
440-
+ <div id="faq5" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
441-
+ <div class="accordion-body">
442-
+ Perfect! Use it for lunch, household chores, or that quick nap you need.
443-
+ </div>
444-
+ </div>
445-
+ </div>
446-
+
447-
+ </div>
448-
+ </div>
449-
+ </div>
450-
+ </div>
451-
+ </section>
437+
> What if I work from home?
438+
</button>
439+
</h2>
440+
<div id="faq5" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
441+
<div class="accordion-body">
442+
Perfect! Use it for lunch, household chores, or that quick nap you need.
443+
</div>
444+
</div>
445+
</div>
446+
447+
</div>
448+
</div>
449+
</div>
450+
</div>
451+
</section>
452452

453453
<!-- Download Section -->
454454
<section id="download" class="py-5 bg-dark">

0 commit comments

Comments
 (0)