diff --git a/.gitea/workflows/deploy.yaml b/.gitea/workflows/deploy.yaml index fa5add0..9366139 100644 --- a/.gitea/workflows/deploy.yaml +++ b/.gitea/workflows/deploy.yaml @@ -102,28 +102,28 @@ jobs: dep: --file=./build/deploy.php release:switch stage private-key: ${{secrets.STAGE_KEY}} - deploy-production: - needs: build - runs-on: ubuntu-latest - steps: - - name: Setup PHP - uses: shivammathur/setup-php@7c0b4c8c8ebed23eca9ec2802474895d105b11bc - with: - php-version: ${{ env.PHP_VERSION }} - - uses: actions/download-artifact@v3 - with: - name: typo3 - - name: Extract artifact - run: | - tar xf typo3.tar.gz - rm typo3.tar.gz - - name: Install ssh agent and rsync - run: | - apt update - apt install -y openssh-client rsync - - name: Deploy - uses: deployphp/action@v1 - with: - deployer-binary: "./bin/dep" - dep: --file=./build/deploy.php release:create production - private-key: ${{secrets.PROD_KEY}} + # deploy-production: + # needs: build + # runs-on: ubuntu-latest + # steps: + # - name: Setup PHP + # uses: shivammathur/setup-php@7c0b4c8c8ebed23eca9ec2802474895d105b11bc + # with: + # php-version: ${{ env.PHP_VERSION }} + # - uses: actions/download-artifact@v3 + # with: + # name: typo3 + # - name: Extract artifact + # run: | + # tar xf typo3.tar.gz + # rm typo3.tar.gz + # - name: Install ssh agent and rsync + # run: | + # apt update + # apt install -y openssh-client rsync + # - name: Deploy + # uses: deployphp/action@v1 + # with: + # deployer-binary: "./bin/dep" + # dep: --file=./build/deploy.php release:create production + # private-key: ${{secrets.PROD_KEY}} diff --git a/build/servers.yaml b/build/servers.yaml index 86c34cf..a469b79 100644 --- a/build/servers.yaml +++ b/build/servers.yaml @@ -2,7 +2,7 @@ hosts: production: stage: production hostname: web-arm.cloonar.com - remote_user: lena_schilling_at + remote_user: dialog_relations_at writable_mode: chmod forward_agent: true deploy_path: ~/ @@ -10,7 +10,7 @@ hosts: stage: stage: staging hostname: web-arm.cloonar.com - remote_user: lena_schilling_cloonar_dev + remote_user: dialog_relations_cloonar_dev writable_mode: chmod forward_agent: true deploy_path: ~/ diff --git a/packages/base/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/HomePage.tsconfig b/packages/base/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/HomePage.tsconfig new file mode 100644 index 0000000..00f15c4 --- /dev/null +++ b/packages/base/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/HomePage.tsconfig @@ -0,0 +1,22 @@ +mod.web_layout.BackendLayouts { + home_page { + title = LLL:EXT:base/Resources/Private/Language/locallang_be.xlf:backend_layout.home_page + icon = EXT:base/Resources/Public/Images/BackendLayouts/default.png + config { + backend_layout { + colCount = 1 + rowCount = 1 + rows { + 1 { + columns { + 1 { + name = LLL:EXT:base/Resources/Private/Language/locallang_be.xlf:backend_layout.column.content + colPos = 0 + } + } + } + } + } + } + } +} \ No newline at end of file diff --git a/packages/base/Configuration/Sets/SitePackage/TypoScript/Helper/PageClass.typoscript b/packages/base/Configuration/Sets/SitePackage/TypoScript/Helper/PageClass.typoscript new file mode 100644 index 0000000..cde353b --- /dev/null +++ b/packages/base/Configuration/Sets/SitePackage/TypoScript/Helper/PageClass.typoscript @@ -0,0 +1,40 @@ +# PAGE CLASS +lib.page.class = COA +lib.page.class { + // Page alias or id as fallback + 10 = TEXT + 10 { + field = alias // uid + noTrimWrap = |page-|| + } + // Current level of the page within the tree structure + 20 = TEXT + 20 { + data = level:1 + noTrimWrap = | pagelevel-|| + } + // Language + 30 = TEXT + 30 { + data = siteLanguage:languageId + noTrimWrap = | language-|| + } + // Backend layout + 40 = TEXT + 40 { + data = pagelayout + replacement.10 { + search = pagets__ + replace = + } + ifEmpty = default + noTrimWrap = | backendlayout-|| + } + // Layout + 50 = TEXT + 50 { + field = layout + noTrimWrap = | layout-|| + ifEmpty = default + } +} \ No newline at end of file diff --git a/packages/base/Configuration/Sets/SitePackage/TypoScript/page.typoscript b/packages/base/Configuration/Sets/SitePackage/TypoScript/page.typoscript index 08a0d5c..b29c8d8 100644 --- a/packages/base/Configuration/Sets/SitePackage/TypoScript/page.typoscript +++ b/packages/base/Configuration/Sets/SitePackage/TypoScript/page.typoscript @@ -3,10 +3,24 @@ # Include constants # +# HELPER +@import 'EXT:base/Configuration/Sets/SitePackage/TypoScript/Helper/PageClass.typoscript' + page = PAGE page { typeNum = 0 shortcutIcon = EXT:base/Resources/Public/Favicons/favicon-96x96.png + + bodyTagCObject = COA + bodyTagCObject { + 10 = TEXT + 10.data = TSFE:id + 10.noTrimWrap = | id="p|"| + 20 =< lib.page.class + 20.stdWrap.noTrimWrap = | class="|"| + wrap = + } + 10 = PAGEVIEW 10 { paths { @@ -32,6 +46,7 @@ page { as = metanavigation } } + } meta { @@ -88,6 +103,7 @@ page { } footerMenuPid = {$footerMenuPid} + } lib.contentElement { diff --git a/packages/base/ContentBlocks/ContentElements/hero/templates/frontend.html b/packages/base/ContentBlocks/ContentElements/hero/templates/frontend.html index d5fba2c..6033b6a 100644 --- a/packages/base/ContentBlocks/ContentElements/hero/templates/frontend.html +++ b/packages/base/ContentBlocks/ContentElements/hero/templates/frontend.html @@ -50,15 +50,9 @@
+ class="bg-primary border-4 border-white text-white rounded-full p-5 inline-flex items-center justify-center hover:bg-opacity-90"> Scroll down - - - +
@@ -70,34 +64,30 @@

- Dialog Relations + {data.header}

- Sorem ipsum dolor sit amet, consectetur adipiscing elit. - Nunc vulputate libero et velit interdum, ac aliquet odio mattis. + {data.bodytext}

-
- - LinkedIn - +
+ + - - Instagram - + + - - Facebook - + +
diff --git a/packages/base/Resources/Private/Language/locallang_be.xlf b/packages/base/Resources/Private/Language/locallang_be.xlf index 81d9be7..a835fdd 100644 --- a/packages/base/Resources/Private/Language/locallang_be.xlf +++ b/packages/base/Resources/Private/Language/locallang_be.xlf @@ -18,6 +18,16 @@ Right + + Home Page + + + Hero + + + Content + + diff --git a/packages/base/Resources/Private/PageView/Pages/Home_page.html b/packages/base/Resources/Private/PageView/Pages/Home_page.html new file mode 100644 index 0000000..b914912 --- /dev/null +++ b/packages/base/Resources/Private/PageView/Pages/Home_page.html @@ -0,0 +1,6 @@ + + + + Render main content for colPos 0 (Home Page) + + \ No newline at end of file diff --git a/packages/base/Resources/Public/Icons/Extension.svg b/packages/base/Resources/Public/Icons/Extension.svg deleted file mode 100644 index d853637..0000000 --- a/packages/base/Resources/Public/Icons/Extension.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/angle-left.svg b/packages/base/Resources/Public/Icons/angle-left.svg deleted file mode 100644 index 4e24f33..0000000 --- a/packages/base/Resources/Public/Icons/angle-left.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/angle-right.svg b/packages/base/Resources/Public/Icons/angle-right.svg deleted file mode 100644 index b0b8cbb..0000000 --- a/packages/base/Resources/Public/Icons/angle-right.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/arrow-down.svg b/packages/base/Resources/Public/Icons/arrow-down.svg new file mode 100644 index 0000000..01399b1 --- /dev/null +++ b/packages/base/Resources/Public/Icons/arrow-down.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/base/Resources/Public/Icons/email.svg b/packages/base/Resources/Public/Icons/email.svg deleted file mode 100644 index 0f8aafc..0000000 --- a/packages/base/Resources/Public/Icons/email.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/facebook.svg b/packages/base/Resources/Public/Icons/facebook.svg new file mode 100644 index 0000000..8d928fc --- /dev/null +++ b/packages/base/Resources/Public/Icons/facebook.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/base/Resources/Public/Icons/instagram.svg b/packages/base/Resources/Public/Icons/instagram.svg index 3a5f02b..a0005e1 100644 --- a/packages/base/Resources/Public/Icons/instagram.svg +++ b/packages/base/Resources/Public/Icons/instagram.svg @@ -1,3 +1,5 @@ - - + + + + diff --git a/packages/base/Resources/Public/Icons/linkedin.svg b/packages/base/Resources/Public/Icons/linkedin.svg index 41dc387..45f06f5 100644 --- a/packages/base/Resources/Public/Icons/linkedin.svg +++ b/packages/base/Resources/Public/Icons/linkedin.svg @@ -1,3 +1,5 @@ - - + + + + diff --git a/packages/base/Resources/Public/Icons/phone.svg b/packages/base/Resources/Public/Icons/phone.svg deleted file mode 100644 index 06b9376..0000000 --- a/packages/base/Resources/Public/Icons/phone.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/skip-back.svg b/packages/base/Resources/Public/Icons/skip-back.svg deleted file mode 100644 index 30a1631..0000000 --- a/packages/base/Resources/Public/Icons/skip-back.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/skip-forward.svg b/packages/base/Resources/Public/Icons/skip-forward.svg deleted file mode 100644 index f2b4ac2..0000000 --- a/packages/base/Resources/Public/Icons/skip-forward.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/tiktok.svg b/packages/base/Resources/Public/Icons/tiktok.svg deleted file mode 100644 index d0230ba..0000000 --- a/packages/base/Resources/Public/Icons/tiktok.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/x.svg b/packages/base/Resources/Public/Icons/x.svg deleted file mode 100644 index 97f47cc..0000000 --- a/packages/base/Resources/Public/Icons/x.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/JavaScript/navigation.js b/packages/base/Resources/Public/JavaScript/navigation.js index a986230..5c78ba5 100644 --- a/packages/base/Resources/Public/JavaScript/navigation.js +++ b/packages/base/Resources/Public/JavaScript/navigation.js @@ -1,16 +1,39 @@ document.addEventListener('DOMContentLoaded', function () { - const nav = document.getElementById('mainNav'); + const nav = document.getElementById('mainNav'); // Keep for mobile toggle + const header = document.querySelector('header'); // Get the header element const toggle = document.getElementById('navToggle'); // Toggle menu on mobile toggle.addEventListener('click', function () { - nav.classList.toggle('open'); + nav.classList.toggle('open'); // Mobile menu still controlled by nav toggle.classList.toggle('active'); }); - // No need to add or remove sticky class here since CSS handles position: sticky - // We simply rely on the CSS-based sticky behavior and reserved space via body padding. - + // Handle transparent header scroll effect for home page on desktop + const body = document.body; + const scrollThreshold = 50; // Pixels to scroll before changing background + + function handleScroll() { + // Check if it's the home page layout and desktop view + if (header && body.classList.contains('backendlayout-home_page') && window.innerWidth >= 1024) { // 1024px is Tailwind's default lg breakpoint + if (window.scrollY > scrollThreshold) { + header.classList.add('scrolled'); // Add class to header + } else { + header.classList.remove('scrolled'); // Remove class from header + } + } else if (header) { // Check if header exists before trying to remove class + // Ensure scrolled class is removed if not on home page desktop or resized below lg + header.classList.remove('scrolled'); // Remove class from header + } + } + + // Initial check in case the page loads already scrolled + handleScroll(); + + // Add scroll and resize listeners + window.addEventListener('scroll', handleScroll); + window.addEventListener('resize', handleScroll); // Re-check on resize + const submenuParents = document.querySelectorAll('.nav-item.has-submenu'); submenuParents.forEach(parent => { parent.addEventListener('click', (e) => { diff --git a/packages/base/Resources/Public/Scss/abstracts/_icons.scss b/packages/base/Resources/Public/Scss/abstracts/_icons.scss index 6183328..950420e 100644 --- a/packages/base/Resources/Public/Scss/abstracts/_icons.scss +++ b/packages/base/Resources/Public/Scss/abstracts/_icons.scss @@ -21,36 +21,15 @@ mask-image: url(../Icons/instagram.svg); } -.ci-tiktok::before { - mask-image: url(../Icons/tiktok.svg); +.ci-linkedin::before { + mask-image: url(../Icons/linkedin.svg); width: 0.9em; height: 0.9em; } -.ci-linkedin::before { - mask-image: url(../Icons/linkedin.svg); +.ci-facebook::before { + mask-image: url(../Icons/facebook.svg); } -.ci-x::before { - mask-image: url(../Icons/x.svg); -} -.ci-email::before { - mask-image: url(../Icons/email.svg); -} -.ci-phone::before { - mask-image: url(../Icons/phone.svg); -} -.ci-angle-right::before { - mask-image: url(../Icons/angle-right.svg); -} - -.ci-angle-left::before { - mask-image: url(../Icons/angle-left.svg); -} - -.ci-skip-forward::before { - mask-image: url(../Icons/skip-forward.svg); -} - -.ci-skip-back::before { - mask-image: url(../Icons/skip-back.svg); +.ci-arrow-down::before { + mask-image: url(../Icons/arrow-down.svg); } diff --git a/packages/base/Resources/Public/Scss/base/_global.scss b/packages/base/Resources/Public/Scss/base/_global.scss index 63af864..63b5583 100644 --- a/packages/base/Resources/Public/Scss/base/_global.scss +++ b/packages/base/Resources/Public/Scss/base/_global.scss @@ -1,15 +1,19 @@ +:root { + --color-primary: #0B197D; +} + body { line-height: 1.5; } -a[href^="tel:"]::before { - @extend .ci; - @extend .ci-phone; - margin-right: 0.5em; -} +/* a[href^="tel:"]::before { */ +/* @extend .ci; */ +/* @extend .ci-phone; */ +/* margin-right: 0.5em; */ +/* } */ -a[href^="mailto:"]::before { - @extend .ci; - @extend .ci-email; - margin-right: 0.5em; -} +/* a[href^="mailto:"]::before { */ +/* @extend .ci; */ +/* @extend .ci-email; */ +/* margin-right: 0.5em; */ +/* } */ diff --git a/packages/base/Resources/Public/Scss/components/_news.scss b/packages/base/Resources/Public/Scss/components/_news.scss index 2c366d6..2d58983 100644 --- a/packages/base/Resources/Public/Scss/components/_news.scss +++ b/packages/base/Resources/Public/Scss/components/_news.scss @@ -114,7 +114,7 @@ mask-position: center; background-color: currentColor; /* vertical-align: middle; */ - mask-image: url(../Icons/angle-right.svg); + /* mask-image: url(../Icons/angle-right.svg); */ } } diff --git a/packages/base/Resources/Public/Scss/layouts/_home-page.scss b/packages/base/Resources/Public/Scss/layouts/_home-page.scss new file mode 100644 index 0000000..fb503df --- /dev/null +++ b/packages/base/Resources/Public/Scss/layouts/_home-page.scss @@ -0,0 +1,82 @@ +// Styles specific to the Home Page layout (.backendlayout-home_page) + +.backendlayout-home_page { + + // --- Target the header element --- + header { + // --- Mobile First: Always Primary Background --- + @apply bg-primary text-white; + + // Mobile link/icon colors (on primary background) + #mainNav .nav-link { // Target links within #mainNav + @apply text-white hover:text-gray-200; + } + #mainNav .nav-toggle-icon, + #mainNav .nav-toggle-icon::before, + #mainNav .nav-toggle-icon::after { + @apply bg-white; // Ensure mobile toggle is visible + } + // Adjust mobile submenu link colors if needed (depends on dropdown background) + #mainNav .sub-menu .nav-link { + @apply text-gray-700 hover:text-black; // Assuming light dropdown background + } + + // --- Desktop Styles --- + @screen lg { + // Initial state: Transparent background, fixed position + @apply fixed top-0 left-0 right-0 z-50 bg-transparent transition-colors duration-300 ease-in-out; + + // Initial link colors and background for transparent header (desktop) + #mainNav .nav-link { + @apply bg-white text-primary hover:text-brand px-3 py-1 rounded; // Add bg-white, padding, and rounded corners + } + // Ensure mobile toggle icon also uses primary color initially on desktop if visible (though usually hidden) + #mainNav .nav-toggle-icon, + #mainNav .nav-toggle-icon::before, + #mainNav .nav-toggle-icon::after { + @apply bg-primary; + } + // Desktop submenu link colors (assuming light dropdown background) + #mainNav .sub-menu .nav-link { + @apply text-gray-700 hover:text-black; + } + + // Scrolled state: Primary background (desktop) + &.scrolled { + @apply bg-primary shadow-md; + + // Link colors for primary background (desktop scrolled) + #mainNav .nav-link { + @apply bg-primary text-white hover:text-gray-200; + } + // Submenu link colors likely don't need changing here if dropdown is consistent + } + } + } +} + +// --- Default styles for header on NON-home pages --- +// Ensures header has a background and correct colors on other pages +body:not(.backendlayout-home_page) { + header { + @apply bg-primary text-white; // Or your desired default background/text + + #mainNav .nav-link { + @apply text-white hover:text-gray-200; + } + #mainNav .nav-toggle-icon, + #mainNav .nav-toggle-icon::before, + #mainNav .nav-toggle-icon::after { + @apply bg-white; + } + #mainNav .sub-menu .nav-link { + @apply text-gray-700 hover:text-black; // Assuming light dropdown background + } + } + // On non-home pages, main content doesn't need extra padding-top + @screen lg { + main { + @apply pt-0; // Reset padding if needed + } + } +} \ No newline at end of file diff --git a/packages/base/Resources/Public/Scss/main.scss b/packages/base/Resources/Public/Scss/main.scss index fe2890b..e3e7267 100644 --- a/packages/base/Resources/Public/Scss/main.scss +++ b/packages/base/Resources/Public/Scss/main.scss @@ -15,3 +15,5 @@ @import "components/news_detail"; @import 'components/footer'; @import 'components/buttons'; +@import 'layouts/home-page'; + diff --git a/tailwind.config.js b/tailwind.config.js index f983855..7c715f4 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -18,12 +18,7 @@ module.exports = { hajime: ['"Hajime Sans"', ...defaultTheme.fontFamily.sans], }, colors: { - primary: { - DEFAULT: '#0B197D', // Use SCSS primary color for text - dark: '#1C2B00', - light: '#4E5E32', - 'brand-blue': '#0B197D', - }, + primary: 'var(--color-primary)', yellow: '#F5AE07', 'light-green': '#F4F6EC', brand: '#6B8E23', // Added brand color for hover states from SCSS