11/* Container */
22.container {
33 min-height : 100vh ;
4- background : linear-gradient (135deg , # f9fafb 0% , # ffffff 100% );
5- transition : all 0.3s ease;
6- }
7-
8- .container .dark {
94 background : linear-gradient (135deg , # 111827 0% , # 1f2937 100% );
5+ transition : all 0.3s ease;
106}
117
12- /* Theme Toggle */
8+ /* Theme Toggle - keeping this for reference but it's now non-functional */
139.themeToggle {
1410 position : fixed;
1511 top : 1rem ;
2319 box-shadow : 0 10px 15px -3px rgba (0 , 0 , 0 , 0.1 ), 0 4px 6px -2px rgba (0 , 0 , 0 , 0.05 );
2420 transition : all 0.2s ease;
2521 transform : scale (1 );
26- background-color : # 1f2937 ;
27- color : # fbbf24 ;
22+ background-color : # eab308 ;
23+ color : # 713f12 ;
2824 border : none;
2925 cursor : pointer;
3026 font-size : 1.25rem ;
3127}
3228
3329.toggleButton : hover {
3430 transform : scale (1.1 );
35- background-color : # 374151 ;
36- }
37-
38- .toggleButtonDark {
39- background-color : # eab308 ;
40- color : # 713f12 ;
41- }
42-
43- .toggleButtonDark : hover {
4431 background-color : # facc15 ;
4532}
4633
5441 position : absolute;
5542 inset : 0 ;
5643 opacity : 0.05 ;
57- background-image : url ("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.1'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E" );
58- }
59-
60- .backgroundPatternDark {
6144 background-image : url ("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.1'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E" );
6245}
6346
9780 align-items : center;
9881 padding : 0.5rem 1rem ;
9982 border-radius : 9999px ;
100- background-color : # dcfce7 ;
101- color : # 166534 ;
83+ background-color : # 14532d ;
84+ color : # bbf7d0 ;
10285 font-size : 0.875rem ;
10386 font-weight : 500 ;
10487 margin-bottom : 1.5rem ;
10588}
10689
107- .badgeDark {
108- background-color : # 14532d ;
109- color : # bbf7d0 ;
110- }
111-
11290.title {
11391 font-size : 3rem ;
11492 font-weight : 700 ;
11593 margin-bottom : 1.5rem ;
116- background : linear-gradient (135deg , # 111827 0% , # 6b7280 100% );
94+ background : linear-gradient (135deg , # ffffff 0% , # d1d5db 100% );
11795 background-clip : text;
11896 -webkit-background-clip : text;
11997 color : transparent;
125103 }
126104}
127105
128- .titleDark {
129- background : linear-gradient (135deg , # ffffff 0% , # d1d5db 100% );
130- background-clip : text;
131- -webkit-background-clip : text;
132- }
133-
134106.subtitle {
135107 font-size : 1.25rem ;
136- color : # 6b7280 ;
108+ color : # d1d5db ;
137109 margin-bottom : 2rem ;
138110 max-width : 48rem ;
139111 margin-left : auto;
146118 }
147119}
148120
149- .subtitleDark {
150- color : # d1d5db ;
151- }
152-
153121/* Terminal */
154122.terminalContainer {
155123 max-width : 32rem ;
291259 align-items : center;
292260 gap : 0.5rem ;
293261 padding : 1rem 2rem ;
294- border : 2px solid # d1d5db ;
295- color : # 374151 ;
262+ border : 2px solid # 4b5563 ;
263+ color : # d1d5db ;
296264 font-weight : 600 ;
297265 border-radius : 0.5rem ;
298266 transform : scale (1 );
306274 transform : scale (1.05 );
307275}
308276
309- .secondaryButtonDark {
310- border-color : # 4b5563 ;
311- color : # d1d5db ;
312- }
313-
314277/* Installation Section */
315278.installationSection {
316- background-color : # f9fafb ;
317- padding : 4rem 0 ;
318- }
319-
320- .installationSectionDark {
321279 background-color : # 1f2937 ;
280+ padding : 4rem 0 ;
322281}
323282
324283.sectionContent {
343302.sectionTitle {
344303 font-size : 1.875rem ;
345304 font-weight : 700 ;
346- color : # 111827 ;
347- margin-bottom : 2rem ;
348- }
349-
350- .sectionTitleDark {
351305 color : # ffffff ;
306+ margin-bottom : 2rem ;
352307}
353308
354309.installationGrid {
363318}
364319
365320.installationCard {
366- background-color : # ffffff ;
367- border : 1px solid # e5e7eb ;
321+ background-color : # 111827 ;
322+ border : 1px solid # 374151 ;
368323 border-radius : 0.5rem ;
369324 padding : 1.5rem ;
370325 box-shadow : 0 10px 15px -3px rgba (0 , 0 , 0 , 0.1 ), 0 4px 6px -2px rgba (0 , 0 , 0 , 0.05 );
371326}
372327
373- .installationCardDark {
374- background-color : # 111827 ;
375- border-color : # 374151 ;
376- }
377-
378328.cardTitle {
379329 font-size : 1.125rem ;
380330 font-weight : 600 ;
381- color : # 111827 ;
382- margin-bottom : 1rem ;
383- }
384-
385- .cardTitleDark {
386331 color : # ffffff ;
332+ margin-bottom : 1rem ;
387333}
388334
389335.codeBlock {
410356.featuresTitle {
411357 font-size : 2.25rem ;
412358 font-weight : 700 ;
413- color : # 111827 ;
414- margin-bottom : 1rem ;
415- }
416-
417- .featuresTitleDark {
418359 color : # ffffff ;
360+ margin-bottom : 1rem ;
419361}
420362
421363.featuresSubtitle {
422364 font-size : 1.25rem ;
423- color : # 6b7280 ;
365+ color : # d1d5db ;
424366 max-width : 32rem ;
425367 margin : 0 auto;
426368}
427369
428- .featuresSubtitleDark {
429- color : # d1d5db ;
430- }
431-
432370.featuresGrid {
433371 display : grid;
434372 gap : 2rem ;
447385}
448386
449387.featureCard {
450- background-color : # ffffff ;
451- border : 1px solid # e5e7eb ;
388+ background-color : # 111827 ;
389+ border : 1px solid # 374151 ;
452390 border-radius : 0.75rem ;
453391 padding : 2rem ;
454392 box-shadow : 0 10px 15px -3px rgba (0 , 0 , 0 , 0.1 ), 0 4px 6px -2px rgba (0 , 0 , 0 , 0.05 );
461399 transform : translateY (-0.25rem );
462400}
463401
464- .featureCardDark {
465- background-color : # 111827 ;
466- border-color : # 374151 ;
467- }
468-
469402.featureEmoji {
470403 font-size : 2.25rem ;
471404 margin-bottom : 1rem ;
479412.featureTitle {
480413 font-size : 1.25rem ;
481414 font-weight : 700 ;
482- color : # 111827 ;
483- margin-bottom : 0.75rem ;
484- }
485-
486- .featureTitleDark {
487415 color : # ffffff ;
416+ margin-bottom : 0.75rem ;
488417}
489418
490419.featureDescription {
491- color : # 6b7280 ;
492- margin-bottom : 1rem ;
493- }
494-
495- .featureDescriptionDark {
496420 color : # d1d5db ;
421+ margin-bottom : 1rem ;
497422}
498423
499424.featureHighlight {
500425 display : inline-flex;
501426 align-items : center;
502427 padding : 0.25rem 0.75rem ;
503428 border-radius : 9999px ;
504- background-color : # dcfce7 ;
505- color : # 166534 ;
506- font-size : 0.875rem ;
507- font-weight : 500 ;
508- }
509-
510- .featureHighlightDark {
511429 background-color : # 14532d ;
512430 color : # bbf7d0 ;
431+ font-size : 0.875rem ;
432+ font-weight : 500 ;
513433}
514434
515435/* Stats Section */
548468/* Final CTA Section */
549469.finalCtaSection {
550470 padding : 5rem 0 ;
551- background-color : # f9fafb ;
552- }
553-
554- .finalCtaSectionDark {
555471 background-color : # 1f2937 ;
556472}
557473
577493.finalCtaTitle {
578494 font-size : 2.25rem ;
579495 font-weight : 700 ;
580- color : # 111827 ;
581- margin-bottom : 1.5rem ;
582- }
583-
584- .finalCtaTitleDark {
585496 color : # ffffff ;
497+ margin-bottom : 1.5rem ;
586498}
587499
588500.finalCtaSubtitle {
589501 font-size : 1.25rem ;
590- color : # 6b7280 ;
591- margin-bottom : 2rem ;
592- }
593-
594- .finalCtaSubtitleDark {
595502 color : # d1d5db ;
503+ margin-bottom : 2rem ;
596504}
597505
598506.finalCtaButtons {
629537
630538.finalSecondaryButton {
631539 padding : 1rem 2rem ;
632- border : 2px solid # 16a34a ;
633- color : # 16a34a ;
540+ border : 2px solid # 22c55e ;
541+ color : # 22c55e ;
634542 font-weight : 600 ;
635543 border-radius : 0.5rem ;
636544 transform : scale (1 );
641549}
642550
643551.finalSecondaryButton : hover {
644- background-color : # 16a34a ;
645- color : # ffffff ;
646- transform : scale (1.05 );
647- }
648-
649- .finalSecondaryButtonDark {
650- color : # 22c55e ;
651- border-color : # 22c55e ;
652- }
653-
654- .finalSecondaryButtonDark : hover {
655552 background-color : # 22c55e ;
656553 color : # ffffff ;
554+ transform : scale (1.05 );
657555}
0 commit comments