mycsslab/src/utilities/flexbox.css

MyCSSLab Quantum v3.0 - Revolutionary CSS framework with AI-powered intelligence, holographic UI, neural networks, and quantum effects

/**
 * FluxCSS Flexbox Utilities
 * Comprehensive flexbox layout utilities
 */

/* Display */
.my-flex { display: flex; }
.my-inline-flex { display: inline-flex; }
.my-hidden { display: none; }

/* Flex Direction */
.my-flex-row { flex-direction: row; }
.my-flex-row-reverse { flex-direction: row-reverse; }
.my-flex-col { flex-direction: column; }
.my-flex-col-reverse { flex-direction: column-reverse; }

/* Flex Wrap */
.my-flex-wrap { flex-wrap: wrap; }
.my-flex-wrap-reverse { flex-wrap: wrap-reverse; }
.my-flex-nowrap { flex-wrap: nowrap; }

/* Flex */
.my-flex-1 { flex: 1 1 0%; }
.my-flex-auto { flex: 1 1 auto; }
.my-flex-initial { flex: 0 1 auto; }
.my-flex-none { flex: none; }

/* Flex Grow */
.my-grow { flex-grow: 1; }
.my-grow-0 { flex-grow: 0; }

/* Flex Shrink */
.my-shrink { flex-shrink: 1; }
.my-shrink-0 { flex-shrink: 0; }

/* Justify Content */
.my-justify-start { justify-content: flex-start; }
.my-justify-end { justify-content: flex-end; }
.my-justify-center { justify-content: center; }
.my-justify-between { justify-content: space-between; }
.my-justify-around { justify-content: space-around; }
.my-justify-evenly { justify-content: space-evenly; }

/* Align Items */
.my-items-start { align-items: flex-start; }
.my-items-end { align-items: flex-end; }
.my-items-center { align-items: center; }
.my-items-baseline { align-items: baseline; }
.my-items-stretch { align-items: stretch; }

/* Align Content */
.my-content-start { align-content: flex-start; }
.my-content-end { align-content: flex-end; }
.my-content-center { align-content: center; }
.my-content-between { align-content: space-between; }
.my-content-around { align-content: space-around; }
.my-content-evenly { align-content: space-evenly; }
.my-content-stretch { align-content: stretch; }

/* Align Self */
.my-self-auto { align-self: auto; }
.my-self-start { align-self: flex-start; }
.my-self-end { align-self: flex-end; }
.my-self-center { align-self: center; }
.my-self-stretch { align-self: stretch; }
.my-self-baseline { align-self: baseline; }

/* Gap */
.my-gap-0 { gap: 0; }
.my-gap-1 { gap: 0.25rem; }
.my-gap-2 { gap: 0.5rem; }
.my-gap-3 { gap: 0.75rem; }
.my-gap-4 { gap: 1rem; }
.my-gap-5 { gap: 1.25rem; }
.my-gap-6 { gap: 1.5rem; }
.my-gap-8 { gap: 2rem; }
.my-gap-10 { gap: 2.5rem; }
.my-gap-12 { gap: 3rem; }
.my-gap-16 { gap: 4rem; }
.my-gap-20 { gap: 5rem; }
.my-gap-24 { gap: 6rem; }
.my-gap-32 { gap: 8rem; }
.my-gap-40 { gap: 10rem; }
.my-gap-48 { gap: 12rem; }
.my-gap-56 { gap: 14rem; }
.my-gap-64 { gap: 16rem; }
.my-gap-72 { gap: 18rem; }
.my-gap-80 { gap: 20rem; }
.my-gap-96 { gap: 24rem; }
.my-gap-px { gap: 1px; }

/* Gap X */
.my-gap-x-0 { column-gap: 0; }
.my-gap-x-1 { column-gap: 0.25rem; }
.my-gap-x-2 { column-gap: 0.5rem; }
.my-gap-x-3 { column-gap: 0.75rem; }
.my-gap-x-4 { column-gap: 1rem; }
.my-gap-x-5 { column-gap: 1.25rem; }
.my-gap-x-6 { column-gap: 1.5rem; }
.my-gap-x-8 { column-gap: 2rem; }
.my-gap-x-10 { column-gap: 2.5rem; }
.my-gap-x-12 { column-gap: 3rem; }
.my-gap-x-16 { column-gap: 4rem; }
.my-gap-x-20 { column-gap: 5rem; }
.my-gap-x-24 { column-gap: 6rem; }
.my-gap-x-32 { column-gap: 8rem; }
.my-gap-x-40 { column-gap: 10rem; }
.my-gap-x-48 { column-gap: 12rem; }
.my-gap-x-56 { column-gap: 14rem; }
.my-gap-x-64 { column-gap: 16rem; }
.my-gap-x-72 { column-gap: 18rem; }
.my-gap-x-80 { column-gap: 20rem; }
.my-gap-x-96 { column-gap: 24rem; }
.my-gap-x-px { column-gap: 1px; }

/* Gap Y */
.my-gap-y-0 { row-gap: 0; }
.my-gap-y-1 { row-gap: 0.25rem; }
.my-gap-y-2 { row-gap: 0.5rem; }
.my-gap-y-3 { row-gap: 0.75rem; }
.my-gap-y-4 { row-gap: 1rem; }
.my-gap-y-5 { row-gap: 1.25rem; }
.my-gap-y-6 { row-gap: 1.5rem; }
.my-gap-y-8 { row-gap: 2rem; }
.my-gap-y-10 { row-gap: 2.5rem; }
.my-gap-y-12 { row-gap: 3rem; }
.my-gap-y-16 { row-gap: 4rem; }
.my-gap-y-20 { row-gap: 5rem; }
.my-gap-y-24 { row-gap: 6rem; }
.my-gap-y-32 { row-gap: 8rem; }
.my-gap-y-40 { row-gap: 10rem; }
.my-gap-y-48 { row-gap: 12rem; }
.my-gap-y-56 { row-gap: 14rem; }
.my-gap-y-64 { row-gap: 16rem; }
.my-gap-y-72 { row-gap: 18rem; }
.my-gap-y-80 { row-gap: 20rem; }
.my-gap-y-96 { row-gap: 24rem; }
.my-gap-y-px { row-gap: 1px; }

/* Order */
.my-order-1 { order: 1; }
.my-order-2 { order: 2; }
.my-order-3 { order: 3; }
.my-order-4 { order: 4; }
.my-order-5 { order: 5; }
.my-order-6 { order: 6; }
.my-order-7 { order: 7; }
.my-order-8 { order: 8; }
.my-order-9 { order: 9; }
.my-order-10 { order: 10; }
.my-order-11 { order: 11; }
.my-order-12 { order: 12; }
.my-order-first { order: -9999; }
.my-order-last { order: 9999; }
.my-order-none { order: 0; }