@okjavis/nodebb-theme-javis 1.0.1 → 1.3.0

package/less/_buttons.less

@@ -1,90 +0,0 @@
-// ===========================================================
-// BUTTON SYSTEM – JAVIS Design System
-// ===========================================================
-
-// Base Button Reset
-.btn {
-  border-radius: @jv-radius-pill;
-  padding: 6px 16px;
-  font-size: 14px;
-  font-weight: 500;
-  line-height: 1.32;
-  transition: all 0.15s ease;
-  border-width: 1px;
-  cursor: pointer;
-}
-
-// PRIMARY BUTTON
-.btn-primary {
-  background-color: @jv-primary;
-  border-color: @jv-primary;
-  color: #fff;
-  box-shadow: @jv-shadow-button;
-
-  &:hover,
-  &:focus {
-    background-color: @jv-primary-hover;
-    border-color: @jv-primary-hover;
-    box-shadow: @jv-shadow-button-hover;
-    transform: translateY(-1px);
-    color: #fff;
-  }
-
-  &:active {
-    transform: translateY(0);
-  }
-}
-
-// OUTLINE PRIMARY
-.btn-outline-primary {
-  background-color: transparent;
-  border-color: @jv-primary;
-  color: @jv-primary;
-
-  &:hover,
-  &:focus {
-    background-color: @jv-primary-soft;
-    border-color: @jv-primary;
-    color: @jv-primary;
-  }
-}
-
-// SECONDARY BUTTON
-.btn-secondary,
-.btn-default {
-  background-color: #f7f8fa;
-  border-color: @jv-border-subtle;
-  color: @jv-text-main;
-
-  &:hover,
-  &:focus {
-    background-color: #eef0f3;
-    border-color: @jv-border-subtle;
-    color: @jv-text-main;
-  }
-}
-
-// LINK-STYLE BUTTON
-.btn-link {
-  color: @jv-primary;
-  font-weight: 500;
-  padding: 0;
-
-  &:hover {
-    text-decoration: underline;
-    color: @jv-primary-hover;
-  }
-}
-
-// SMALL BUTTONS
-.btn-sm {
-  padding: 4px 12px;
-  font-size: @jv-font-size-sm;
-}
-
-// LARGE BUTTONS
-.btn-lg {
-  padding: 10px 22px;
-  font-size: @jv-font-size-base;
-  border-radius: @jv-radius-pill;
-}

package/less/_cards.less

@@ -1,118 +0,0 @@
-// ===========================================================
-// CARD COMPONENT – Feed Posts
-// Inspired by Circle.so's spacing and Apple's depth
-// ===========================================================
-
-// CARD WRAPPER
-li[component="post"].posts-list-item {
-  background: @jv-surface;
-  border-radius: @jv-radius-lg;
-  border: 1px solid rgba(0,0,0,0.05);
-  box-shadow: @jv-shadow-card;
-  padding: 24px 22px 20px 22px;
-  margin-bottom: 24px;
-  transition: box-shadow 0.15s ease, border-color 0.15s ease;
-
-  &:hover {
-    box-shadow: 0 6px 14px rgba(0,0,0,0.08);
-    border-color: rgba(0,0,0,0.08);
-  }
-}
-
-// IMAGE BLOCK
-li[component="post"] {
-  .overflow-hidden,
-  img.w-100 {
-    border-radius: @jv-radius-lg;
-  }
-}
-
-// CARD BODY LAYOUT
-li[component="post"] .post-body {
-  display: flex;
-  flex-direction: column;
-  gap: @jv-space-6;
-  padding-top: @jv-space-2;
-}
-
-// TITLE
-li[component="post"] .topic-title {
-  display: block;
-  margin-bottom: 6px;
-  font-size: @jv-font-size-lg;
-  font-weight: 600;
-  letter-spacing: -0.01em;
-  line-height: @jv-line-height-tight;
-  color: @jv-text-main;
-
-  a {
-    color: inherit;
-    text-decoration: none;
-
-    &:hover {
-      color: @jv-primary;
-    }
-  }
-}
-
-// META (author + time)
-li[component="post"] .d-flex.gap-2 {
-  margin-bottom: 10px;
-}
-
-li[component="post"] {
-  .timeago,
-  .post-meta a,
-  .topic-meta {
-    font-size: @jv-font-size-sm;
-    color: @jv-text-muted;
-  }
-}
-
-// CONTENT
-li[component="post"] .content p {
-  font-size: @jv-font-size-base;
-  line-height: @jv-line-height-base;
-  margin-bottom: 18px;
-  color: @jv-text-main;
-}
-
-// DIVIDER
-li[component="post"] hr {
-  margin: 16px 0;
-  border-color: @jv-border-subtle;
-}
-
-// ===========================================================
-// ACTION ROW (quiet, modern, premium)
-// ===========================================================
-
-li[component="post"] .d-flex.justify-content-between {
-  margin-top: 6px;
-  padding-bottom: 2px;
-}
-
-li[component="post"] .d-flex.gap-3 a {
-  background: transparent;
-  border: none;
-  padding: 0;
-  font-size: @jv-font-size-sm;
-  color: @jv-text-muted;
-  opacity: 0.85;
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  box-shadow: none;
-  text-decoration: none;
-  transition: color 0.15s ease, opacity 0.15s ease;
-
-  &:hover {
-    color: @jv-primary;
-    opacity: 1;
-  }
-
-  i {
-    font-size: 15px;
-    color: inherit;
-  }
-}

package/less/_forms.less

@@ -1,104 +0,0 @@
-// ===========================================================
-// INPUT SYSTEM – Global Form Controls
-// ===========================================================
-
-.form-control,
-input[type="text"],
-input[type="search"],
-input[type="email"],
-input[type="password"],
-textarea,
-.form-select {
-  background: @jv-surface;
-  border: 1px solid @jv-border-subtle;
-  border-radius: @jv-radius-pill;
-  padding: 10px 16px;
-  font-size: @jv-font-size-base;
-  color: @jv-text-main;
-  line-height: @jv-line-height-tight;
-  box-shadow: none;
-  transition: all 0.15s ease;
-
-  &::placeholder {
-    color: @jv-text-muted;
-  }
-
-  &:focus {
-    outline: none;
-    border-color: @jv-primary;
-    box-shadow: 0 0 0 3px @jv-primary-soft;
-  }
-}
-
-// Textarea specific
-textarea {
-  border-radius: @jv-radius-md;
-  resize: vertical;
-  min-height: 100px;
-}
-
-// ===========================================================
-// SEARCH BAR
-// ===========================================================
-
-.search-widget .input-group {
-  .form-control {
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-
-  .btn-primary {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-    padding: 0 18px;
-  }
-}
-
-// ===========================================================
-// COMPOSER TRIGGER (Write a Post…)
-// ===========================================================
-
-.jlc-trigger {
-  width: 100%;
-  background: @jv-surface;
-  border: 1px solid @jv-border-subtle;
-  border-radius: @jv-radius-pill;
-  padding: 12px 18px;
-  font-size: @jv-font-size-base;
-  font-weight: 400;
-  text-align: left;
-  color: @jv-text-muted;
-  box-shadow: @jv-shadow-soft;
-  transition: all 0.15s ease;
-
-  &:hover,
-  &:focus {
-    background: @jv-surface;
-    border-color: @jv-primary;
-    color: @jv-primary;
-    box-shadow: @jv-shadow-soft;
-    outline: none;
-  }
-
-  &:active {
-    transform: scale(0.99);
-  }
-
-  // Override Bootstrap button states
-  &.btn,
-  &.btn:focus,
-  &.btn:hover,
-  &.btn:active {
-    background: @jv-surface;
-    border-radius: @jv-radius-pill;
-    box-shadow: @jv-shadow-soft;
-    border-color: @jv-border-subtle;
-    outline: none;
-  }
-
-  &.btn:hover,
-  &.btn:focus {
-    border-color: @jv-primary;
-    color: @jv-primary;
-  }
-}

package/less/_sidebar.less

@@ -1,110 +0,0 @@
-// ===========================================================
-// SIDEBAR SYSTEM – Trending Tags + Trending Now
-// ===========================================================
-
-// Sidebar Widget Titles
-div[data-widget-area="right"] {
-  h5, h8 {
-    font-size: 16px;
-    font-weight: 600;
-    margin-bottom: @jv-space-4;
-    color: @jv-text-main;
-  }
-}
-
-// ===========================================================
-// TRENDING TAGS
-// ===========================================================
-
-.popular-tags {
-  gap: 6px;
-
-  .tag-list > div {
-    background: @jv-surface;
-    border: 1px solid @jv-border-subtle;
-    border-radius: 10px;
-    padding: 10px 12px;
-    font-size: 14px;
-    color: @jv-text-main;
-    display: flex;
-    flex-direction: column;
-    gap: 2px;
-    cursor: pointer;
-    transition: border-color 0.15s ease, background 0.15s ease;
-
-    &:hover {
-      border-color: rgba(0,0,0,0.12);
-      background: rgba(0,0,0,0.03);
-    }
-
-    small {
-      color: @jv-text-muted;
-      font-size: @jv-font-size-xs;
-    }
-  }
-}
-
-// ===========================================================
-// TRENDING NOW
-// ===========================================================
-
-#recent_posts {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  margin-top: @jv-space-6;
-
-  li.widget-posts {
-    background: @jv-surface;
-    border: 1px solid rgba(0,0,0,0.05);
-    border-radius: @jv-radius-md;
-    padding: 10px 14px;
-    display: flex;
-    flex-direction: column;
-    gap: @jv-space-4;
-    transition: box-shadow 0.15s ease, border 0.15s ease;
-
-    &:hover {
-      border-color: rgba(0,0,0,0.08);
-      box-shadow: @jv-shadow-soft;
-    }
-
-    // Meta info
-    .d-flex.gap-2,
-    .timeago {
-      font-size: @jv-font-size-xs;
-      color: @jv-text-muted;
-    }
-
-    // Title inside mini post
-    a {
-      font-size: 14px;
-      font-weight: 500;
-      color: @jv-text-main;
-      text-decoration: none;
-      line-height: @jv-line-height-tight;
-
-      &:hover {
-        color: @jv-primary;
-      }
-    }
-
-    // 2-line clamp for content preview
-    p,
-    .content {
-      display: -webkit-box;
-      -webkit-line-clamp: 2;
-      -webkit-box-orient: vertical;
-      overflow: hidden;
-      font-size: @jv-font-size-sm;
-      color: @jv-text-muted;
-      margin: 0;
-    }
-
-    // Read more alignment
-    a.stretched-link {
-      font-size: @jv-font-size-xs;
-      color: @jv-primary;
-    }
-  }
-}

package/less/_variables.less

@@ -1,54 +0,0 @@
-// ============================================
-// JAVIS Design System – Tokens
-// ============================================
-
-// Brand Colors
-@jv-primary: #0051ff;
-@jv-primary-hover: #0044dd;
-@jv-primary-soft: rgba(0, 81, 255, 0.12);
-
-// Neutrals
-@jv-bg: #f5f6f8;              // app background
-@jv-surface: #ffffff;         // cards, panels
-@jv-border-subtle: rgba(0,0,0,0.06);
-@jv-border-strong: rgba(0,0,0,0.12);
-
-// Text
-@jv-text-main: #111111;
-@jv-text-muted: #6b7280;
-@jv-text-soft: #9ca3af;
-
-// Radii
-@jv-radius-xs: 4px;
-@jv-radius-sm: 8px;
-@jv-radius-md: 12px;
-@jv-radius-lg: 16px;
-@jv-radius-pill: 999px;
-
-// Shadows
-@jv-shadow-soft: 0 2px 8px rgba(0,0,0,0.04);
-@jv-shadow-card: 0 4px 10px rgba(0,0,0,0.05);
-@jv-shadow-button: 0 4px 12px rgba(0, 81, 255, 0.25);
-@jv-shadow-button-hover: 0 6px 16px rgba(0, 81, 255, 0.35);
-
-// Spacing (8pt-ish scale)
-@jv-space-2: 4px;
-@jv-space-4: 8px;
-@jv-space-6: 12px;
-@jv-space-8: 16px;
-@jv-space-10: 20px;
-@jv-space-12: 24px;
-
-// Typography
-@jv-font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Helvetica Neue", Arial, sans-serif;
-@jv-font-size-base: 15px;
-@jv-font-size-sm: 13px;
-@jv-font-size-xs: 12px;
-@jv-font-size-lg: 18px;
-@jv-font-size-xl: 22px;
-@jv-font-size-xxl: 32px;
-
-// Line Heights
-@jv-line-height-base: 1.52;
-@jv-line-height-tight: 1.4;
-@jv-line-height-relaxed: 1.6;

package/less/theme.less

@@ -1,18 +0,0 @@
-// ============================================
-// JAVIS Community Theme
-// Modern, premium NodeBB theme
-// Inspired by Apple, Stripe, and Linear
-// ============================================
-
-// Core Design System
-@import "_variables";
-
-// Base Styles
-@import "_base";
-
-// Components
-@import "_buttons";
-@import "_forms";
-@import "_cards";
-@import "_sidebar";
-@import "_categories";