Design token updates.
This commit is contained in:
parent
de3bcc479a
commit
c6b970a621
13 changed files with 198 additions and 211 deletions
|
|
@ -240,7 +240,7 @@ useHead({
|
|||
|
||||
<style scoped>
|
||||
.loading-state {
|
||||
padding: 60px 24px;
|
||||
padding: 48px 24px;
|
||||
text-align: center;
|
||||
color: var(--text-faint);
|
||||
font-size: 12px;
|
||||
|
|
@ -256,7 +256,7 @@ useHead({
|
|||
}
|
||||
|
||||
.filter-select {
|
||||
font-family: "Commit Mono", monospace;
|
||||
font-family: inherit;
|
||||
font-size: 11px;
|
||||
padding: 5px 10px;
|
||||
border: 1px dashed var(--border);
|
||||
|
|
@ -266,13 +266,14 @@ useHead({
|
|||
outline: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%238a7e6a' stroke-width='1.2'/%3E%3C/svg%3E");
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23b8a880' stroke-width='1.2'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 8px center;
|
||||
padding-right: 26px;
|
||||
}
|
||||
.filter-select:focus {
|
||||
border-color: var(--candle-faint);
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.connections-section {
|
||||
|
|
@ -329,7 +330,6 @@ useHead({
|
|||
|
||||
.cc-name {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--text-bright);
|
||||
}
|
||||
.cc-name a {
|
||||
|
|
@ -380,7 +380,6 @@ useHead({
|
|||
|
||||
.match-tag {
|
||||
color: var(--text);
|
||||
font-weight: 600;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
|
|
@ -414,11 +413,11 @@ useHead({
|
|||
.cc-slack {
|
||||
font-size: 11px;
|
||||
color: var(--candle-dim);
|
||||
font-family: "Commit Mono", monospace;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.text-action {
|
||||
font-family: "Commit Mono", monospace;
|
||||
font-family: inherit;
|
||||
font-size: 11px;
|
||||
color: var(--text-faint);
|
||||
background: none;
|
||||
|
|
@ -440,8 +439,8 @@ useHead({
|
|||
text-align: center;
|
||||
}
|
||||
.empty-title {
|
||||
font-family: "Brygada 1918", serif;
|
||||
font-size: 18px;
|
||||
font-family: var(--font-display);
|
||||
font-size: 16px;
|
||||
color: var(--text-dim);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
|
@ -463,13 +462,13 @@ useHead({
|
|||
.filter-bar {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
padding: 14px 20px;
|
||||
padding: 12px 20px;
|
||||
}
|
||||
.connections-section {
|
||||
padding: 16px 20px;
|
||||
}
|
||||
.connection-card {
|
||||
padding: 14px 16px;
|
||||
padding: 12px 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@
|
|||
:to="`/series/${series._id}`"
|
||||
class="series-box"
|
||||
>
|
||||
<h3>{{ series.title }}</h3>
|
||||
<h2>{{ series.title }}</h2>
|
||||
<p class="series-desc">{{ series.description }}</p>
|
||||
<div class="series-meta">
|
||||
<span
|
||||
|
|
@ -108,7 +108,7 @@
|
|||
<div class="full-section">
|
||||
<div class="section-label">Have an idea?</div>
|
||||
<DashedBox>
|
||||
<h3>Propose an Event</h3>
|
||||
<h2>Propose an Event</h2>
|
||||
<p>
|
||||
Members can propose events for any circle. Workshops, social hangs,
|
||||
talks, or anything else that serves the community.
|
||||
|
|
@ -187,11 +187,11 @@ const isAlmostFull = (event) => {
|
|||
|
||||
<style scoped>
|
||||
.hero {
|
||||
padding: 32px 32px 24px;
|
||||
padding: 32px 28px 24px;
|
||||
border-bottom: 1px dashed var(--border);
|
||||
}
|
||||
.hero h1 {
|
||||
font-family: "Brygada 1918", serif;
|
||||
font-family: var(--font-display);
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
color: var(--text-bright);
|
||||
|
|
@ -207,7 +207,7 @@ const isAlmostFull = (event) => {
|
|||
|
||||
/* ---- EVENT LIST ---- */
|
||||
.event-list-full {
|
||||
padding: 0 32px;
|
||||
padding: 0 28px;
|
||||
border-bottom: 1px dashed var(--border);
|
||||
}
|
||||
|
||||
|
|
@ -272,7 +272,7 @@ const isAlmostFull = (event) => {
|
|||
}
|
||||
|
||||
.cancelled-tag {
|
||||
font-size: 9px;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.07em;
|
||||
text-transform: uppercase;
|
||||
color: var(--ember);
|
||||
|
|
@ -326,7 +326,7 @@ const isAlmostFull = (event) => {
|
|||
gap: 4px;
|
||||
}
|
||||
.members-badge {
|
||||
font-size: 9px;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.07em;
|
||||
text-transform: uppercase;
|
||||
color: var(--text-faint);
|
||||
|
|
@ -338,7 +338,7 @@ const isAlmostFull = (event) => {
|
|||
|
||||
/* ---- FULL SECTION ---- */
|
||||
.full-section {
|
||||
padding: 32px;
|
||||
padding: 32px 28px;
|
||||
border-bottom: 1px dashed var(--border);
|
||||
}
|
||||
|
||||
|
|
@ -350,7 +350,7 @@ const isAlmostFull = (event) => {
|
|||
border: 1px dashed var(--border);
|
||||
}
|
||||
.series-box {
|
||||
padding: 20px;
|
||||
padding: 20px 24px;
|
||||
border-right: 1px dashed var(--border);
|
||||
text-decoration: none;
|
||||
transition: background 0.15s;
|
||||
|
|
@ -361,8 +361,8 @@ const isAlmostFull = (event) => {
|
|||
.series-box:hover {
|
||||
background: var(--surface-hover);
|
||||
}
|
||||
.series-box h3 {
|
||||
font-family: "Brygada 1918", serif;
|
||||
.series-box h2 {
|
||||
font-family: var(--font-display);
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: var(--text-bright);
|
||||
|
|
@ -383,8 +383,8 @@ const isAlmostFull = (event) => {
|
|||
}
|
||||
|
||||
/* ---- PROPOSE ---- */
|
||||
.full-section h3 {
|
||||
font-family: "Brygada 1918", serif;
|
||||
.full-section h2 {
|
||||
font-family: var(--font-display);
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: var(--text-bright);
|
||||
|
|
@ -431,6 +431,12 @@ const isAlmostFull = (event) => {
|
|||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.hero,
|
||||
.event-list-full,
|
||||
.full-section {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.event-row {
|
||||
grid-template-columns: 70px 1fr;
|
||||
gap: 8px;
|
||||
|
|
|
|||
|
|
@ -860,7 +860,7 @@ onUnmounted(() => {
|
|||
.form-submit {
|
||||
display: inline-block;
|
||||
background: var(--parch);
|
||||
color: var(--candle-faint);
|
||||
color: var(--parch-accent);
|
||||
font-family: 'Commit Mono', monospace;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
|
|
@ -875,7 +875,7 @@ onUnmounted(() => {
|
|||
.form-submit:hover {
|
||||
background: var(--parch-hover);
|
||||
border-color: var(--parch-hover);
|
||||
color: var(--candle-dim);
|
||||
color: var(--parch-text);
|
||||
text-decoration: none;
|
||||
}
|
||||
.form-submit:disabled {
|
||||
|
|
|
|||
|
|
@ -89,6 +89,7 @@
|
|||
<div class="ci-header">
|
||||
<strong>How to Subscribe to Your Calendar</strong>
|
||||
<button
|
||||
type="button"
|
||||
@click="showCalendarInstructions = false"
|
||||
class="ci-close"
|
||||
>
|
||||
|
|
@ -435,7 +436,7 @@ useHead({
|
|||
}
|
||||
|
||||
.unauth-state h2 {
|
||||
font-family: "Brygada 1918", serif;
|
||||
font-family: var(--font-display);
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: var(--text-bright);
|
||||
|
|
@ -519,7 +520,7 @@ useHead({
|
|||
|
||||
/* ---- CALENDAR BUTTON ---- */
|
||||
.calendar-btn {
|
||||
font-family: "Commit Mono", monospace;
|
||||
font-family: inherit;
|
||||
font-size: 11px;
|
||||
color: var(--candle-dim);
|
||||
background: none;
|
||||
|
|
@ -603,7 +604,7 @@ useHead({
|
|||
/* ---- QUICK ACTIONS ---- */
|
||||
.quick-action {
|
||||
border: 1px dashed var(--border);
|
||||
padding: 14px 20px;
|
||||
padding: 12px 20px;
|
||||
margin-bottom: 8px;
|
||||
transition: border-color 0.2s;
|
||||
display: flex;
|
||||
|
|
@ -697,7 +698,7 @@ useHead({
|
|||
}
|
||||
|
||||
.content-block {
|
||||
padding: 20px;
|
||||
padding: 20px 24px;
|
||||
}
|
||||
|
||||
.event-item {
|
||||
|
|
|
|||
|
|
@ -503,7 +503,7 @@ useHead({
|
|||
.row-2 {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 14px;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* ---- PRIVACY TOGGLE SPACING ---- */
|
||||
|
|
@ -615,7 +615,7 @@ useHead({
|
|||
/* ---- CONNECTIONS PANEL ---- */
|
||||
.connections-panel {
|
||||
border: 1px dashed var(--border);
|
||||
padding: 12px 14px;
|
||||
padding: 12px 16px;
|
||||
margin-top: 4px;
|
||||
margin-bottom: 12px;
|
||||
background: var(--surface);
|
||||
|
|
@ -630,7 +630,7 @@ useHead({
|
|||
/* ---- SAVE BAR ---- */
|
||||
.save-bar {
|
||||
flex-shrink: 0;
|
||||
padding: 24px 28px 24px;
|
||||
padding: 24px 28px;
|
||||
margin-top: 0;
|
||||
border-top: 1px dashed var(--border);
|
||||
display: flex;
|
||||
|
|
@ -644,7 +644,7 @@ useHead({
|
|||
}
|
||||
|
||||
.save-msg-ok {
|
||||
color: var(--green, var(--candle));
|
||||
color: var(--green);
|
||||
}
|
||||
|
||||
.save-msg-err {
|
||||
|
|
|
|||
|
|
@ -468,6 +468,7 @@ useHead({
|
|||
/* Bio: parch (inverted) block */
|
||||
.profile-section--parch {
|
||||
background: var(--parch);
|
||||
border-bottom-color: var(--parch-border);
|
||||
}
|
||||
.profile-section--parch .section-label {
|
||||
color: var(--parch-text-dim);
|
||||
|
|
@ -476,7 +477,7 @@ useHead({
|
|||
color: var(--parch-text);
|
||||
}
|
||||
.profile-section--parch .profile-bio :deep(a) {
|
||||
color: var(--candle-faint);
|
||||
color: var(--parch-accent);
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue