@iamem/amem 0.1.2 → 0.2.0

package/ui-static/index.html

@@ -37,6 +37,14 @@
             <span class="nav-ico" aria-hidden="true"></span>
             Analytics
           </button>
+          <button type="button" data-tab="tasks">
+            <span class="nav-ico" aria-hidden="true"></span>
+            Tasks
+          </button>
+          <button type="button" data-tab="skills">
+            <span class="nav-ico" aria-hidden="true"></span>
+            Skills
+          </button>
         </nav>
         <div class="side-footer">
           <button class="side-foot-btn" id="personalBtn" type="button">Personal</button>
@@ -105,18 +113,6 @@
               />
               <button class="btn secondary" id="vaultRestoreBtn" type="button">Restore</button>
             </div>
-            <div class="add-repo-row" id="shopRow">
-              <a class="btn" id="buyPro" href="https://getamem.com/buy/pro" target="_blank" rel="noopener"
-                >Buy Pro · $12</a
-              >
-              <a class="btn secondary" id="buyIt" href="https://getamem.com/buy/it" target="_blank" rel="noopener"
-                >Buy IT · $49</a
-              >
-              <span class="note"
-                >After pay, download <code>amem-license.json</code> on the thank-you page, then apply it in Plans/Setup or
-                <code>amem license apply --file</code>.</span
-              >
-            </div>
             <p class="note" id="vaultDetail"></p>
           </div>
         </div>
@@ -140,30 +136,11 @@
     </div>
     <script>
       (function () {
-        var TABS = ["welcome", "setup", "dashboard", "brain", "analytics"];
+        var TABS = ["setup", "dashboard", "brain", "analytics", "tasks"];
         var params = new URLSearchParams(location.search);
         var fromUrl = params.get("tab");
-        var welcomeDismissed = false;
-        var paid = false;
-        try {
-          welcomeDismissed = localStorage.getItem("amem.welcome.dismissed") === "1";
-          var tier = localStorage.getItem("amem.license.tier");
-          paid = tier === "pro" || tier === "it";
-        } catch (e) {}
-        var tab = "setup";
-        if (paid) {
-          if (fromUrl === "stats") tab = "analytics";
-          else if (TABS.indexOf(fromUrl) !== -1) tab = fromUrl;
-          else tab = "dashboard";
-        } else if (
-          !welcomeDismissed &&
-          fromUrl !== "brain" &&
-          fromUrl !== "stats" &&
-          fromUrl !== "analytics" &&
-          fromUrl !== "dashboard"
-        ) {
-          tab = "welcome";
-        } else if (fromUrl === "stats") {
+        var tab = "dashboard";
+        if (fromUrl === "stats") {
           tab = "analytics";
         } else if (TABS.indexOf(fromUrl) !== -1) {
           tab = fromUrl;

package/ui-static/styles.css

@@ -1126,7 +1126,9 @@ a.btn {
 .orbit-host {
   position: relative;
   min-height: 320px;
-  height: 100%;
+  /* No height here: .viz-host's clamp() bounds the canvas. A height:100% (or a
+     fr unit) resolves against the fact list, which can be thousands of rows,
+     and starves the list's grid track down to 0. */
   border-bottom: 1px solid var(--line);
   background:
     radial-gradient(ellipse at 50% 40%, rgba(46, 196, 182, 0.1), transparent 55%),
@@ -1171,6 +1173,13 @@ a.btn {
   background: var(--bg2);
 }
 
+.brain-v2 {
+  flex: 1;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+}
+
 .brain-body {
   display: flex;
   flex-direction: column;
@@ -1857,6 +1866,305 @@ button.linkish:hover code {
   .dash-grid {
     grid-template-columns: 1fr;
   }
+  .tasks-board {
+    grid-template-columns: 1fr;
+  }
+}
+
+.tasks-add {
+  display: grid;
+  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
+  gap: 0.55rem;
+  margin: 0 0 1.1rem;
+}
+.tasks-add input {
+  background: rgba(20, 27, 33, 0.9);
+  color: var(--ink);
+  border: 1px solid var(--line);
+  border-radius: 10px;
+  padding: 0.6rem 0.75rem;
+  font: inherit;
+}
+.tasks-board {
+  display: grid;
+  grid-template-columns: repeat(5, minmax(9.5rem, 1fr));
+  gap: 0.65rem;
+  align-items: start;
+}
+.tasks-col {
+  border: 1px solid var(--line);
+  border-radius: 14px;
+  background: rgba(20, 27, 33, 0.55);
+  min-height: 12rem;
+  transition: border-color 0.15s ease, background 0.15s ease;
+}
+.tasks-col.drag-over {
+  border-color: rgba(46, 196, 182, 0.55);
+  background: rgba(46, 196, 182, 0.08);
+}
+.tasks-col > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  padding: 0.65rem 0.75rem 0.35rem;
+}
+.tasks-col > header h2 {
+  margin: 0;
+  font-size: 0.82rem;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  color: var(--muted);
+  font-weight: 600;
+}
+.tasks-col > header span {
+  color: var(--muted);
+  font-size: 0.78rem;
+  font-variant-numeric: tabular-nums;
+}
+.tasks-col-body {
+  padding: 0.35rem 0.55rem 0.7rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.45rem;
+  min-height: 4rem;
+}
+.tasks-empty {
+  margin: 0.35rem 0.2rem;
+  color: var(--muted);
+  font-size: 0.8rem;
+}
+.tasks-card {
+  border: 1px solid var(--line);
+  border-radius: 12px;
+  background: rgba(11, 15, 18, 0.75);
+  padding: 0.65rem 0.7rem 0.55rem;
+  cursor: grab;
+}
+.tasks-card.dragging {
+  opacity: 0.55;
+}
+.tasks-card h3 {
+  margin: 0;
+  font-size: 0.92rem;
+  font-weight: 600;
+  letter-spacing: -0.01em;
+  line-height: 1.3;
+}
+/* Skills — procedural memory library */
+.skill-grid {
+  display: grid;
+  gap: 0.75rem;
+  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+  margin-top: 1rem;
+}
+
+.skill-card {
+  background: var(--card);
+  border: 1px solid var(--line);
+  border-radius: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 0.4rem;
+  padding: 0.85rem;
+}
+
+.skill-card-head {
+  align-items: baseline;
+  display: flex;
+  gap: 0.5rem;
+  justify-content: space-between;
+}
+
+.skill-card-head h3 {
+  font-size: 0.95rem;
+  margin: 0;
+  word-break: break-word;
+}
+
+.skill-uses {
+  color: var(--muted);
+  flex: none;
+  font-size: 0.7rem;
+}
+
+.skill-card-desc {
+  color: var(--muted);
+  font-size: 0.82rem;
+  line-height: 1.4;
+  margin: 0;
+}
+
+.skill-card-desc.muted {
+  font-style: italic;
+  opacity: 0.75;
+}
+
+.skill-card-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.25rem;
+}
+
+.skill-tag {
+  border: 1px solid var(--line);
+  border-radius: 999px;
+  color: var(--muted);
+  font-size: 0.68rem;
+  padding: 0.05rem 0.4rem;
+}
+
+.skill-card-actions {
+  display: flex;
+  gap: 0.4rem;
+  margin-top: auto;
+  padding-top: 0.35rem;
+}
+
+.skill-empty {
+  background: var(--card);
+  border: 1px dashed var(--line);
+  border-radius: 12px;
+  margin-top: 1rem;
+  padding: 1.5rem;
+}
+
+.skill-empty h2 {
+  font-size: 1.05rem;
+  margin: 0 0 0.4rem;
+}
+
+.skill-drafts {
+  margin-top: 1.25rem;
+}
+
+.skill-drafts h2 {
+  font-size: 1rem;
+  margin: 0 0 0.2rem;
+}
+
+.skill-draft-list {
+  display: grid;
+  gap: 0.6rem;
+  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+  margin-top: 0.6rem;
+}
+
+.skill-draft {
+  background: var(--card);
+  border: 1px solid var(--accent, var(--line));
+  border-radius: 12px;
+  padding: 0.8rem;
+}
+
+.skill-draft-kind {
+  color: var(--muted);
+  font-size: 0.68rem;
+  font-weight: 600;
+  letter-spacing: 0.03em;
+  text-transform: uppercase;
+}
+
+.skill-draft h4 {
+  font-size: 0.9rem;
+  margin: 0.25rem 0 0.35rem;
+}
+
+.skill-draft-why,
+.skill-draft-hint {
+  color: var(--muted);
+  font-size: 0.76rem;
+  line-height: 1.4;
+  margin: 0 0 0.35rem;
+}
+
+.skill-draft-actions {
+  display: flex;
+  gap: 0.4rem;
+}
+
+.skill-detail {
+  background: var(--card);
+  border: 1px solid var(--line);
+  border-radius: 12px;
+  margin-top: 1rem;
+  padding: 0.9rem;
+}
+
+.skill-detail-head {
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 0.5rem;
+}
+
+.skill-detail-head h2 {
+  font-size: 1rem;
+  margin: 0;
+}
+
+.skill-detail-body {
+  background: var(--bg);
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  font-size: 0.78rem;
+  line-height: 1.5;
+  max-height: 60vh;
+  overflow: auto;
+  padding: 0.75rem;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.tasks-card-repo {
+  display: inline-block;
+  margin-bottom: 0.3rem;
+  padding: 0.08rem 0.4rem;
+  border: 1px solid var(--line);
+  border-radius: 999px;
+  color: var(--muted);
+  font-size: 0.68rem;
+  font-weight: 600;
+  letter-spacing: 0.01em;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.tasks-card-body {
+  margin: 0.35rem 0 0;
+  color: var(--muted);
+  font-size: 0.78rem;
+  line-height: 1.35;
+}
+.tasks-card-actions {
+  display: flex;
+  align-items: center;
+  gap: 0.35rem;
+  margin-top: 0.55rem;
+}
+.tasks-status {
+  flex: 1;
+  min-width: 0;
+  background: rgba(20, 27, 33, 0.95);
+  color: var(--ink);
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  padding: 0.28rem 0.4rem;
+  font: inherit;
+  font-size: 0.75rem;
+}
+.tasks-del {
+  padding: 0.25rem 0.45rem !important;
+}
+
+@media (max-width: 1100px) {
+  .tasks-board {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+  .tasks-add {
+    grid-template-columns: 1fr;
+  }
 }
 
 .platform-card.accented {
@@ -2049,6 +2357,7 @@ button.linkish:hover code {
     display: none;
   }
   .brain-v2 {
+    flex: 0 0 auto;
     height: auto;
     min-height: 0;
   }