diff --git a/addons/dine360_theme_chennora/static/src/img/subtitle-icon.png b/addons/dine360_theme_chennora/static/src/img/subtitle-icon.png new file mode 100644 index 0000000..b552c8c Binary files /dev/null and b/addons/dine360_theme_chennora/static/src/img/subtitle-icon.png differ diff --git a/addons/dine360_theme_chennora/static/src/scss/theme.scss b/addons/dine360_theme_chennora/static/src/scss/theme.scss index 48ad0de..b08b368 100644 --- a/addons/dine360_theme_chennora/static/src/scss/theme.scss +++ b/addons/dine360_theme_chennora/static/src/scss/theme.scss @@ -45,7 +45,108 @@ } } +// Hero Shape Animation +.hero-shape-accent { + position: absolute; + top: 5%; + left: 2%; + width: 350px; + z-index: 1; + opacity: 0.1; + pointer-events: none; + filter: brightness(0) invert(1); // Make it white/light + animation: shapeFloat 15s ease-in-out infinite; +} + +@keyframes shapeFloat { + + 0%, + 100% { + transform: translateY(0) rotate(0deg) scale(1); + } + + 33% { + transform: translateY(-20px) rotate(3deg) scale(1.05); + } + + 66% { + transform: translateY(10px) rotate(-2deg) scale(0.98); + } +} + +// Hero Floating Elements +.hero-tomato-right { + position: absolute; + top: 5%; + right: 2%; + width: 200px; + z-index: 2; + pointer-events: none; + animation: shapeFloat 8s ease-in-out infinite; +} + +.hero-leaf-right { + position: absolute; + top: 15%; + right: 8%; + width: 80px; + z-index: 1; + pointer-events: none; + animation: shapeFloat 10s ease-in-out infinite reverse; +} + +.hero-lettuce-left { + position: absolute; + bottom: 5%; + left: -2%; + width: 250px; + z-index: 2; + pointer-events: none; + animation: shapeFloat 12s ease-in-out infinite; +} + +.hero-sketches-left { + position: absolute; + top: 2%; + left: 2%; + width: 300px; + z-index: 1; + pointer-events: none; + opacity: 0.2; + animation: shapeFloat 20s linear infinite; +} + +.hero-onion-mid { + position: absolute; + bottom: 20%; + left: 40%; + width: 120px; + z-index: 1; + pointer-events: none; + opacity: 0.6; + animation: shapeFloat 9s ease-in-out infinite; +} + // Section Headers +section h2.display-3, +section h2.display-4 { + font-size: 40px !important; + font-weight: 900 !important; + line-height: 50px !important; + text-transform: uppercase; + letter-spacing: -0.5px; + + @media (max-width: 991px) { + font-size: 32px !important; + line-height: 42px !important; + } + + @media (max-width: 767px) { + font-size: 28px !important; + line-height: 38px !important; + } +} + .section-title-wrapper { position: relative; z-index: 1; @@ -286,7 +387,7 @@ .deal-item { display: flex; align-items: center; - margin-bottom: 30px; + margin-bottom: 10px; transition: all 0.3s ease; padding: 10px; border-radius: 8px; @@ -906,7 +1007,7 @@ footer#bottom { display: flex; align-items: center; justify-content: center; - color: white; + color: white !important; transition: all 0.3s; &:hover { @@ -935,7 +1036,7 @@ footer#bottom { } a { - color: white; + color: white !important; text-decoration: none; transition: color 0.3s; @@ -948,7 +1049,7 @@ footer#bottom { .footer-accent-left { position: absolute; - left: -50px; + left: 0; bottom: 100px; width: 200px; opacity: 0.8; @@ -957,8 +1058,9 @@ footer#bottom { .footer-accent-right { position: absolute; - right: -50px; - top: 0; + right: 40px; + top: 40%; + transform: translateY(-50%); width: 250px; opacity: 0.8; pointer-events: none; diff --git a/addons/dine360_theme_chennora/views/layout.xml b/addons/dine360_theme_chennora/views/layout.xml index 2a20511..32624d6 100644 --- a/addons/dine360_theme_chennora/views/layout.xml +++ b/addons/dine360_theme_chennora/views/layout.xml @@ -160,7 +160,7 @@ diff --git a/addons/dine360_theme_chennora/views/pages.xml b/addons/dine360_theme_chennora/views/pages.xml index cc6f081..357ea58 100644 --- a/addons/dine360_theme_chennora/views/pages.xml +++ b/addons/dine360_theme_chennora/views/pages.xml @@ -22,6 +22,11 @@