@@ -3,7 +3,7 @@ Project: kromacss
33Version: 1.0.2
44Description: A modern, lightweight, and dependency-free CSS framework designed for simplicity, speed, and adaptability.
55Author: Altxria Inc.
6- License: MIT
6+ License: CC BY-ND 4.0
77*/
88
99/* --- design-tokens.css --- */
@@ -372,22 +372,24 @@ svg {
372372.inline-block { display : inline-block; }
373373.inline { display : inline; }
374374
375+
375376/*REMOVE HIGHLIGHT BACKGROUND*/
376377.no-selection ::selection {
377- background : transparent;
378- color : inherit;
378+ background : transparent;
379+ color : inherit;
379380}
380381
381382.no-selection ::-moz-selection {
382- background : transparent;
383- color : inherit;
383+ background : transparent;
384+ color : inherit;
384385}
385386
386387.no-selection {
387- user-select : none;
388+ user-select : none;
388389}
389390
390391
392+
391393/* --- flexbox.css --- */
392394.flex { display : flex; gap : var (--space-4 ); }
393395.flex-wrap { flex-wrap : wrap; }
@@ -2749,136 +2751,6 @@ blockquote {
27492751}
27502752
27512753
2752- /* --- footer.css --- */
2753- /* Base Footer Styles */
2754- .kroma-footer {
2755- display : flex;
2756- flex-wrap : wrap;
2757- justify-content : space-between;
2758- align-items : center;
2759- padding : var (--space-6 ) var (--space-8 );
2760- background-color : var (--variant-bg , var (--neutral-900 ));
2761- color : var (--variant-text , var (--neutral-50 ));
2762- font-family : var (--font-sans );
2763- gap : var (--space-4 );
2764- border-top : 1px solid var (--variant-border , var (--neutral-700 ));
2765- transition : background-color var (--transition-colors ), box-shadow var (--transition-all );
2766- z-index : var (--z-10 );
2767- width : 100% ;
2768- }
2769-
2770- /* Footer Position: Sticky Bottom */
2771- .kroma-footer [data-stick = "bottom" ] {
2772- position : sticky;
2773- bottom : 0 ;
2774- }
2775-
2776- /* Footer Position: Fixed Bottom */
2777- .kroma-footer [data-stick = "fixed" ] {
2778- position : fixed;
2779- bottom : 0 ;
2780- left : 0 ;
2781- width : 100% ;
2782- box-shadow : var (--shadow-lg );
2783- }
2784-
2785- /* Footer Layouts */
2786- .kroma-footer [data-layout = "center" ] {
2787- flex-direction : column;
2788- text-align : center;
2789- gap : var (--space-4 );
2790- }
2791-
2792- .kroma-footer [data-layout = "stacked" ] {
2793- flex-direction : column;
2794- align-items : flex-start;
2795- gap : var (--space-6 );
2796- }
2797-
2798- /* Footer Links */
2799- .kroma-footer-links {
2800- display : flex;
2801- flex-wrap : wrap;
2802- justify-content : center;
2803- gap : var (--space-4 );
2804- }
2805-
2806- .kroma-footer-link {
2807- color : inherit;
2808- text-decoration : none;
2809- font-size : clamp (0.875rem , 1vw , 1rem );
2810- font-weight : 500 ;
2811- transition : color var (--transition-colors );
2812- }
2813-
2814- .kroma-footer-link : hover ,
2815- .kroma-footer-link : focus {
2816- color : var (--variant-hover-bg , var (--neutral-300 ));
2817- text-decoration : underline;
2818- }
2819-
2820- /* Footer Brand Section */
2821- .kroma-footer-brand {
2822- display : flex;
2823- align-items : center;
2824- gap : var (--space-3 );
2825- font-size : clamp (1.25rem , 2.5vw , 1.75rem );
2826- font-weight : bold;
2827- }
2828-
2829- .kroma-footer-logo {
2830- max-height : 50px ;
2831- object-fit : contain;
2832- }
2833-
2834- /* Footer Copyright Section */
2835- .kroma-footer-copyright {
2836- font-size : clamp (0.75rem , 1vw , 0.875rem );
2837- color : var (--neutral-400 );
2838- margin-top : var (--space-4 );
2839- text-align : center;
2840- width : 100% ;
2841- }
2842-
2843- /* Footer Social Links */
2844- .kroma-footer-social {
2845- display : flex;
2846- justify-content : center;
2847- gap : var (--space-3 );
2848- }
2849-
2850- .kroma-footer-social a {
2851- font-size : 1.5rem ;
2852- color : inherit;
2853- transition : color var (--transition-colors );
2854- }
2855-
2856- .kroma-footer-social a : hover ,
2857- .kroma-footer-social a : focus {
2858- color : var (--variant-hover-bg , var (--neutral-300 ));
2859- }
2860-
2861- /* Responsive Adjustments */
2862- @media (max-width : 768px ) {
2863- .kroma-footer {
2864- flex-direction : column;
2865- text-align : center;
2866- gap : var (--space-6 );
2867- padding : var (--space-4 );
2868- }
2869-
2870- .kroma-footer-links ,
2871- .kroma-footer-social {
2872- justify-content : center;
2873- gap : var (--space-3 );
2874- }
2875-
2876- .kroma-footer-copyright {
2877- margin-top : var (--space-6 );
2878- }
2879- }
2880-
2881-
28822754/* --- form.css --- */
28832755/* Base Form Group Styling */
28842756.kroma-form-group {
@@ -3905,34 +3777,6 @@ color: var(--variant-hover);
39053777
39063778
39073779
3908-
3909- .kroma-navbar : not (.toggled-menu ) .nav-menu {
3910- width : 100% ;
3911- display : flex;
3912- justify-content : flex-end;
3913- align-items : center;
3914- }
3915-
3916- .kroma-navbar : not (.toggled-menu ) .nav-menu ul {
3917- display : flex;
3918- flex-direction : row;
3919- list-style : none;
3920- gap : calc (var (--nav-size-base ) / 6 );
3921- }
3922-
3923- .kroma-navbar : not (.toggled-menu ) .nav-menu ul li a {
3924- text-decoration : none;
3925- }
3926-
3927- .kroma-navbar : not (.toggled-menu ) .nav-menu ul li a : hover {
3928- text-decoration : underline;
3929- }
3930-
3931- .kroma-navbar .kroma-avatar {
3932- max-height : calc (var (--nav-size-base ) / 1.5 );
3933- max-width : calc (var (--nav-size-base ) / 1.5 );
3934- }
3935-
39363780/* --- pagination.css --- */
39373781/* Pagination Container */
39383782.kroma-pagination {
@@ -4530,7 +4374,7 @@ html:has(.kroma-navbar) .kroma-sidebar{
45304374}
45314375
45324376.kroma-sidebar .collapsed .sdb-logo : not (: has (img )): after {
4533- display : none;
4377+ display : none;
45344378}
45354379
45364380.kroma-sidebar .sdb-logo span {
@@ -4639,59 +4483,59 @@ html:has(.kroma-navbar) .kroma-sidebar{
46394483
46404484.kroma-sidebar li {
46414485
4642- cursor : pointer;
4643-
4644- }
4486+ cursor : pointer;
4487+
4488+ }
46454489
46464490.kroma-sidebar : not (.collapsed ) li [data-idparent ] {
4647- padding-left : 10px ;
4648- max-height : 100px ;
4649- transition : 100ms ;
4491+ padding-left : 10px ;
4492+ max-height : 100px ;
4493+ transition : 100ms ;
46504494}
46514495
46524496.kroma-sidebar : not (.collapsed ) li .parent a span : before {
4653- content : "\f054" ;
4654- margin-right : 10px ;
4655- font-family : 'FontAwesome' ;
4656- display : inline-block;
4497+ content : "\f054" ;
4498+ margin-right : 10px ;
4499+ font-family : 'FontAwesome' ;
4500+ display : inline-block;
46574501}
46584502
46594503.kroma-sidebar li [data-idparent ].collapsed {
4660- max-height : 0 ;
4661- overflow : hidden;
4504+ max-height : 0 ;
4505+ overflow : hidden;
46624506}
46634507
46644508.kroma-sidebar li .parent : not (.collapsed ) a span : before {
4665- transform : rotate (90deg );
4666- transform-origin : center;
4509+ transform : rotate (90deg );
4510+ transform-origin : center;
46674511}
46684512
46694513
46704514/*variants*/
46714515
46724516.kroma-sidebar [data-variant ]: before {
4673- background : var (--variant-bg );
4674- border-color : var (--variant-border );
4517+ background : var (--variant-bg );
4518+ border-color : var (--variant-border );
46754519}
46764520
46774521.kroma-sidebar [data-variant ] .sdb-logo : after {
4678- background : var (--variant-border );
4522+ background : var (--variant-border );
46794523}
46804524
46814525.kroma-sidebar [data-variant ] .sdb-logo span ,
46824526.kroma-sidebar [data-variant ] .sdb-menu ul li i ,
46834527.kroma-sidebar [data-variant ] .sdb-menu ul li span ,
46844528.kroma-sidebar [data-variant ] .sdb-arrow {
4685- color : var (--variant-text );
4529+ color : var (--variant-text );
46864530}
46874531
46884532.kroma-sidebar [data-variant ] .sdb-menu ul li a : hover : before {
4689- background : var (--variant-hover-bg );
4533+ background : var (--variant-hover-bg );
46904534}
46914535
46924536.kroma-sidebar [data-variant ] .sdb-menu ul li a : hover > i ,
46934537.kroma-sidebar [data-variant ] .sdb-menu ul li a : hover > span {
4694- color : var (--variant-hover );
4538+ color : var (--variant-hover );
46954539}
46964540
46974541/* --- skeleton.css --- */
0 commit comments