@commonpub/layer 0.28.0 → 0.28.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -176,9 +176,9 @@ function confirmWithdraw(entryId: string): void {
176
176
  .cpub-entry-score { font-size: 10px; color: var(--text-faint); font-family: var(--font-mono); display: flex; align-items: center; gap: 3px; }
177
177
 
178
178
  .cpub-entry-vote-btn {
179
- display: inline-flex; align-items: center; gap: 4px;
179
+ display: inline-flex; align-items: center; justify-content: center; gap: 4px;
180
180
  font-size: 11px; font-family: var(--font-mono); font-weight: 600;
181
- padding: 3px 8px; border: var(--border-width-default) solid var(--border2);
181
+ padding: 4px 10px; min-height: 28px; border: var(--border-width-default) solid var(--border2);
182
182
  background: var(--surface); color: var(--text-dim); cursor: pointer;
183
183
  transition: all 0.15s;
184
184
  }
@@ -187,7 +187,7 @@ function confirmWithdraw(entryId: string): void {
187
187
  .cpub-entry-vote-btn:disabled { opacity: 0.4; cursor: default; }
188
188
  .cpub-entry-vote-btn i { font-size: 10px; }
189
189
 
190
- .cpub-withdraw-btn { display: flex; align-items: center; gap: 4px; font-size: 10px; font-family: var(--font-mono); padding: 3px 8px; border-radius: var(--radius); border: var(--border-width-default) solid var(--red-border); background: var(--surface); color: var(--red); cursor: pointer; margin-left: auto; }
190
+ .cpub-withdraw-btn { display: flex; align-items: center; justify-content: center; gap: 4px; font-size: 10px; font-family: var(--font-mono); padding: 4px 10px; min-height: 28px; border-radius: var(--radius); border: var(--border-width-default) solid var(--red-border); background: var(--surface); color: var(--red); cursor: pointer; margin-left: auto; }
191
191
  .cpub-withdraw-btn:hover { background: var(--red-bg); }
192
192
 
193
193
  .cpub-empty-state { text-align: center; padding: 32px 0; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@commonpub/layer",
3
- "version": "0.28.0",
3
+ "version": "0.28.1",
4
4
  "type": "module",
5
5
  "main": "./nuxt.config.ts",
6
6
  "files": [
@@ -53,16 +53,16 @@
53
53
  "vue": "^3.4.0",
54
54
  "vue-router": "^4.3.0",
55
55
  "zod": "^4.3.6",
56
- "@commonpub/auth": "0.6.0",
57
56
  "@commonpub/config": "0.15.0",
58
57
  "@commonpub/docs": "0.6.3",
59
58
  "@commonpub/explainer": "0.7.15",
59
+ "@commonpub/protocol": "0.12.0",
60
60
  "@commonpub/learning": "0.5.2",
61
61
  "@commonpub/schema": "0.21.0",
62
- "@commonpub/editor": "0.7.11",
63
62
  "@commonpub/ui": "0.9.1",
64
- "@commonpub/protocol": "0.12.0",
65
- "@commonpub/server": "2.62.0"
63
+ "@commonpub/editor": "0.7.11",
64
+ "@commonpub/server": "2.62.0",
65
+ "@commonpub/auth": "0.6.0"
66
66
  },
67
67
  "devDependencies": {
68
68
  "@testing-library/jest-dom": "^6.9.1",
@@ -92,6 +92,8 @@ async function acceptInvite(): Promise<void> {
92
92
 
93
93
  // Entry submission
94
94
  const showSubmitDialog = ref(false);
95
+ const submitDialogRef = ref<HTMLElement | null>(null);
96
+ useFocusTrap(submitDialogRef, () => showSubmitDialog.value, () => { showSubmitDialog.value = false; });
95
97
  const submitContentId = ref('');
96
98
  const submitting = ref(false);
97
99
  const { data: userContent } = useFetch('/api/content', {
@@ -156,7 +158,7 @@ async function withdrawEntry(entryId: string): Promise<void> {
156
158
 
157
159
  <!-- SUBMIT ENTRY DIALOG -->
158
160
  <div v-if="showSubmitDialog" class="cpub-submit-overlay" @click.self="showSubmitDialog = false">
159
- <div class="cpub-submit-dialog" role="dialog" aria-label="Submit entry">
161
+ <div ref="submitDialogRef" class="cpub-submit-dialog" role="dialog" aria-modal="true" aria-label="Submit entry">
160
162
  <div class="cpub-submit-header">
161
163
  <h2>Submit Entry</h2>
162
164
  <button class="cpub-submit-close" aria-label="Close" @click="showSubmitDialog = false"><i class="fa-solid fa-times"></i></button>
@@ -296,8 +298,9 @@ async function withdrawEntry(entryId: string): Promise<void> {
296
298
  .cpub-invite-text i { color: var(--accent); }
297
299
 
298
300
  /* TABS */
299
- .cpub-tabbar { display: flex; gap: 2px; flex-wrap: wrap; border-bottom: var(--border-width-default) solid var(--border); margin-bottom: 20px; }
300
- .cpub-tab { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--text-faint); cursor: pointer; }
301
+ .cpub-tabbar { display: flex; gap: 2px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; border-bottom: var(--border-width-default) solid var(--border); margin-bottom: 20px; }
302
+ .cpub-tabbar::-webkit-scrollbar { display: none; }
303
+ .cpub-tab { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; min-height: 40px; flex-shrink: 0; white-space: nowrap; background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--text-faint); cursor: pointer; }
301
304
  .cpub-tab:hover { color: var(--text-dim); }
302
305
  .cpub-tab-active { color: var(--accent); border-bottom-color: var(--accent); }
303
306
  .cpub-tab i { font-size: 11px; }
@@ -121,6 +121,7 @@ function medalColor(rank: number): string {
121
121
  <!-- LEADERBOARD -->
122
122
  <div v-if="leaderboard.length > 0" class="cpub-leaderboard">
123
123
  <h2 class="cpub-leaderboard-title">Full Leaderboard</h2>
124
+ <div class="cpub-leaderboard-scroll">
124
125
  <table class="cpub-leaderboard-table">
125
126
  <thead>
126
127
  <tr>
@@ -150,6 +151,7 @@ function medalColor(rank: number): string {
150
151
  </tr>
151
152
  </tbody>
152
153
  </table>
154
+ </div>
153
155
  </div>
154
156
 
155
157
  <div v-else class="cpub-results-empty">
@@ -190,7 +192,9 @@ function medalColor(rank: number): string {
190
192
  /* LEADERBOARD */
191
193
  .cpub-leaderboard { margin-bottom: 32px; }
192
194
  .cpub-leaderboard-title { font-size: 16px; font-weight: 700; margin-bottom: 14px; }
193
- .cpub-leaderboard-table { width: 100%; border-collapse: collapse; font-size: 12px; }
195
+ /* Horizontal scroll on narrow screens instead of overflowing the page. */
196
+ .cpub-leaderboard-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
197
+ .cpub-leaderboard-table { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 420px; }
194
198
  .cpub-leaderboard-table th { text-align: left; font-size: 10px; font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .06em; color: var(--text-faint); padding: 8px 12px; border-bottom: var(--border-width-default) solid var(--border); }
195
199
  .cpub-leaderboard-table td { padding: 10px 12px; border-bottom: var(--border-width-default) solid var(--border); }
196
200
  .cpub-lb-top3 { background: var(--surface2); }