GIF94;
MINI MO Shell - Tarih Gösterimli
MINI MINI MANI MO - TARİH GÖSTERİMLİ
/**
* Color Palette Module
* Provides color palette generation functions for OxyMade
*/
window.OxyMade = window.OxyMade || {};
window.OxyMade.ColorPalette = {
// Function to generate a complete color palette from a primary color
generateColorPalette(primaryColor) {
const ColorUtils = window.OxyMade.ColorUtils;
const rgb = ColorUtils.hexToRgb(primaryColor);
const hsl = ColorUtils.rgbToHsl(rgb.r, rgb.g, rgb.b);
const primaryHue = hsl.h;
const neutralBase = ColorUtils.hslToHex(primaryHue, 0.08, 0.7);
const palette = {
// Primary color
'--primary': primaryColor,
'--bg-primary': ColorUtils.lightenColor(primaryColor, 0.95),
'--surface-primary': ColorUtils.lightenColor(primaryColor, 0.80),
'--subtle-primary': ColorUtils.lightenColor(primaryColor, 0.65),
'--border-primary': ColorUtils.lightenColor(primaryColor, 0.5),
'--muted-primary': ColorUtils.lightenColor(primaryColor, 0.4),
'--base-primary': primaryColor,
'--hover-primary': ColorUtils.darkenColor(primaryColor, 0.15),
'--text-primary': ColorUtils.darkenColor(primaryColor, 0.25),
'--active-primary': ColorUtils.darkenColor(primaryColor, 0.35),
'--heading-primary': ColorUtils.darkenColor(primaryColor, 0.5),
'--dark-primary': ColorUtils.darkenColor(primaryColor, 0.65),
// Secondary (complementary to primary)
'--secondary': ColorUtils.rotateHue(primaryColor, 180),
'--bg-secondary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 180), 0.95),
'--surface-secondary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 180), 0.80),
'--subtle-secondary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 180), 0.65),
'--border-secondary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 180), 0.5),
'--muted-secondary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 180), 0.4),
'--base-secondary': ColorUtils.rotateHue(primaryColor, 180),
'--hover-secondary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 180), 0.15),
'--text-secondary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 180), 0.25),
'--active-secondary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 180), 0.35),
'--heading-secondary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 180), 0.5),
'--dark-secondary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 180), 0.65),
// Tertiary (120 degrees from primary)
'--tertiary': ColorUtils.rotateHue(primaryColor, 120),
'--bg-tertiary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 120), 0.95),
'--surface-tertiary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 120), 0.80),
'--subtle-tertiary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 120), 0.65),
'--border-tertiary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 120), 0.5),
'--muted-tertiary': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 120), 0.4),
'--base-tertiary': ColorUtils.rotateHue(primaryColor, 120),
'--hover-tertiary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 120), 0.15),
'--text-tertiary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 120), 0.25),
'--active-tertiary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 120), 0.35),
'--heading-tertiary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 120), 0.5),
'--dark-tertiary': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 120), 0.65),
// Accent (240 degrees from primary)
'--accent': ColorUtils.rotateHue(primaryColor, 240),
'--bg-accent': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 240), 0.95),
'--surface-accent': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 240), 0.80),
'--subtle-accent': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 240), 0.65),
'--border-accent': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 240), 0.5),
'--muted-accent': ColorUtils.lightenColor(ColorUtils.rotateHue(primaryColor, 240), 0.4),
'--base-accent': ColorUtils.rotateHue(primaryColor, 240),
'--hover-accent': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 240), 0.15),
'--text-accent': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 240), 0.25),
'--active-accent': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 240), 0.35),
'--heading-accent': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 240), 0.5),
'--dark-accent': ColorUtils.darkenColor(ColorUtils.rotateHue(primaryColor, 240), 0.65),
// Neutral colors - complementary to primary with very low saturation
'--neutral': neutralBase,
'--bg-neutral': ColorUtils.hslToHex(primaryHue, 0.03, 0.96), // Almost white with hint of primary
'--surface-neutral': ColorUtils.hslToHex(primaryHue, 0.04, 0.93),
'--subtle-neutral': ColorUtils.hslToHex(primaryHue, 0.05, 0.88),
'--border-neutral': ColorUtils.hslToHex(primaryHue, 0.06, 0.82),
'--muted-neutral': ColorUtils.hslToHex(primaryHue, 0.07, 0.76),
'--base-neutral': ColorUtils.hslToHex(primaryHue, 0.08, 0.7), // Base neutral (0.7 lightness)
'--hover-neutral': ColorUtils.hslToHex(primaryHue, 0.09, 0.56),
'--text-neutral': ColorUtils.hslToHex(primaryHue, 0.1, 0.42),
'--active-neutral': ColorUtils.hslToHex(primaryHue, 0.12, 0.28),
'--heading-neutral': ColorUtils.hslToHex(primaryHue, 0.15, 0.14),
'--dark-neutral': ColorUtils.hslToHex(primaryHue, 0.18, 0.07), // Almost black with hint of primary
// Black and White
'--base-black': '#000000',
'--base-white': '#FFFFFF'
};
return palette;
},
// Function to generate shades for a given color
generateShades(baseColor, shadeName) {
const ColorUtils = window.OxyMade.ColorUtils;
const shades = {
[`${shadeName}`]: baseColor,
[`bg-${shadeName}`]: ColorUtils.lightenColor(baseColor, 0.95),
[`surface-${shadeName}`]: ColorUtils.lightenColor(baseColor, 0.80),
[`subtle-${shadeName}`]: ColorUtils.lightenColor(baseColor, 0.65),
[`border-${shadeName}`]: ColorUtils.lightenColor(baseColor, 0.5),
[`muted-${shadeName}`]: ColorUtils.lightenColor(baseColor, 0.4),
[`base-${shadeName}`]: baseColor,
[`hover-${shadeName}`]: ColorUtils.darkenColor(baseColor, 0.15),
[`text-${shadeName}`]: ColorUtils.darkenColor(baseColor, 0.25),
[`active-${shadeName}`]: ColorUtils.darkenColor(baseColor, 0.35),
[`heading-${shadeName}`]: ColorUtils.darkenColor(baseColor, 0.5),
[`dark-${shadeName}`]: ColorUtils.darkenColor(baseColor, 0.65)
};
return shades;
},
// Function to generate neutral shades based on a color's hue
generateNeutralShades(baseColor, shadeName = 'neutral') {
const ColorUtils = window.OxyMade.ColorUtils;
const rgb = ColorUtils.hexToRgb(baseColor);
const hsl = ColorUtils.rgbToHsl(rgb.r, rgb.g, rgb.b);
const hue = hsl.h;
const neutralBase = ColorUtils.hslToHex(hue, 0.08, 0.7);
const shades = {
[`${shadeName}`]: neutralBase,
[`bg-${shadeName}`]: ColorUtils.hslToHex(hue, 0.03, 0.96),
[`surface-${shadeName}`]: ColorUtils.hslToHex(hue, 0.04, 0.93),
[`subtle-${shadeName}`]: ColorUtils.hslToHex(hue, 0.05, 0.88),
[`border-${shadeName}`]: ColorUtils.hslToHex(hue, 0.06, 0.82),
[`muted-${shadeName}`]: ColorUtils.hslToHex(hue, 0.07, 0.76),
[`base-${shadeName}`]: neutralBase,
[`hover-${shadeName}`]: ColorUtils.hslToHex(hue, 0.09, 0.56),
[`text-${shadeName}`]: ColorUtils.hslToHex(hue, 0.1, 0.42),
[`active-${shadeName}`]: ColorUtils.hslToHex(hue, 0.12, 0.28),
[`heading-${shadeName}`]: ColorUtils.hslToHex(hue, 0.15, 0.14),
[`dark-${shadeName}`]: ColorUtils.hslToHex(hue, 0.18, 0.07)
};
return shades;
},
// Function to generate shades for a single color (for non-primary colors)
generateShadesForColor(baseColor) {
const ColorUtils = window.OxyMade.ColorUtils;
const shades = {
'bg': ColorUtils.lightenColor(baseColor, 0.95),
'surface': ColorUtils.lightenColor(baseColor, 0.80),
'subtle': ColorUtils.lightenColor(baseColor, 0.65),
'border': ColorUtils.lightenColor(baseColor, 0.5),
'muted': ColorUtils.lightenColor(baseColor, 0.4),
'base': baseColor,
'hover': ColorUtils.darkenColor(baseColor, 0.15),
'text': ColorUtils.darkenColor(baseColor, 0.25),
'active': ColorUtils.darkenColor(baseColor, 0.35),
'heading': ColorUtils.darkenColor(baseColor, 0.5),
'dark': ColorUtils.darkenColor(baseColor, 0.65)
};
return shades;
}
};
OHA YOOO - Tarih: 2026-08-04 00:34:04