/* ========================================================= */ /* Concrete Top Navigation Bar via PHP data + q-components */ /* ========================================================= */ /* ========================================================= */ /* Component: brand */ /* ========================================================= */ q-component c5-navbar-brand { q-property href: "#" q-property text: "" a.navbar-brand { href: "${this.component.href}" slot { logos } span.c5-brand-text { text { ${this.component.text} } } } } /* ========================================================= */ /* Component: normal nav link */ /* Slots: effects */ /* ========================================================= */ q-component c5-navbar-link { q-property label: "" q-property url: "#" q-property target: "_self" q-property classes: "" li.nav-item { a { class: "nav-link ${this.component.classes}" target: "${this.component.target}" href: "${this.component.url}" span.c5-nav-label { text { ${this.component.label} } } span.c5-nav-effect { slot { effects } } } } } /* ========================================================= */ /* Component: dropdown nav link */ /* Slots: children, effects */ /* ========================================================= */ q-component c5-navbar-submenu { q-property label: "" q-property url: "#" q-property target: "_self" q-property classes: "" li.nav-item.dropdown.w3-theme-d4 { a { class: "w3-theme-d4 nav-link dropdown-toggle ${this.component.classes}" data-concrete-toggle: "dropdown" target: "${this.component.target}" href: "javascript:void(0)" span.c5-nav-label { text { ${this.component.label} } } span.c5-nav-effect { slot { effects } } } ul.dropdown-menu.w3-theme-d4 { slot { children } } } } /* ========================================================= */ /* Component: dropdown child link */ /* ========================================================= */ q-component c5-navbar-dropdown-link { q-property label: "" q-property url: "#" q-property target: "_self" q-property classes: "" li { a { class: "w3-theme-d3 dropdown-item ${this.component.classes}" target: "${this.component.target}" href: "${this.component.url}" text { ${this.component.label} } } } } /* ========================================================= */ /* Component: search form */ /* ========================================================= */ q-component c5-navbar-search { q-property action: "" q-property searchLabel: "Search" form { method: "get" action: "${this.component.action}" input.form-control { type: "search" name: "query" placeholder: "${this.component.searchLabel}" aria-label: "${this.component.searchLabel}" } button.btn.btn-light.bg-white.ms-2 { type: "submit" i.fas.fa-search.text-secondary { } } } } /* ========================================================= */ /* Component: language switcher */ /* ========================================================= */ q-component c5-language-switcher { q-property label: "Switch Language" div.dropdown-center.ms-3.order-2 { button.btn.btn-link.dropdown-toggle.d-block.mx-auto { type: "button" data-bs-toggle: "dropdown" aria-expanded: "false" i.fas.fa-globe { } span.d-lg-none.ms-2 { text { ${this.component.label} } } } ul.dropdown-menu.dropdown-menu-lg-end.w-100 { slot { items } } } } /* ========================================================= */ /* Component: global nav particles */ /* ========================================================= */ q-component c5-navbar-particles { /* particle-emitter { id: "t120-emitter" emitrate: "74" lifetime: "700" lifetimevariation: "90" xvelocity: "0" yvelocity: "-1.75" xacceleration: "0" yacceleration: "0.0028" startsize: "25" endsize: "1" startopacity: "0.5" endopacity: "0.02" startsizevariation: "7" endsizevariation: "5" startopacityvariation: "0.16" endopacityvariation: "0.02" x: "110" y: "114" xvariation: "845" yvariation: "20" xvelocityvariation: "0" yvelocityvariation: "0.04" xaccelerationvariation: "0" yaccelerationvariation: "0.005" maxactiveparticles: "166" maxactiveparticlesvariation: "18" running: "true" interval: "10" src: "/packages/qhtml6/dist/assets/particle.png" color: "#08c473" qhtml-unsynced: "1" style { position: absolute inset: 0px display: block pointer-events: none overflow: hidden z-index: 1 } } */ } /* ========================================================= */ /* Render navbar */ /* ========================================================= */ div.ccm-block-top-navigation-bar.w3-theme-d4 { nav.w3-theme-d4.navbar.navbar-expand-lg.navbar-dark { /* html { } */ div.w3-theme-d4.container-fluid { c5-navbar-brand { href: "https://datafault.net/" text: "" logos { img { src: "https://datafault.net/application/files/3117/5788/1082/datafault-logo.png" class: "logo" } } } button.navbar-toggler.collapsed { type: "button" data-bs-toggle: "collapse" data-bs-target: "#top-navigation-bar-621" aria-controls: "top-navigation-bar-621" aria-expanded: "false" aria-label: "Toggle Navigation" span.icon-bar { } span.icon-bar { } span.icon-bar { } } div.w3-theme-d4.collapse.navbar-collapse.qhtml-navbar-menu { id: "top-navigation-bar-621" ul.navbar-nav.w3-theme-d4 { c5-navbar-submenu { label: "qhtml-js" url: "https://datafault.net/" target: "_self" classes: "" children { c5-navbar-dropdown-link { label: "QHTML6 Github Repo" url: "https://github.com/qhtml/qhtml6" target: "_blank" classes: "" } c5-navbar-dropdown-link { label: "qhtml6 documentation" url: "https://qhtml.github.io/qhtml6/doc/" target: "_blank" classes: "" } c5-navbar-dropdown-link { label: "Q-HTML Editor" url: "https://datafault.net/qhtml-js/qhtml-editor" target: "_self" classes: "" } c5-navbar-dropdown-link { label: "QHTML Drag and Drop Builder" url: "https://qhtml.github.io/qhtml6/dist/page-builder.html" target: "_blank" classes: "" } } } c5-navbar-submenu { label: "General Coding" url: "https://datafault.net/general-coding" target: "_self" classes: "nav-path-selected" children { c5-navbar-dropdown-link { label: "🔗 Custom Systems Integrations" url: "https://datafault.net/general-coding/custom-systems-integrations" target: "_self" classes: "" } c5-navbar-dropdown-link { label: "⚡ Performance Optimization" url: "https://datafault.net/general-coding/performance-optimization" target: "_self" classes: "active" } c5-navbar-dropdown-link { label: "🔒 Security Enhancements" url: "https://datafault.net/general-coding/security-enhancements" target: "_self" classes: "" } c5-navbar-dropdown-link { label: "🧩 CMS & Web Platform Extensions" url: "https://datafault.net/general-coding/cms-and-web-platform-extensions" target: "_self" classes: "" } c5-navbar-dropdown-link { label: "🎨 UI/UX Customization" url: "https://datafault.net/general-coding/uiux-customization" target: "_self" classes: "" } c5-navbar-dropdown-link { label: "Artificial Intelligence" url: "https://datafault.net/general-coding/ai-services" target: "_self" classes: "" } } } c5-navbar-link { label: "Active Projects" url: "https://datafault.net/active-projects" target: "_self" classes: "" } c5-navbar-link { label: "RouteUI Demo" url: "/tools/RouteUI/index.html" target: "_blank" classes: "" } c5-navbar-link { label: "America Freedom Proposal" url: "https://datafault.net/freedom" target: "_self" classes: "" } } c5-navbar-search { action: "https://datafault.net//search" searchLabel: "Search" } } } } }