leumas-private-shared/src/styles/baseStyles.js

Private React JSX Package For Leumas Shared Components, Headers, Footers, Asides, Login Pages, API Key Manager and much more. Styles and everything reusable to avoid DRY code across all of our subdomains

// Neuromorphic
export const NeuromorphicBaseStyle = `transition duration-300 ease-in-out p-3 bg-transparent shadow-xl border-glow rounded-lg focus:outline-none focus:shadow-inner-neu shadow-neu`;

// Glassmorphic
export const GlassmorphicBaseStyle = `
    transition duration-300 ease-in-out p-3 rounded-lg focus:outline-none
    bg-opacity-40 bg-white backdrop-blur-md border border-gray-300
`;

// Minimal
export const MinimalBaseStyle = `
    transition duration-300 ease-in-out p-3 rounded-lg focus:outline-none
    border border-gray-400 bg-transparent shadow-xl focus:border-blue-400
`;

// Retro
export const RetroBaseStyle = `
    transition duration-300 ease-in-out p-3 rounded-lg focus:outline-none
    bg-gradient-to-r from-green-400 via-yellow-500 to-red-500
    border border-yellow-600
`;

// Leumas (Taking a wild guess here, based on the name!)
// export const LeumasBaseStyle = `
//     transition duration-300 ease-in-out p-3 rounded-lg focus:outline-none
//     bg-gradient-to-t from-blue-800 via-blue-500 to-blue-400
//     border focus:border-black shadow-lg text-xs
// `;
// export const LeumasBaseStyle = `
// border-2 rounded-lg p-2 mt-2 hover:text-electric-blue dark:text-electric-blue bg-transparent
// `;
export const LeumasBaseStyle = `
block w-full p-2 text-gray-900 border border-gray-300 rounded-lg bg-gray-50 sm:text-xs focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 
bg-blue-400`;
export const LeumasBaseButtonStyle = `text-white bg-gradient-to-r from-blue-500 via-blue-600 to-blue-700 hover:bg-gradient-to-br focus:ring-4 focus:outline-none focus:ring-blue-300 dark:focus:ring-blue-800 font-medium rounded-lg text-sm px-5 py-2.5 text-center me-2 mb-2`

export const InputStyles = `bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5  dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500`

export const PasswordStyles = ``

export const EmailStyles = ``

export const NumberStyles = ``

export const DateStyles = ``

export const TextareaStyles = ``

export const SelectStyles = ``

export const SelectOptionStylexs = ``;

export const MultiSelectStyles = ``

export const CheckboxStyles = ``

export const AiModelsStyles = ``

export const SliderStyles = ``

export const NonChangeableTextStyles = ``;

export const FileUploadStyles = ``;

export const ImageUploadStyles = ``;

export const CodeStyles = ``;

export const SplitCodeStyles = ``