waibu-blu 1.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Ardhi Lukianto
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1 @@
+# waibu-blu

package/bajo/hook/waibu-mpa@after-build-locals.js

@@ -0,0 +1,9 @@
+async function waibuMpaAfterBuildLocals ({ menu, _meta }) {
+  const { findIndex } = this.lib._
+  if (menu && menu.pages && !['/component/render'].includes(_meta.url)) {
+    const idx = findIndex(menu.pages, { title: 'account' })
+    if (idx > -1) menu.pages.splice(idx, 1)
+  }
+}
+
+export default waibuMpaAfterBuildLocals

package/bajoTemplate/extend/main/partial/breadcrumb.html

@@ -0,0 +1 @@
+<c:breadcrumb auto-detect margin="bottom-3"/>

package/bajoTemplate/extend/main/partial/footer.html

@@ -0,0 +1,14 @@
+<c:container class="footer">
+  <c:grid-row margin="y-5">
+    <c:grid-col col="6-md">
+      &copy; 2025 <a href="/"><%= _meta.site.orgName %></a>
+    </c:grid-col>
+    <c:grid-col col="6-md">
+      <c:div flex="justify-content:end">
+        <a href="https://maritime.rapp.id">
+          <c:img src="waibuMpa:/logo/main?type=full<%= _meta.darkMode ? '-light' : '' %>" height="20" />
+        </a>
+      </c:div>
+    </c:grid-col>
+  </c:grid-row>
+</c:container>

package/bajoTemplate/extend/main/partial/header.html

@@ -0,0 +1,21 @@
+<c:div class="header" position="type:sticky-top" margin="bottom-4">
+  <c:container>
+    <c:navbar expandable>
+      <a href="/" class="navbar-brand" >
+        <c:img src="waibuMpa:/logo/main?type=med-light" height="40" display="type:none type:block-md"/>
+        <c:img src="waibuMpa:/logo/main?type=light" height="50" display="type:none-md"/>
+      </a>
+      <c:nav tag="ul">
+      </c:nav>
+      <c:nav tag="ul" dim="width:100" flex="justify-content:end">
+        <% if (_meta.isAdmin) { %>
+        <c:btn color="danger" href="waibuAdmin:/" t:content="adminArea" margin="end-3"/>
+        <% } %>
+        <c:nav-toggle-fullscreen text="color:light" />
+        <c:nav-dropdown-darkmode dropdown-menudir="end" text="color:light" />
+        <c:nav-dropdown-language dropdown-menudir="end" text="color:light"/>
+      </c:nav>
+    </c:navbar>
+    <!-- include main.partial:/main-navbar.html -->
+  </c:container>
+</c:div>

package/bajoTemplate/extend/main/partial/main-navbar.html

@@ -0,0 +1,24 @@
+<c:navbar class="main-navbar" rounded border shadow="sm" style="top:20px" margin="bottom-5">
+  <c:nav tag="ul">
+    <% for (const cat of menu.pages) { %>
+      <% if (cat.children) { %>
+      <c:nav-item t:content="<%= cat.title %>" dropdown>
+        <% for (const child of cat.children) { %>
+          <% if (child.visible === 'anon' && _meta.user) continue %>
+          <% if (child.visible === 'auth' && !_meta.user) continue %>
+          <% if (child.title === '-') { %>
+          <c:dropdown-item divider />
+          <% } else { %>
+          <c:dropdown-item href="<%= child.href %>" t:content="<%= child.title %>" />
+          <% } %>
+        <% } %>
+      </c:nav-item>
+      <% } else { %>
+      <c:nav-item t:content="<%= cat.title %>" href="<%= cat.href %>" <%= cat.icon ? 'icon="' + cat.icon + '"' : '' %> />
+      <% } %>
+    <% } %>
+  </c:nav>
+  <c:nav tag="ul">
+    <c:nav-dropdown-user title dropdown-menudir="end"/>
+  </c:nav>
+</c:navbar>

package/bajoTemplate/extend/sumba/layout/centered.html

@@ -0,0 +1,25 @@
+<c:page-start body-class="bg-alt" />
+<c:main>
+  <c:container>
+    <c:div flex="align-items:center justify-content:center" dim="height:viewport">
+      <c:grid-row dim="width:100">
+        <c:grid-col col="3-lg 2-md"></c:grid-col>
+        <c:grid-col col="6-lg 8-md">
+          <c:div flex="justify-content:center">
+            <a href="https://maritime.rapp.id">
+              <c:img src="waibuMpa:/logo/main?type=full<%= _meta.darkMode ? '-light' : '' %>" height="30" />
+            </a>
+          </c:div>
+          <c:card shadow margin="top-5">
+            <c:card-body>
+              <c:heading margin="bottom-4" text="align:center color:primary" type="5-display" content="<%= page.title %>" />
+              <!-- body -->
+            </c:card-body>
+          </c:card>
+          <!-- include sumba.partial:/layout/footer.html -->
+        </c:grid-col>
+        <c:grid-col col="3-lg 2-md"></c:grid-col>
+      </c:grid-row>
+  </c:container>
+</c:main>
+<c:page-end />

package/bajoTemplate/extend/sumba/layout/default.html

@@ -0,0 +1,14 @@
+<c:page-start />
+<c:main>
+  <!-- include main.partial:/header.html -->
+  <c:container>
+    <c:heading type="4-display" content="<%= page.title %>" />
+    <c:card shadow="sm" border="none">
+      <c:card-body>
+        <!-- body -->
+      </c:card-body>
+    </c:card>
+  </c:container>
+  <!-- include main.partial:/footer.html -->
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/sumba/layout/info.html

@@ -0,0 +1,14 @@
+<c:page-start />
+<c:main>
+  <!-- include main.partial:/header.html -->
+  <c:container>
+    <c:heading type="4-display" content="<%= page.title %>" margin="bottom-4" />
+    <c:card shadow="sm" border="none">
+      <c:card-body>
+        <!-- body -->
+      </c:card-body>
+    </c:card>
+  </c:container>
+  <!-- include main.partial:/footer.html -->
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/sumbaSeatrack/layout/default.html

@@ -0,0 +1,14 @@
+<c:page-start />
+<c:main>
+  <!-- include main.partial:/header.html -->
+  <c:container>
+    <c:heading type="4-display" content="<%= page.title %>" />
+    <c:card shadow="sm" border="none">
+      <c:card-body>
+        <!-- body -->
+      </c:card-body>
+    </c:card>
+  </c:container>
+  <!-- include main.partial:/footer.html -->
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/waibuAdmin/layout/crud/default.html

@@ -0,0 +1,13 @@
+<c:page-start body-class="bg-alt" />
+<c:main flex>
+  <!-- include waibuAdmin.partial:/layout/sidebar.html -->
+  <c:div flex="fill column">
+    <!-- include waibuAdmin.partial:/layout/navbar.html -->
+    <c:container margin="start-0 top-3 bottom-5" style="max-width: 992px;">
+      <!-- include waibuAdmin.partial:/layout/crud/before-list.html -->
+      <!-- body -->
+      <!-- include waibuAdmin.partial:/layout/crud/after-list.html -->
+    </c:container>
+  </c:div>
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/waibuAdmin/layout/crud/wide.html

@@ -0,0 +1,13 @@
+<c:page-start body-class="bg-alt" />
+<c:main flex>
+  <!-- include waibuAdmin.partial:/layout/sidebar.html -->
+  <c:div flex="fill column">
+    <!-- include waibuAdmin.partial:/layout/navbar.html -->
+    <c:container margin="start-0 top-3 bottom-5" style="max-width: 1200px;">
+      <!-- include waibuAdmin.partial:/layout/crud/before-list.html -->
+      <!-- body -->
+      <!-- include waibuAdmin.partial:/layout/crud/after-list.html -->
+    </c:container>
+  </c:div>
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/waibuAdmin/layout/default.html

@@ -0,0 +1,11 @@
+<c:page-start body-class="bg-alt" />
+<c:main flex>
+  <!-- include waibuAdmin.partial:/layout/sidebar.html -->
+  <c:div flex="fill column">
+    <!-- include waibuAdmin.partial:/layout/navbar.html -->
+    <c:container margin="start-0 top-3 bottom-5" style="max-width: 992px;">
+      <!-- body -->
+    </c:container>
+  </c:div>
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/waibuAdmin/layout/wide.html

@@ -0,0 +1,11 @@
+<c:page-start body-class="bg-alt" />
+<c:main flex>
+  <!-- include waibuAdmin.partial:/layout/sidebar.html -->
+  <c:div flex="fill column">
+    <!-- include waibuAdmin.partial:/layout/navbar.html -->
+    <c:container margin="start-0 top-3 bottom-5" style="max-width: 1200px;">
+      <!-- body -->
+    </c:container>
+  </c:div>
+</c:main>
+<c:page-end back-to-top/>

package/bajoTemplate/extend/waibuAdmin/partial/layout/crud/after-list.html

@@ -0,0 +1,9 @@
+      </c:card-body>
+    </c:card>
+<% if (arguments[0].addOns && arguments[0].addOns.length > 0) { %>
+  </c:grid-col>
+  <c:grid-col col="4-md 3-lg">
+    <c:div id="sb-addons"></c:div>
+  </c:grid-col>
+</c:grid-row>
+<% } %>

package/bajoTemplate/extend/waibuAdmin/partial/layout/crud/before-list.html

@@ -0,0 +1,6 @@
+<% if (arguments[0].addOns && arguments[0].addOns.length > 0) { %>
+<c:grid-row gutter="3">
+  <c:grid-col col="8-md 9-lg">
+<% } %>
+    <c:card>
+      <c:card-body>

package/bajoTemplate/extend/waibuAdmin/partial/layout/navbar.html

@@ -0,0 +1,12 @@
+<c:navbar background="color:secondary-subtle" position="type:sticky-top" padding="x-3" shadow="sm" style="min-height:57px" <%= _meta.darkMode ? 'border="side:bottom"' : '' %>>
+  <c:grid-row gutter="0" dim="width:100">
+    <c:grid-col col="6-lg" flex="align-items:center">
+      <div id="fullTitle">
+        <c:heading type="5" t:content="<%= page.fullTitle %>" />
+      </div>
+    </c:grid-col>
+    <c:grid-col col="6-lg" flex="justify-content:end-lg align-items:center">
+      <c:breadcrumb auto-detect href-rebuild margin="all-0"/>
+    </c:grid-col>
+  </c:grid-row>
+</c:navbar>

package/bajoTemplate/extend/waibuAdmin/partial/layout/sidebar.html

@@ -0,0 +1,3 @@
+<c:sidebar shadow class="header" text="color:light" align="start" mini expanded auto-fill style="width:4.1rem" fancy-profile <%= _meta.darkMode ? 'border="side:end"' : '' %>>
+  <c:app-launcher-trigger img-src="waibuMpa:/logo/main?type=light" img-dim-height="56" x-data @click="wbs.appLauncher('darkmode language')" />
+</c:sidebar>

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "waibu-blu",
+  "version": "1.1.0",
+  "description": "Blu theme for Waibu Framework",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ardhi/waibu-blu.git"
+  },
+  "keywords": [
+    "blu",
+    "waibu",
+    "theme",
+    "bajo",
+    "framework",
+    "fastify",
+    "modular"
+  ],
+  "author": "Ardhi Lukianto <ardhi@lukianto.com>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/ardhi/waibu-blu/issues"
+  },
+  "homepage": "https://github.com/ardhi/waibu-blu#readme"
+}

package/plugin/factory.js

@@ -0,0 +1,18 @@
+async function factory (pkgName) {
+  const me = this
+
+  return class WaibuBlu extends this.lib.BajoPlugin {
+    constructor () {
+      super(pkgName, me.app)
+      this.alias = 'wblu'
+      this.dependencies = ['waibu-mpa', 'waibu-bootstrap']
+      this.config = {
+        waibu: {
+          prefix: 'blu'
+        }
+      }
+    }
+  }
+}
+
+export default factory

package/waibuMpa/theme.js

@@ -0,0 +1,9 @@
+async function theme (ctx) {
+  return {
+    name: 'blu',
+    css: ['$waibuBlu.asset:/css/blu.css'],
+    framework: 'bootstrap'
+  }
+}
+
+export default theme

package/waibuStatic/asset/css/blu.css

@@ -0,0 +1,33 @@
+:root {
+  --blu-color-body: #f5f6f8;
+  --blu-color-header: #5b73e8;
+  --blu-color-body-alt: rgba(91, 140, 232, .25);
+}
+
+body:not([data-bs-theme="dark"]).bg-alt {
+  background-color: var(--blu-color-body-alt);
+}
+
+body:not([data-bs-theme="dark"]) {
+  background-color: var(--blu-color-body);
+}
+
+.header {
+  background-color: var(--blu-color-header);
+}
+
+[data-bs-theme="dark"] .header {
+  background-color: var(--bs-black);
+}
+
+[data-bs-theme="dark"] .header .main-navbar {
+  background-color: var(--bs-dark-bg-subtle);
+}
+
+[data-bs-theme="dark"] .card {
+  background-color: var(--bs-dark-bg-subtle);
+}
+
+body:not([data-bs-theme="dark"]) .header .main-navbar {
+  background-color: var(--bs-light);
+}