@@ -530,15 +530,13 @@ table.sml-table {
530530 text-decoration : none ;
531531}
532532
533- /* Container for icon and label */
534533.nav-item {
535534 display : flex ;
536535 flex-direction : column ;
537536 align-items : center ;
538537 gap : 5px ;
539538}
540539
541- /* Common styling for the arrow injected via ::before */
542540.nav-item ::before {
543541 content : " " ;
544542 display : block ;
@@ -551,7 +549,6 @@ table.sml-table {
551549 transform-origin : center ;
552550}
553551
554- /* Common styling for the text label injected via ::after */
555552.nav-item ::after {
556553 font-size : 12px ;
557554 font-weight : bold ;
@@ -561,38 +558,32 @@ table.sml-table {
561558 transition : opacity 0.3s ease ;
562559}
563560
564- /* --- Active (Clickable) States --- */
565- /* Previous Button Active */
566561.nav-button.prev :not (.no-link ) .nav-item ::before {
567562 background-image : url (" data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 50 50'%3E%3Cpath d='M30 20L20 30L30 40' stroke='%23264caf' stroke-width='3' fill='none'/%3E%3C/svg%3E" );
568563}
569564.nav-button.prev :not (.no-link ) .nav-item ::after {
570565 content : " Previous" ;
571566}
572567
573- /* Next Button Active */
574568.nav-button.next :not (.no-link ) .nav-item ::before {
575569 background-image : url (" data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 50 50'%3E%3Cpath d='M20 20L30 30L20 40' stroke='%23264caf' stroke-width='3' fill='none'/%3E%3C/svg%3E" );
576570}
577571.nav-button.next :not (.no-link ) .nav-item ::after {
578572 content : " Next" ;
579573}
580574
581- /* Hover effects on active buttons */
582575.nav-button :not (.no-link ):hover .nav-item ::before {
583576 transform : scale (1.2 );
584577}
585578.nav-button :not (.no-link ):hover .nav-item ::after {
586579 opacity : 1 ;
587580}
588581
589- /* --- Disabled (no-link) States --- */
590582.nav-button.no-link {
591583 pointer-events : none ;
592584 cursor : default ;
593585}
594586
595- /* Disabled Previous Button */
596587.nav-button.no-link.prev .nav-item ::before {
597588 background-image : url (" data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 50 50'%3E%3Cpath d='M30 20L20 30L30 40' stroke='%23d3d3d3' stroke-width='3' fill='none'/%3E%3C/svg%3E" );
598589}
@@ -601,7 +592,6 @@ table.sml-table {
601592 color : #d3d3d3 ;
602593}
603594
604- /* Disabled Next Button */
605595.nav-button.no-link.next .nav-item ::before {
606596 background-image : url (" data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 50 50'%3E%3Cpath d='M20 20L30 30L20 40' stroke='%23d3d3d3' stroke-width='3' fill='none'/%3E%3C/svg%3E" );
607597}
0 commit comments