From 847ec52e4665b649225e7d57c95614eb0d2bf084 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 11:50:05 -0500 Subject: [PATCH 01/45] Revert inadvertent file rename --- app/assets/stylesheets/{closureup.css => popup.css} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename app/assets/stylesheets/{closureup.css => popup.css} (100%) diff --git a/app/assets/stylesheets/closureup.css b/app/assets/stylesheets/popup.css similarity index 100% rename from app/assets/stylesheets/closureup.css rename to app/assets/stylesheets/popup.css From 0af234f126806700e66f8c04f13a51049248aad1 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 11:50:15 -0500 Subject: [PATCH 02/45] No longer used --- app/assets/stylesheets/bubbles.css | 493 ----------------------------- 1 file changed, 493 deletions(-) delete mode 100644 app/assets/stylesheets/bubbles.css diff --git a/app/assets/stylesheets/bubbles.css b/app/assets/stylesheets/bubbles.css deleted file mode 100644 index 509cb62d0..000000000 --- a/app/assets/stylesheets/bubbles.css +++ /dev/null @@ -1,493 +0,0 @@ -:root { - --bubble-shape: 54% 46% 61% 39% / 57% 49% 51% 43%; - --bubble-shift: 10deg; - --bubble-size-one: 14cqi; - --bubble-size-two: 16cqi; - --bubble-size-three: 18cqi; - --bubble-size-four: 20cqi; - --bubble-size-five: 22cqi; -} - -@layer components { - .bubbles { - --column-gap: 2cqi; - --row-gap: 1cqi; - - margin-block: clamp(var(--block-space), 3%, calc(var(--block-space) * 2)); - - > * { - flex-shrink: 1; - } - } - - .something-to-rename { - --bubble-background: radial-gradient(circle at center, color(from var(--bubble-color) srgb r g b / 0.25), color(from var(--bubble-color) srgb r g b / 0.05)); - --bubble-border-width: 0.2rem; - --hover-size: 0; - - aspect-ratio: 1; - block-size: var(--bubble-size); - color: var(--bubble-color, currentColor); - container-type: inline-size; - display: grid; - place-items: center; - position: relative; - transition: 0.2s ease; - - .bubbles & { - &:nth-child(1) { order: 5; } - &:nth-child(2) { order: 3; } - &:nth-child(3) { order: 3; } - &:nth-child(4) { order: 7; } - &:nth-child(5) { order: 9; } - &:nth-child(6) { order: 5; } - &:nth-child(7) { order: 4; } - &:nth-child(8) { order: 9; } - &:nth-child(9) { order: 3; } - &:nth-child(10) { order: 7; } - &:nth-of-type(n+6) { - align-self: start; - } - } - - [data-turbo-preview] & { animation: none; } - - > * { - grid-area: 1/1; - } - - .bubble__perma & { - --bubble-border-width: 0.3rem; - --bubble-size: 40dvh !important; - - z-index: 1; - } - } - .bubble__detail { - --bubble-border-color: color-mix(in srgb, var(--bubble-color) 30%, var(--color-bg)); - --bubble-border-width: 0.15em; - - aspect-ratio: 1; - background: var(--color-bg); - block-size: auto; - border: var(--bubble-border-width) solid var(--bubble-border-color); - border-radius: var(--bubble-shape); - display: flex; - font-size: 5cqi; - font-weight: 800; - line-height: 1; - max-inline-size: 18ch; - padding: 1em; - place-content: center; - place-items: center; - position: absolute; - scale: 1; - text-overflow: ellipsis; - transform: none; - transition: transform 200ms ease-out; - white-space: nowrap; - z-index: 1; - - a { - color: var(--bubble-color); - } - - &.bubble__assignee { - font-size: 4.5cqi; - inset: 8em auto auto -1.7em; - padding: 0.2em; - - + & { - inset: 4em auto auto -1em; - - + & { - inset: 1em auto auto 2em; - } - } - - .avatar { - border-radius: var(--bubble-shape); - } - - @media (hover: hover) { - .bubbles .something-to-rename:not(.popped):hover & { - transform: translate(0, -1rem); - } - - .bubbles .something-to-rename:not(.popped):hover & + & { - transform: translate(1rem, -1rem); - } - - .bubbles .something-to-rename:not(.popped):hover & + & + & { - transform: translate(1.5rem, -0.5rem);; - } - } - - .assignee__name { - display: none; - - .bubble__perma & { - color: var(--bubble-color); - display: inline-block; - font-size: 0.9em; - font-weight: normal; - inline-size: 15ch; - inset: 0.3em 3.6em auto auto; - position: absolute; - text-align: end; - white-space: normal; - } - } - } - - &.bubble__comments { - --arrow-size: 1.5em; - --border-size: var(--bubble-border-width); - - aspect-ratio: 9/6; - inset: auto auto 2em -1em; - - &::before { - aspect-ratio: 2; - background: var(--bubble-border-color); - clip-path: polygon(50% 100%, 100% 0, 0 0); - inline-size: var(--arrow-size); - content: ""; - display: block; - inset-block-end: auto; - inset-block-start: 94%; - inset-inline-start: 66%; - position: absolute; - transform: translateX(-50%) rotate(-20deg); - } - - &::after { - aspect-ratio: 2; - background: var(--color-bg); - clip-path: polygon(50% 100%, 100% 0, 0 0); - inline-size: var(--arrow-size); - content: ""; - display: block; - inset-block-end: auto; - inset-block-start: calc(94% - var(--border-size) * 1.5); - inset-inline-start: 64%; - position: absolute; - transform: translateX(-50%) rotate(-20deg); - } - - @media (hover: hover) { - .bubbles .something-to-rename:not(.popped):hover & { - transform: translate(-0.5rem, -2rem); - } - } - } - - &.bubble__date { - --rotation: -45deg; - - aspect-ratio: 5/7; - cursor: pointer; - inset: 1cqb 1cqi auto auto; - transform: rotate(var(--rotation)); - - .bubble__date-text { - transform: rotate(calc(var(--rotation) * -1)); - } - - @media (hover: hover) { - .bubbles .something-to-rename:not(.popped):hover & { - transform: rotate(calc(var(--rotation) + var(--bubble-shift) * 1)) translate(0rem, 0.5rem); - } - } - } - - @media (hover: hover) { - .bubbles .something-to-rename:not(.popped):hover & { - transform: translate(1rem, 1rem); - } - - .bubbles .something-to-rename:not(.popped):hover & + & { - transform: translate(0, -1rem); - } - - .bubbles .something-to-rename:not(.popped):hover & + & + & { - transform: translate(-1rem, -1rem); - } - } - } - - .bubble__image { - border: none; - border-radius: var(--bubble-shape); - block-size: 100cqi; - inline-size: 100cqi; - overflow: hidden; - pointer-events: none; - transform: rotate(var(--bubble-rotate)) scale(0.92); - transition: 0.2s ease; - - @media (hover: hover) { - .bubbles .something-to-rename:not(.popped):hover & { - transform: rotate(calc(var(--bubble-rotate) + var(--bubble-shift))) scale(0.9); - } - } - - img { - block-size: 100cqi; - inline-size: 100cqi; - max-inline-size: none; - object-fit: cover; - transform: rotate(calc(var(--bubble-rotate) * -1)) scale(1.1); - - &:is([src=""]) { - display: none; - } - } - - :is(.bubbles, .bubbles-list) .bubble--wobble & { - animation: wobble-img 1200ms normal forwards ease-out; - } - } - - .bubble__link { - content: ""; - inset: 0; - position: absolute; - z-index: -1; - - .bubbles & { - z-index: 1; - } - } - - .bubbles-list { - --bubble-border-width: 0.15rem; - --bubble-shift: 15deg; - --bubble-size: 1.8em; - --divider-offset: 1.2em; - --hover-size: 0; - - margin-inline: auto; - - @media (min-width: 150ch) { - margin-inline: var(--tray-size); - } - - .something-to-rename { - order: 0; - } - - .bubble__title-link { - color: var(--color-txt); - text-decoration: none; - } - - ul { - li { - border-radius: 0; - list-style: none; - padding: 0.5em var(--inline-space); - position: relative; - transition: background-color 200ms ease-out; - } - - &:not(.dragging) { - li { - @media (hover: hover) { - &:hover { - background-color: color(from var(--bubble-color) srgb r g b / 0.15); - border: 0; - } - } - } - } - } - - .avatar { - --avatar-size: 1.1em; - - > * { - font-size: 0.5em; - } - } - } - - .bubble__title-text { - font-weight: 700; - flex-grow: 1; - letter-spacing: -0.015em; - white-space: nowrap; - - .drafted & { - color: color(from var(--color-ink) srgb r g b / 0.5); - } - - &::after { - border-block-end: 1px dotted var(--color-subtle-dark); - content: ""; - flex-grow: 1; - margin-block-end: 0.25em; - } - } - - .bubble__tags { - --row-gap: 0; - - font-size: var(--text-small); - margin-block-start: 0.3cqb; - max-block-size: 4lh; - max-inline-size: 75cqi; - overflow: hidden; - text-overflow: ellipsis; - - .bubble__perma & { - font-size: var(--text-medium); - } - } - - .bubble__tag { - font-weight: 700; - max-inline-size: 75cqi; - } - - .bubble__title { - align-items: center; - display: flex; - flex-direction: column; - justify-content: center; - margin: auto; - max-block-size: 90cqi; - max-inline-size: 70cqi; - - .bubbles & { - pointer-events: none; - } - - a { - color: var(--splat-color); - - &.bubble__title-rendered { - -webkit-line-clamp: var(--lines, 4); - -webkit-box-orient: vertical; - display: -webkit-box; - font-size: 9cqi; - font-weight: 800; - line-height: 1.2; - overflow: hidden; - text-overflow: clip; - white-space: normal; - } - } - - /*textarea {*/ - /* --input-color: var(--bubble-color);*/ - /* --input-border-radius: 0;*/ - - /* font-size: 9cqi;*/ - /* font-weight: 800;*/ - /* line-height: 1.2;*/ - - /* &::selection {*/ - /* background-color: var(--bubble-color);*/ - /* color: var(--color-ink-reversed);*/ - /* }*/ - /*}*/ - - @media (hover: hover) { - .something-to-rename:has(.bubble__image img:not([src=""])):hover & { - color: var(--color-ink-reversed); - text-shadow: 0 0 0.2em var(--bubble-color), 0 0 0.2em var(--bubble-color), 0 0 0.2em var(--bubble-color); - position: relative; - z-index: 1; - } - } - } - - .bubble__shape { - background: var(--bubble-background); - block-size: var(--bubble-size, 1.2em); - border-color: var(--bubble-border-color, color-mix(in srgb, var(--bubble-color) 15%, var(--color-bg))); - border-radius: var(--bubble-shape); - border-style: var(--bubble-border-style, solid); - border-width: 1px; - inline-size: var(--bubble-size, 1.2em); - pointer-events: none; - position: relative; - transform: rotate(var(--bubble-rotate)); - transition: 200ms ease-out; - z-index: 0; - - @media (prefers-color-scheme: dark) { - --bubble-background: radial-gradient(circle at center, color(from var(--bubble-color) srgb r g b / 0.45), color(from var(--bubble-color) srgb r g b / 0.15)); - --bubble-border-color: color-mix(in srgb, var(--bubble-color) 30%, var(--color-bg)); - } - - .something-to-rename & { - --bubble-size: 100%; - } - - .drafted & { - --bubble-border-style: dashed; - } - - :is(.bubbles, .bubbles-list) .bubble--wobble & { - animation: wobble 1200ms normal forwards ease-out; - } - - .bubble--wobble:nth-child(even) & { - animation-name: wobble-alt; - animation-duration: 900ms; - } - - .popped & { - display: none; - } - - .event &, - .bucket &, - .bubbles-list & { - --bubble-background: color-mix(in srgb, var(--bubble-color) 30%, var(--color-bg)); - --bubble-border-color: color-mix(in srgb, var(--bubble-color) 40%, var(--color-bg)) - } - } - - .bubble__actions-container { - background-color: color-mix(in srgb, var(--bubble-color) 20%, var(--color-bg)); - margin-block-start: -0.7em; - position: relative; - z-index: 1; - - .btn--plain { - --btn-color: var(--bubble-color); - - text-decoration: underline; - } - - .bubble__pop-message { - color: var(--bubble-color); - } - } - - .bubble__splat { - display: none; - pointer-events: none; - transform: rotate(var(--bubble-rotate)); - - .popped & { - display: block; - fill: color-mix(in srgb, var(--bubble-color) 20%, var(--color-bg)); - position: absolute; - scale: 130%; - z-index: -1; - } - - .bubbles-list & { - block-size: var(--bubble-size); - fill: color-mix(in srgb, var(--bubble-color) 35%, var(--color-bg)); - inline-size: var(--bubble-size); - position: relative; - scale: 1; - z-index: 0; - } - } -} From 7b32a577a338fc5c406b782d24ece42f6e54b893 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 11:50:23 -0500 Subject: [PATCH 03/45] Remove unused animations --- app/assets/stylesheets/animation.css | 36 ---------------------------- 1 file changed, 36 deletions(-) diff --git a/app/assets/stylesheets/animation.css b/app/assets/stylesheets/animation.css index c2a510c18..c99081856 100644 --- a/app/assets/stylesheets/animation.css +++ b/app/assets/stylesheets/animation.css @@ -9,16 +9,6 @@ } /* Keyframes */ - @keyframes float-up-left { - 0% { transform: translate(10px, 20px); } - 100% { transform: translate(0, 0); } - } - - @keyframes float-down-right { - 0% { transform: translate(-10px, -20px); } - 100% { transform: translate(0, 0); } - } - @keyframes react { 0% { transform: scale(0.3); opacity: 0; } 50% { transform: scale(1.15); opacity: 1; } @@ -36,30 +26,4 @@ 50% { transform: translateX(-1rem); } 75% { transform: translateX(1rem); } } - - @keyframes wobble { - 0% { transform: rotate(calc(var(--card-rotate) + 90deg)); } - 15% { border-radius: 66% 34% 72% 28% / 39% 63% 37% 61%; } - 25% { border-radius: 55% 47% 62% 40% / 58% 50% 52% 44%; } - 33% { border-radius: 46% 54% 61% 39% / 50% 51% 49% 50%; } - 50% { border-radius: 54% 46% 61% 39% / 57% 49% 51% 43%; } - 75% { border-radius: 53% 45% 60% 38% / 56% 48% 50% 42%; } - } - - @keyframes wobble-alt { - 0% { transform: rotate(calc(var(--card-rotate) + -90deg)); } - 12% { border-radius: 66% 34% 72% 28% / 39% 63% 37% 61%; } - 25% { border-radius: 53% 45% 60% 38% / 56% 48% 50% 42%; } - 33% { border-radius: 55% 47% 62% 40% / 58% 50% 52% 44%; } - 50% { border-radius: 46% 54% 61% 39% / 50% 51% 49% 50%; } - 75% { border-radius: 54% 46% 61% 39% / 57% 49% 51% 43%; } - } - - @keyframes wobble-img { - 15% { border-radius: 66% 34% 72% 28% / 39% 63% 37% 61%; } - 25% { border-radius: 55% 47% 62% 40% / 58% 50% 52% 44%; } - 33% { border-radius: 46% 54% 61% 39% / 50% 51% 49% 50%; } - 50% { border-radius: 54% 46% 61% 39% / 57% 49% 51% 43%; } - 75% { border-radius: 53% 45% 60% 38% / 56% 48% 50% 42%; } - } } From 5d0366a20f0c8fa0fc75e6514942a272464403ae Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:24:10 -0500 Subject: [PATCH 04/45] Delete unused icons --- app/assets/images/activity.svg | 1 - app/assets/images/alert.svg | 1 - app/assets/images/blob.svg | 1 - app/assets/images/calendar-add.svg | 1 - app/assets/images/calendar.svg | 1 - app/assets/images/card-add.svg | 1 - app/assets/images/cards.svg | 1 - app/assets/images/chart.svg | 1 - app/assets/images/closure.svg | 1 - app/assets/images/comment.svg | 1 - app/assets/images/drag.svg | 1 - app/assets/images/grid.svg | 1 - app/assets/images/history.svg | 1 - app/assets/images/hourglass.svg | 1 - app/assets/images/inbox.svg | 1 - app/assets/images/menu.svg | 1 - app/assets/images/picture-double.svg | 1 - app/assets/images/temperature.svg | 1 - app/assets/stylesheets/icons.css | 16 ---------------- app/views/filters/_dialog.html.erb | 1 - 20 files changed, 35 deletions(-) delete mode 100644 app/assets/images/activity.svg delete mode 100644 app/assets/images/alert.svg delete mode 100644 app/assets/images/blob.svg delete mode 100644 app/assets/images/calendar-add.svg delete mode 100644 app/assets/images/calendar.svg delete mode 100644 app/assets/images/card-add.svg delete mode 100644 app/assets/images/cards.svg delete mode 100644 app/assets/images/chart.svg delete mode 100644 app/assets/images/closure.svg delete mode 100644 app/assets/images/comment.svg delete mode 100644 app/assets/images/drag.svg delete mode 100644 app/assets/images/grid.svg delete mode 100644 app/assets/images/history.svg delete mode 100644 app/assets/images/hourglass.svg delete mode 100644 app/assets/images/inbox.svg delete mode 100644 app/assets/images/menu.svg delete mode 100644 app/assets/images/picture-double.svg delete mode 100644 app/assets/images/temperature.svg diff --git a/app/assets/images/activity.svg b/app/assets/images/activity.svg deleted file mode 100644 index 8c58e62ec..000000000 --- a/app/assets/images/activity.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/alert.svg b/app/assets/images/alert.svg deleted file mode 100644 index 90c7c0b2d..000000000 --- a/app/assets/images/alert.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/blob.svg b/app/assets/images/blob.svg deleted file mode 100644 index 7dfcb310b..000000000 --- a/app/assets/images/blob.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/calendar-add.svg b/app/assets/images/calendar-add.svg deleted file mode 100644 index faceba80b..000000000 --- a/app/assets/images/calendar-add.svg +++ /dev/null @@ -1 +0,0 @@ -calendar-add-1 \ No newline at end of file diff --git a/app/assets/images/calendar.svg b/app/assets/images/calendar.svg deleted file mode 100644 index 9e25f1564..000000000 --- a/app/assets/images/calendar.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/card-add.svg b/app/assets/images/card-add.svg deleted file mode 100644 index 8767b6117..000000000 --- a/app/assets/images/card-add.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/cards.svg b/app/assets/images/cards.svg deleted file mode 100644 index 2892ca629..000000000 --- a/app/assets/images/cards.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/chart.svg b/app/assets/images/chart.svg deleted file mode 100644 index 8a42e538e..000000000 --- a/app/assets/images/chart.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/closure.svg b/app/assets/images/closure.svg deleted file mode 100644 index 9a72ca8da..000000000 --- a/app/assets/images/closure.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/comment.svg b/app/assets/images/comment.svg deleted file mode 100644 index 26eb50ca9..000000000 --- a/app/assets/images/comment.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/drag.svg b/app/assets/images/drag.svg deleted file mode 100644 index 26b655f04..000000000 --- a/app/assets/images/drag.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/grid.svg b/app/assets/images/grid.svg deleted file mode 100644 index fa6bca113..000000000 --- a/app/assets/images/grid.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/history.svg b/app/assets/images/history.svg deleted file mode 100644 index f36d73631..000000000 --- a/app/assets/images/history.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/hourglass.svg b/app/assets/images/hourglass.svg deleted file mode 100644 index 50d90d9c9..000000000 --- a/app/assets/images/hourglass.svg +++ /dev/null @@ -1 +0,0 @@ -hourglass \ No newline at end of file diff --git a/app/assets/images/inbox.svg b/app/assets/images/inbox.svg deleted file mode 100644 index 50252472c..000000000 --- a/app/assets/images/inbox.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/menu.svg b/app/assets/images/menu.svg deleted file mode 100644 index 44e889047..000000000 --- a/app/assets/images/menu.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/picture-double.svg b/app/assets/images/picture-double.svg deleted file mode 100644 index f3a34a736..000000000 --- a/app/assets/images/picture-double.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/temperature.svg b/app/assets/images/temperature.svg deleted file mode 100644 index 7f02650ac..000000000 --- a/app/assets/images/temperature.svg +++ /dev/null @@ -1 +0,0 @@ -temperature-thermometer-high \ No newline at end of file diff --git a/app/assets/stylesheets/icons.css b/app/assets/stylesheets/icons.css index 10e273bb5..534360cd7 100644 --- a/app/assets/stylesheets/icons.css +++ b/app/assets/stylesheets/icons.css @@ -17,40 +17,26 @@ background: none; } - .icon--activity { --svg: url("activity.svg "); } .icon--add { --svg: url("add.svg "); } - .icon--alert { --svg: url("alert.svg "); } .icon--arrow-left { --svg: url("arrow-left.svg "); } .icon--arrow-right { --svg: url("arrow-right.svg "); } .icon--art { --svg: url("art.svg "); } .icon--assigned { --svg: url("assigned.svg "); } .icon--bell-off { --svg: url("bell-off.svg "); } .icon--bell { --svg: url("bell.svg "); } - .icon--blob { --svg: url("blob.svg "); } .icon--bolt { --svg: url("bolt.svg "); } .icon--bookmark-outline { --svg: url("bookmark-outline.svg "); } .icon--bookmark { --svg: url("bookmark.svg "); } - .icon--card-add { --svg: url("card-add.svg "); } - .icon--cards { --svg: url("cards.svg "); } - .icon--calendar-add { --svg: url("calendar-add.svg "); } - .icon--calendar { --svg: url("calendar.svg "); } .icon--camera { --svg: url("camera.svg "); } - .icon--chart { --svg: url("chart.svg "); } .icon--check { --svg: url("check.svg "); } .icon--close { --svg: url("close.svg "); } - .icon--comment { --svg: url("comment.svg "); } .icon--copy-paste { --svg: url("copy-paste.svg "); } .icon--crown { --svg: url("crown.svg "); } - .icon--drag { --svg: url("drag.svg "); } .icon--email { --svg: url("email.svg "); } .icon--everyone { --svg: url("everyone.svg "); } .icon--filter { --svg: url("filter.svg "); } .icon--globe { --svg: url("globe.svg "); } - .icon--grid { --svg: url("grid.svg "); } - .icon--history { --svg: url("history.svg "); } .icon--home { --svg: url("home.svg "); } - .icon--hourglass { --svg: url("hourglass.svg "); } - .icon--inbox { --svg: url("inbox.svg "); } .icon--logout { --svg: url("logout.svg "); } .icon--menu { --svg: url("menu.svg "); } .icon--menu-dots-horizontal { --svg: url("menu-dots-horizontal.svg "); } @@ -65,7 +51,6 @@ .icon--picture-double { --svg: url("picture-double.svg "); } .icon--picture-remove { --svg: url("picture-remove.svg "); } .icon--pinned { --svg: url("pinned.svg "); } - .icon--closure { --svg: url("closure.svg "); } .icon--qr-code { --svg: url("qr-code.svg "); } .icon--reaction { --svg: url("reaction.svg "); } .icon--refresh { --svg: url("refresh.svg "); } @@ -78,7 +63,6 @@ .icon--sort-descending { --svg: url("sort-descending.svg "); } .icon--star { --svg: url("star.svg "); } .icon--tag { --svg: url("tag.svg "); } - .icon--temperature { --svg: url("temperature.svg "); } .icon--thumb-up { --svg: url("thumb-up.svg "); } .icon--trash { --svg: url("trash.svg "); } .icon--unpinned { --svg: url("unpinned.svg"); } diff --git a/app/views/filters/_dialog.html.erb b/app/views/filters/_dialog.html.erb index ef7e42679..e633630c4 100644 --- a/app/views/filters/_dialog.html.erb +++ b/app/views/filters/_dialog.html.erb @@ -173,7 +173,6 @@
<%= tag.button class: "btn", form: :filter_form, formaction: filters_path, formmethod: :post do %> - <%= icon_tag "cards" %> Save collection <% end %> From 7a2ae1366b3293aa62c3fc2e9c1ecdfc397395b3 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:25:01 -0500 Subject: [PATCH 05/45] Optimize image --- app/assets/images/picture-add.svg | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/images/picture-add.svg b/app/assets/images/picture-add.svg index a64cf38d6..63fca5189 100644 --- a/app/assets/images/picture-add.svg +++ b/app/assets/images/picture-add.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file From 6c0ba8c97fcb6cb8fb817c5ef8a24d6f6f249c4c Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:36:29 -0500 Subject: [PATCH 06/45] Unused --- app/assets/stylesheets/avatars.css | 36 ------------------------------ 1 file changed, 36 deletions(-) diff --git a/app/assets/stylesheets/avatars.css b/app/assets/stylesheets/avatars.css index 6d0094f75..c5ee440d7 100644 --- a/app/assets/stylesheets/avatars.css +++ b/app/assets/stylesheets/avatars.css @@ -24,42 +24,6 @@ } } - .avatar__group { - --avatar-size: 2.5ch; - - block-size: 5ch; - display: grid; - gap: 1px; - grid-template-columns: 1fr 1fr; - grid-template-rows: min-content; - inline-size: 5ch; - place-content: center; - - .avatar { - margin: auto; - } - - &:where(:has(> :last-child:nth-child(2))) { - --avatar-size: 3.5ch; - - > :first-child { - margin-block-end: 1.5ch; - margin-inline-end: -0.75ch; - } - - > :last-child { - margin-block-start: 1.5ch; - margin-inline-start: -0.75ch; - } - } - - &:where(:has(> :last-child:nth-child(3))) { - > :last-child { - margin-inline: 1.25ch -1.25ch; - } - } - } - .avatar__form { display: grid; grid-template-columns: 1fr auto 1fr; From e1337e64bf3a80b55a2289d40e1d08daa9a58809 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:36:44 -0500 Subject: [PATCH 07/45] Source order --- app/assets/stylesheets/panels.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/panels.css b/app/assets/stylesheets/panels.css index 86126c15e..108d7c42a 100644 --- a/app/assets/stylesheets/panels.css +++ b/app/assets/stylesheets/panels.css @@ -2,8 +2,8 @@ .panel { background-color: var(--color-bg); border: var(--panel-border-size, 1px) solid var(--panel-border-color, var(--color-subtle)); - color: var(--color-ink); border-radius: var(--panel-border-radius, 1em); + color: var(--color-ink); inline-size: var(--panel-size, 60ch); max-inline-size: 100%; padding: var(--panel-padding, calc(var(--block-space) * 2)); From c491e8cf6c6a545455af4d4f678a3f01603a018c Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:41:49 -0500 Subject: [PATCH 08/45] Cascade layers regression fix `.txt-small` now is more specific than `font-size: 0.74em` on `.reaction__action` --- app/views/comments/reactions/_reactions.html.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/comments/reactions/_reactions.html.erb b/app/views/comments/reactions/_reactions.html.erb index 3515721c0..0106deefe 100644 --- a/app/views/comments/reactions/_reactions.html.erb +++ b/app/views/comments/reactions/_reactions.html.erb @@ -8,7 +8,7 @@ <%= turbo_frame_tag comment, :new_reaction do %>
<%= link_to new_collection_card_comment_reaction_path(comment.card.collection, comment.card, comment), role: "button", - class: "txt-small btn reaction__action", action: "soft-keyboard#open" do %> + class: "btn reaction__action", action: "soft-keyboard#open" do %> <%= icon_tag "reaction" %> Add a reaction <% end %> From dd8f653e8eb5b1fa5d0e5a1caf1dbb1b7585c32c Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:46:52 -0500 Subject: [PATCH 09/45] Unused --- app/assets/stylesheets/workflows.css | 29 ---------------------------- 1 file changed, 29 deletions(-) diff --git a/app/assets/stylesheets/workflows.css b/app/assets/stylesheets/workflows.css index 4f93ce4b8..43ead2256 100644 --- a/app/assets/stylesheets/workflows.css +++ b/app/assets/stylesheets/workflows.css @@ -14,10 +14,6 @@ background-color: color(from var(--card-color) srgb r g b / 0.15); } } - - .cards-list & { - display: none; - } } .workflow-stage--current { @@ -38,30 +34,5 @@ border-radius: 0.2em; color: var(--color-ink-reversed); } - - .cards-list & { - display: flex; - background: transparent; - border-radius: 0.2em; - color: var(--color-ink); - padding: 0; - border: 0; - } - } - - .workflow__popup { - --panel-border-radius: 0.5em; - --panel-padding: 0.5em; - --panel-size: 100%; - - inline-size: auto !important; - inset: 0 auto auto 0; - margin-block-start: 1lh; - margin-inline-start: calc((var(--panel-padding) + 0.7em) * -1); - min-inline-size: 12ch; - max-inline-size: var(--panel-size) !important; - position: absolute; - transform-origin: top left; - z-index: 1; } } From 6248a3e9abbd21f186b9c80ac564ef6e678f03af Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 13:48:40 -0500 Subject: [PATCH 10/45] Unnecessary, buttons already adapt to text sizing --- app/assets/stylesheets/buttons.css | 4 ---- app/views/accounts/users/_user.html.erb | 2 +- app/views/workflows/_workflow.html.erb | 2 +- app/views/workflows/edit.html.erb | 6 +++--- app/views/workflows/stages/edit.html.erb | 6 +++--- app/views/workflows/stages/new.html.erb | 2 +- 6 files changed, 9 insertions(+), 13 deletions(-) diff --git a/app/assets/stylesheets/buttons.css b/app/assets/stylesheets/buttons.css index 3b6b3ebcc..97283f467 100644 --- a/app/assets/stylesheets/buttons.css +++ b/app/assets/stylesheets/buttons.css @@ -181,10 +181,6 @@ --btn-border-color: var(--color-bg); } - .btn--small { - font-size: 0.8em; - } - .btn--success { animation: success 1s ease-out; diff --git a/app/views/accounts/users/_user.html.erb b/app/views/accounts/users/_user.html.erb index e8e57b096..ae9326c48 100644 --- a/app/views/accounts/users/_user.html.erb +++ b/app/views/accounts/users/_user.html.erb @@ -15,7 +15,7 @@ <% end %> <%# FIXME: Move this Current.user check to a stimulus controller that just checks for admin? or the like we so we can cache user list %> - <%= button_to account_user_path(user), method: :delete, class: "btn btn--small btn--negative flex-item-no-shrink", + <%= button_to account_user_path(user), method: :delete, class: "btn txt-small btn--negative flex-item-no-shrink", disabled: !Current.user.can_administer?(user), data: { turbo_confirm: "Are you sure you want to permanently remove this person from the account?" } do %> <%= icon_tag "minus" %> diff --git a/app/views/workflows/_workflow.html.erb b/app/views/workflows/_workflow.html.erb index cba18f2e1..6ec1e289f 100644 --- a/app/views/workflows/_workflow.html.erb +++ b/app/views/workflows/_workflow.html.erb @@ -14,7 +14,7 @@ <%= turbo_frame_tag dom_id(workflow, :stages) do %> <%= render partial: "workflows/stages/stage", collection: workflow.stages %> - <%= link_to new_workflow_stage_path(workflow), class: "btn btn--small" do %> + <%= link_to new_workflow_stage_path(workflow), class: "btn txt-small" do %> <%= icon_tag "add" %> New stage <% end %> diff --git a/app/views/workflows/edit.html.erb b/app/views/workflows/edit.html.erb index c954b26e5..b8405698b 100644 --- a/app/views/workflows/edit.html.erb +++ b/app/views/workflows/edit.html.erb @@ -7,17 +7,17 @@ <%= link_to "Cancel", workflow_path(@workflow), data: { form_target: "cancel", turbo_frame: dom_id(@workflow) }, hidden: true %> <% end %> - <%= tag.button type: :submit, class: "btn btn--small btn--positive", form: dom_id(@workflow, :form) do %> + <%= tag.button type: :submit, class: "btn txt-small btn--positive", form: dom_id(@workflow, :form) do %> <%= icon_tag "check" %> Save <% end %> - <%= link_to workflow_path(@workflow), class: "btn btn--small", data: { turbo_frame: dom_id(@workflow) } do %> + <%= link_to workflow_path(@workflow), class: "btn txt-small", data: { turbo_frame: dom_id(@workflow) } do %> <%= icon_tag "remove-med" %> Cancel <% end %> - <%= button_to workflow_path(@workflow), method: :delete, class: "btn btn--small btn--negative", data: { turbo_frame: :workflows, turbo_confirm: "Are you sure you want to delete this workflow?" } do %> + <%= button_to workflow_path(@workflow), method: :delete, class: "btn txt-small btn--negative", data: { turbo_frame: :workflows, turbo_confirm: "Are you sure you want to delete this workflow?" } do %> <%= icon_tag "minus" %> Delete <%= @workflow.name %> <% end %> diff --git a/app/views/workflows/stages/edit.html.erb b/app/views/workflows/stages/edit.html.erb index ea0f81d80..b1da71b60 100644 --- a/app/views/workflows/stages/edit.html.erb +++ b/app/views/workflows/stages/edit.html.erb @@ -5,18 +5,18 @@ <% end %>
- <%= tag.button type: :submit, class: "btn btn--small btn--positive", form: dom_id(@stage, :form) do %> + <%= tag.button type: :submit, class: "btn txt-small btn--positive", form: dom_id(@stage, :form) do %> <%= icon_tag "check" %> Save <% end %> - <%= link_to workflow_path(@workflow), class: "btn btn--small", data: { turbo_frame: dom_id(@workflow) } do %> + <%= link_to workflow_path(@workflow), class: "btn txt-small", data: { turbo_frame: dom_id(@workflow) } do %> <%= icon_tag "remove-med" %> Cancel <% end %> <% if @stage.workflow.stages.many? %> - <%= button_to workflow_stage_path(@stage.workflow, @stage), method: :delete, class: "btn btn--negative btn--small", + <%= button_to workflow_stage_path(@stage.workflow, @stage), method: :delete, class: "btn btn--negative txt-small", data: { turbo_frame: dom_id(@workflow), turbo_confirm: "Are you sure you want to delete this stage?" } do %> <%= icon_tag "minus" %> Delete <%= @stage.name %> diff --git a/app/views/workflows/stages/new.html.erb b/app/views/workflows/stages/new.html.erb index f788d9bb3..c52dc67ab 100644 --- a/app/views/workflows/stages/new.html.erb +++ b/app/views/workflows/stages/new.html.erb @@ -5,7 +5,7 @@ <%= icon_tag "check" %> Add stage <% end %> - <%= link_to workflow_path(@workflow), class: "btn btn--small", data: { form_target: "cancel", controller: "hotkey", action: "keydown.esc@document->hotkey#click" } do %> + <%= link_to workflow_path(@workflow), class: "btn txt-small", data: { form_target: "cancel", controller: "hotkey", action: "keydown.esc@document->hotkey#click" } do %> <%= icon_tag "remove-med" %> Cancel <% end %> From 197fe954970bc8cff9128a7f67f6df7bb5416def Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 14:00:19 -0500 Subject: [PATCH 11/45] These are unused partials from the removed `buckets#index` view --- app/assets/stylesheets/collections.css | 40 ---------------------- app/views/collections/_collection.html.erb | 27 --------------- app/views/filters/_filter.html.erb | 28 --------------- 3 files changed, 95 deletions(-) delete mode 100644 app/assets/stylesheets/collections.css delete mode 100644 app/views/collections/_collection.html.erb delete mode 100644 app/views/filters/_filter.html.erb diff --git a/app/assets/stylesheets/collections.css b/app/assets/stylesheets/collections.css deleted file mode 100644 index 4d0ad7245..000000000 --- a/app/assets/stylesheets/collections.css +++ /dev/null @@ -1,40 +0,0 @@ -@layer components { - .collection { - inline-size: min(35ch, 40%); - line-height: 1.2; - - mark { - background-color: transparent; - color: var(--color-link); - text-decoration: underline; - } - } - - .collections { - --gap: 2cqi; - --hover-size: 0; - --column-gap: var(--gap); - --row-gap: var(--gap); - - list-style: none; - padding: var(--gap); - } - - .collection__button { - position: absolute; - inset: calc((var(--btn-size) * -1) - 2cqi) 1cqi auto auto; - } - - .collection__cards { - --border-radius: 1.5em; - - margin-block: 0; - max-inline-size: 100%; - padding: 1cqi; - } - - .cards__container { - aspect-ratio: 18 / 9; - container-type: inline-size; - } -} diff --git a/app/views/collections/_collection.html.erb b/app/views/collections/_collection.html.erb deleted file mode 100644 index fc36376ba..000000000 --- a/app/views/collections/_collection.html.erb +++ /dev/null @@ -1,27 +0,0 @@ -
  • - <%= link_to cards_path(collection_ids: [ collection ]), - class: "border border-radius margin-block-end-half cards__container flex justify-center align-center position-relative", - aria: { hidden: true }, tabindex: -1 do %> -
    - <% collection.cards.active.published_or_drafted_by(Current.user).ordered_by_activity.limit(10).each do |card| %> -
    " style="--card-color: <%= card.color %>; <%= card_rotation(card) %>" - data-card-size-target="card" - data-activity-score="<%= card.activity_score %>" - data-activity-score-at="<%= card.activity_score_at.to_i %>"> - -
    - <% end %> -
    - <% end %> - -
    - <%= link_to cards_path(collection_ids: [ collection ]), class: "txt-ink flex flex-column" do %> - <%= collection.name %> - <% end %> - - <%= link_to edit_collection_path(collection), class: "btn txt-small collection__button" do %> - <%= icon_tag "settings" %> - Settings for <%= collection.name %> - <% end %> -
    -
    • diff --git a/app/views/filters/_filter.html.erb b/app/views/filters/_filter.html.erb deleted file mode 100644 index 29e4a9862..000000000 --- a/app/views/filters/_filter.html.erb +++ /dev/null @@ -1,28 +0,0 @@ -<% cache_if filter.cacheable?, filter do %> -
  • - <%= link_to cards_path(**filter.as_params), - class: "border border-radius margin-block-end-half cards__container flex justify-center align-center position-relative", - aria: { hidden: true }, tabindex: -1 do %> -
    - <% filter.cards.ordered_by_activity.limit(10).each do |card| %> -
    " style="--card-color: <%= card.color %>; <%= card_rotation(card) %>" - data-card-size-target="card" - data-activity-score="<%= card.activity_score %>" - data-activity-score-at="<%= card.activity_score_at.to_i %>"> - -
    - <% end %> -
    - <% end %> - -
    - <%= link_to cards_path(**filter.as_params), class: "txt-ink" do %> - <%= icon_tag "filter", class: "flex-inline", style: "vertical-align: bottom" %> <%= filter.summary %> - <% end %> - <%= button_to filter_path(filter), method: :delete, class: "btn txt-small btn--negative collection__button", data: { turbo_confirm: "Are you sure you want to delete this filter?" } do %> - <%= icon_tag "minus" %> - Delete - <% end %> -
    -
    • -<% end %> From 4673778473e364f43732e0ef5a1042464d38df2e Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 14:02:53 -0500 Subject: [PATCH 12/45] Source order --- app/assets/stylesheets/pins.css | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/app/assets/stylesheets/pins.css b/app/assets/stylesheets/pins.css index 292f7c691..c55e0cb87 100644 --- a/app/assets/stylesheets/pins.css +++ b/app/assets/stylesheets/pins.css @@ -1,19 +1,4 @@ @layer components { - .pin-tray { - inset: auto auto var(--block-space-half) var(--inline-space); - - .pin { - --z: calc(10 - var(--position)); - - &:nth-child(7) { --position: 7; } - &:nth-child(8) { --position: 8; } - &:nth-child(9) { --position: 9; } - &:nth-child(10) { --position: 10; } - - &:nth-child(1n + 11) { display: none; } - } - } - .pin__collection { background-color: var(--card-color); font-weight: 800; @@ -51,4 +36,19 @@ .pin__title { margin-block-start: 0.3rem; } + + .pin-tray { + inset: auto auto var(--block-space-half) var(--inline-space); + + .pin { + --z: calc(10 - var(--position)); + + &:nth-child(7) { --position: 7; } + &:nth-child(8) { --position: 8; } + &:nth-child(9) { --position: 9; } + &:nth-child(10) { --position: 10; } + + &:nth-child(1n + 11) { display: none; } + } + } } From 60890b10eeca477e4730e2b34c775e680cf58c15 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 9 Apr 2025 14:11:32 -0500 Subject: [PATCH 13/45] Remove translations feature --- app/assets/stylesheets/translations.css | 35 ------------------------- app/helpers/translations_helper.rb | 29 -------------------- app/views/collections/edit.html.erb | 2 -- app/views/first_runs/show.html.erb | 3 --- app/views/sessions/new.html.erb | 2 -- app/views/users/edit.html.erb | 3 --- app/views/users/new.html.erb | 3 --- 7 files changed, 77 deletions(-) delete mode 100644 app/assets/stylesheets/translations.css delete mode 100644 app/helpers/translations_helper.rb diff --git a/app/assets/stylesheets/translations.css b/app/assets/stylesheets/translations.css deleted file mode 100644 index 93c34e258..000000000 --- a/app/assets/stylesheets/translations.css +++ /dev/null @@ -1,35 +0,0 @@ -@layer components { - /* Language translations */ - .lanuage-list-menu { - --max-width: 40ch; - - background-color: var(--color-subtle); - border: 1px solid var(--color-subtle-dark); - border-radius: 0.5em; - inset: auto; - inline-size: max-content; - margin-inline: var(--inline-space); - max-inline-size: 40ch; - overflow: clip; - position: absolute; - z-index: 1; - - @media (max-width: 70ch) { - max-inline-size: calc(var(--max-width) - var(--inline-space)); - } - - .popover-orientation-top & { - inset-block-end: 100%; - } - } - - .language-list { - display: grid; - gap: var(--block-space-half) var(--inline-space); - grid-template-rows: min-content; - grid-template-columns: min-content 1fr; - justify-content: start; - margin: 0; - text-align: start; - } -} diff --git a/app/helpers/translations_helper.rb b/app/helpers/translations_helper.rb deleted file mode 100644 index f50a397e2..000000000 --- a/app/helpers/translations_helper.rb +++ /dev/null @@ -1,29 +0,0 @@ -module TranslationsHelper - TRANSLATIONS = { - user_name: { "🇺🇸": "Enter your name", "🇪🇸": "Introduce tu nombre", "🇫🇷": "Entrez votre nom", "🇮🇳": "अपना नाम दर्ज करें", "🇩🇪": "Geben Sie Ihren Namen ein", "🇧🇷": "Insira seu nome" }, - email_address: { "🇺🇸": "Enter your email address", "🇪🇸": "Introduce tu correo electrónico", "🇫🇷": "Entrez votre adresse courriel", "🇮🇳": "अपना ईमेल पता दर्ज करें", "🇩🇪": "Geben Sie Ihre E-Mail-Adresse ein", "🇧🇷": "Insira seu endereço de email" }, - password: { "🇺🇸": "Enter your password", "🇪🇸": "Introduce tu contraseña", "🇫🇷": "Saisissez votre mot de passe", "🇮🇳": "अपना पासवर्ड दर्ज करें", "🇩🇪": "Geben Sie Ihr Passwort ein", "🇧🇷": "Insira sua senha" }, - collection_name: { "🇺🇸": "Give it a name", "🇪🇸": "Dale un nombre", "🇫🇷": "Donnez lui un nom", "🇮🇳": "इसे एक नाम दें", "🇩🇪": "Gib ihm einen Namen", "🇧🇷": "Dê-lhe um nome" } - } - - def translations_for(translation_key) - tag.dl(class: "language-list") do - TRANSLATIONS[translation_key].map do |language, translation| - concat tag.dt(language) - concat tag.dd(translation, class: "margin-none") - end - end - end - - def translation_button(translation_key) - tag.div(class: "position-relative", data: { controller: "popover", action: "keydown.esc->popover#close click@document->popover#closeOnClickOutside", popover_orientation_top_class: "popover-orientation-top" }) do - tag.button(type: "button", class: "btn", tabindex: -1, data: { action: "popover#toggle" }) do - concat image_tag("globe.svg", class: "icon", role: "presentation") - concat tag.span("Translate", class: "for-screen-reader") - end + - tag.dialog(class: "lanuage-list-menu popover shadow", data: { popover_target: "menu" }) do - translations_for(translation_key) - end - end - end -end diff --git a/app/views/collections/edit.html.erb b/app/views/collections/edit.html.erb index 84e7a7d54..61fe4ca81 100644 --- a/app/views/collections/edit.html.erb +++ b/app/views/collections/edit.html.erb @@ -16,8 +16,6 @@
    <%= form_with model: @collection, class: "flex flex-column gap txt-large", data: { controller: "form" } do |form| %>
    - <%= translation_button(:collection_name) %> -
    From 0a472f29d5d82eff46b121518ce5460fc443f61b Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 09:16:30 -0500 Subject: [PATCH 36/45] Arrow needs to match derived color --- app/assets/stylesheets/cards.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/cards.css b/app/assets/stylesheets/cards.css index 4a5e318d7..742d8ea94 100644 --- a/app/assets/stylesheets/cards.css +++ b/app/assets/stylesheets/cards.css @@ -266,7 +266,7 @@ &::after { aspect-ratio: var(--aspect-ratio); - background: var(--color-container); + background: color-mix(in srgb, var(--card-color) 33%, var(--color-bg)); clip-path: polygon(50% 100%, 100% 0, 0 0); inline-size: var(--arrow-size); content: ""; From 84276e85ba4368131b67723e14bc5cfdc25a15a8 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 09:43:09 -0500 Subject: [PATCH 37/45] Ensure overflow cards are hidden --- app/assets/stylesheets/trays.css | 1 + app/helpers/notifications_helper.rb | 2 +- app/views/my/pins/_pin.html.erb | 2 +- 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/app/assets/stylesheets/trays.css b/app/assets/stylesheets/trays.css index cad63dcec..e60631c08 100644 --- a/app/assets/stylesheets/trays.css +++ b/app/assets/stylesheets/trays.css @@ -22,6 +22,7 @@ --scale: calc(1 - var(--position) / 30); --z: calc(6 - var(--position)); + display: flex; inset: auto 0 0; inline-size: var(--tray-size); outline: 0; diff --git a/app/helpers/notifications_helper.rb b/app/helpers/notifications_helper.rb index 3c5e0d680..12bc5f745 100644 --- a/app/helpers/notifications_helper.rb +++ b/app/helpers/notifications_helper.rb @@ -22,7 +22,7 @@ module NotificationsHelper end def notification_tag(notification, &) - tag.div id: dom_id(notification), class: "notification tray__item border-radius flex txt-normal" do + tag.div id: dom_id(notification), class: "notification tray__item border-radius txt-normal" do concat( link_to(notification.resource, class: "notification__content border-radius shadow fill-white flex align-start txt-align-start gap flex-item-grow max-width border txt-ink", diff --git a/app/views/my/pins/_pin.html.erb b/app/views/my/pins/_pin.html.erb index a1d0701c8..2a3e35689 100644 --- a/app/views/my/pins/_pin.html.erb +++ b/app/views/my/pins/_pin.html.erb @@ -1,5 +1,5 @@ <% cache pin do %> - <%= tag.div id: dom_id(pin), class: "pin tray__item flex txt-normal" do %> + <%= tag.div id: dom_id(pin), class: "pin tray__item txt-normal" do %> <%= link_to collection_card_path(pin.card.collection, pin.card), class: "pin__content shadow fill-white flex align-start txt-align-start gap flex-item-grow max-width border border-radius txt-ink overflow-clip", data: { action: "click->dialog#close", turbo_frame: "_top" }, From e0a654961067697f0cf24bb6d0e7967275ea58e9 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 09:45:18 -0500 Subject: [PATCH 38/45] Seen cards should be flat --- app/assets/stylesheets/notifications.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/notifications.css b/app/assets/stylesheets/notifications.css index 45eb46929..ccf164a79 100644 --- a/app/assets/stylesheets/notifications.css +++ b/app/assets/stylesheets/notifications.css @@ -48,7 +48,7 @@ .notificiations-list--read & { --border-color: var(--color-subtle); - box-shadow: none; + box-shadow: none !important; } } From b016c8a16528f56e28564a85e018514a9b376e12 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 09:58:11 -0500 Subject: [PATCH 39/45] Fix dot escaping container --- app/assets/stylesheets/notifications.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/app/assets/stylesheets/notifications.css b/app/assets/stylesheets/notifications.css index ccf164a79..d8779c2e6 100644 --- a/app/assets/stylesheets/notifications.css +++ b/app/assets/stylesheets/notifications.css @@ -1,4 +1,8 @@ @layer components { + .notification { + position: relative; + } + .notification-tray { inset: auto var(--inline-space) var(--block-space-half) auto; From f3495fa731bf64222937f11b238e74ec7e964acf Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 10:41:26 -0500 Subject: [PATCH 40/45] Restore comment action icon --- app/assets/images/comment.svg | 1 + app/assets/stylesheets/icons.css | 1 + 2 files changed, 2 insertions(+) create mode 100644 app/assets/images/comment.svg diff --git a/app/assets/images/comment.svg b/app/assets/images/comment.svg new file mode 100644 index 000000000..2cc709702 --- /dev/null +++ b/app/assets/images/comment.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/stylesheets/icons.css b/app/assets/stylesheets/icons.css index 9489ed184..459c4c894 100644 --- a/app/assets/stylesheets/icons.css +++ b/app/assets/stylesheets/icons.css @@ -31,6 +31,7 @@ .icon--caret-down { --svg: url("caret-down.svg "); } .icon--check { --svg: url("check.svg "); } .icon--close { --svg: url("close.svg "); } + .icon--comment { --svg: url("comment.svg "); } .icon--copy-paste { --svg: url("copy-paste.svg "); } .icon--crown { --svg: url("crown.svg "); } .icon--email { --svg: url("email.svg "); } From 1387ad2581533f9ccc56211d1ae8adca3a0cac24 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 11:06:55 -0500 Subject: [PATCH 41/45] Sort Considering and Doing by `updated_at` --- app/controllers/cards_controller.rb | 4 ++-- app/models/card.rb | 2 ++ app/models/filter/fields.rb | 4 ++-- 3 files changed, 6 insertions(+), 4 deletions(-) diff --git a/app/controllers/cards_controller.rb b/app/controllers/cards_controller.rb index d0b751613..103c05e99 100644 --- a/app/controllers/cards_controller.rb +++ b/app/controllers/cards_controller.rb @@ -9,8 +9,8 @@ class CardsController < ApplicationController PAGE_SIZE = 50 def index - @considering = page_and_filter_for @filter.with(engagement_status: "considering"), per_page: PAGE_SIZE - @doing = page_and_filter_for @filter.with(engagement_status: "doing"), per_page: PAGE_SIZE + @considering = page_and_filter_for @filter.with(engagement_status: "considering", indexed_by: "latest"), per_page: PAGE_SIZE + @doing = page_and_filter_for @filter.with(engagement_status: "doing", indexed_by: "latest"), per_page: PAGE_SIZE @closed = page_and_filter_for @filter.with(indexed_by: "closed"), per_page: PAGE_SIZE end diff --git a/app/models/card.rb b/app/models/card.rb index c58507125..4c50d6029 100644 --- a/app/models/card.rb +++ b/app/models/card.rb @@ -15,6 +15,7 @@ class Card < ApplicationRecord scope :reverse_chronologically, -> { order created_at: :desc, id: :desc } scope :chronologically, -> { order created_at: :asc, id: :asc } + scope :latest, -> { order updated_at: :desc, id: :desc } scope :in_collection, ->(collection) { where collection: collection } scope :indexed_by, ->(index) do @@ -24,6 +25,7 @@ class Card < ApplicationRecord when "most_boosted" then ordered_by_boosts when "newest" then reverse_chronologically when "oldest" then chronologically + when "latest" then latest when "stalled" then ordered_by_staleness when "closed" then closed end diff --git a/app/models/filter/fields.rb b/app/models/filter/fields.rb index ce284b398..e6028e551 100644 --- a/app/models/filter/fields.rb +++ b/app/models/filter/fields.rb @@ -1,13 +1,13 @@ module Filter::Fields extend ActiveSupport::Concern - INDEXES = %w[ most_discussed most_boosted newest oldest stalled ] + INDEXES = %w[ most_discussed most_boosted newest oldest latest stalled ] delegate :default_value?, to: :class class_methods do def default_values - { indexed_by: "most_active" } + { indexed_by: "latest" } end def default_value?(key, value) From 296ac0c8b54d76ea99e33f73e721f1dab2c5f55d Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 11:07:22 -0500 Subject: [PATCH 42/45] Remove sorting filter UI --- app/assets/images/sort-ascending.svg | 1 - app/assets/images/sort-descending.svg | 1 - app/assets/stylesheets/icons.css | 2 -- app/views/cards/index/_header.html.erb | 2 -- app/views/cards/index/_sorting_options.html.erb | 14 -------------- 5 files changed, 20 deletions(-) delete mode 100644 app/assets/images/sort-ascending.svg delete mode 100644 app/assets/images/sort-descending.svg delete mode 100644 app/views/cards/index/_sorting_options.html.erb diff --git a/app/assets/images/sort-ascending.svg b/app/assets/images/sort-ascending.svg deleted file mode 100644 index 0c4767d23..000000000 --- a/app/assets/images/sort-ascending.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/images/sort-descending.svg b/app/assets/images/sort-descending.svg deleted file mode 100644 index cadc3129c..000000000 --- a/app/assets/images/sort-descending.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/assets/stylesheets/icons.css b/app/assets/stylesheets/icons.css index 459c4c894..1f3d193dc 100644 --- a/app/assets/stylesheets/icons.css +++ b/app/assets/stylesheets/icons.css @@ -61,8 +61,6 @@ .icon--rename { --svg: url("rename.svg "); } .icon--settings { --svg: url("settings.svg "); } .icon--share { --svg: url("share.svg "); } - .icon--sort-ascending { --svg: url("sort-ascending.svg "); } - .icon--sort-descending { --svg: url("sort-descending.svg "); } .icon--star { --svg: url("star.svg "); } .icon--tag { --svg: url("tag.svg "); } .icon--thumb-up { --svg: url("thumb-up.svg "); } diff --git a/app/views/cards/index/_header.html.erb b/app/views/cards/index/_header.html.erb index ca0db0cc6..5263d9551 100644 --- a/app/views/cards/index/_header.html.erb +++ b/app/views/cards/index/_header.html.erb @@ -18,8 +18,6 @@ <%= render "cards/index/collections_filter", filter: filter %>
    - - <%= render "cards/index/sorting_options", filter: filter %> <% if collection = filter.single_collection %> diff --git a/app/views/cards/index/_sorting_options.html.erb b/app/views/cards/index/_sorting_options.html.erb deleted file mode 100644 index 9f88b4902..000000000 --- a/app/views/cards/index/_sorting_options.html.erb +++ /dev/null @@ -1,14 +0,0 @@ -
    - <%= form_with url: cards_path, method: :get do |form| %> - <% filter.as_params.except(:indexed_by).each do |key, value| %> - <%= filter_hidden_field_tag key, value %> - <% end %> - - <%= form.hidden_field :indexed_by, value: filter.indexed_by == "oldest" ? "newest" : "oldest" %> - - - <% end %> -
    From 7fdf9ab2fd81fc1ef3511d634e80398325535b80 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 14:39:19 -0500 Subject: [PATCH 43/45] Move `title` to the `img` element so we get hover in both cases --- app/helpers/avatars_helper.rb | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/helpers/avatars_helper.rb b/app/helpers/avatars_helper.rb index 2a6d927f4..732825572 100644 --- a/app/helpers/avatars_helper.rb +++ b/app/helpers/avatars_helper.rb @@ -11,7 +11,7 @@ module AvatarsHelper end def avatar_tag(user, hidden_for_screen_reader: false, **options) - link_to user_path(user), title: user.name, class: "btn avatar", data: { turbo_frame: "_top" }, + link_to user_path(user), class: "btn avatar", data: { turbo_frame: "_top" }, aria: { hidden: hidden_for_screen_reader, label: user.name }, tabindex: hidden_for_screen_reader ? -1 : nil do avatar_image_tag(user, **options) @@ -19,6 +19,6 @@ module AvatarsHelper end def avatar_image_tag(user, **options) - image_tag user_avatar_path(user), aria: { hidden: "true" }, size: 48, class: ("avatar__photo" if user.avatar.attached?), **options + image_tag user_avatar_path(user), aria: { hidden: "true" }, size: 48, title: user.name, class: ("avatar__photo" if user.avatar.attached?), **options end end From e4110734eb71a138259d3fff022898f2c84885d0 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Thu, 10 Apr 2025 14:39:50 -0500 Subject: [PATCH 44/45] Rework min card design and meta section for all cards --- app/assets/stylesheets/cards.css | 34 +++++++------- app/helpers/users_helper.rb | 6 +++ .../cards/assignments/create.turbo_stream.erb | 2 +- app/views/cards/display/_mini.html.erb | 25 ++++++----- app/views/cards/display/_perma.html.erb | 1 - app/views/cards/display/_preview.html.erb | 3 +- app/views/cards/display/common/_meta.html.erb | 44 ++++++++++--------- .../cards/display/common/_people.html.erb | 12 ----- app/views/cards/display/mini/_meta.html.erb | 3 ++ .../cards/display/perma/_boosts.html.erb | 3 -- app/views/cards/display/perma/_meta.html.erb | 2 +- .../cards/display/perma/_people.html.erb | 3 -- .../cards/display/preview/_boosts.html.erb | 8 ---- .../cards/display/preview/_meta.html.erb | 2 +- 14 files changed, 68 insertions(+), 80 deletions(-) delete mode 100644 app/views/cards/display/common/_people.html.erb create mode 100644 app/views/cards/display/mini/_meta.html.erb delete mode 100644 app/views/cards/display/perma/_boosts.html.erb delete mode 100644 app/views/cards/display/perma/_people.html.erb delete mode 100644 app/views/cards/display/preview/_boosts.html.erb diff --git a/app/assets/stylesheets/cards.css b/app/assets/stylesheets/cards.css index 742d8ea94..55f3d88d6 100644 --- a/app/assets/stylesheets/cards.css +++ b/app/assets/stylesheets/cards.css @@ -25,31 +25,26 @@ --text-small: 1.1em; aspect-ratio: unset; + border: 1px solid var(--color-subtle) !important; line-height: 1.2; - padding: calc(var(--block-space) * 1.5) var(--block-space); + padding: 0; margin: var(--block-space) auto calc(var(--block-space) * 1.5); + @media (prefers-color-scheme: dark) { + border-color: var(--color-subtle-dark) !important; + } + .card__title { margin-block-start: 0.1em; min-block-size: 0; } - .card__stuff { - .avatar { - block-size: 2em; - inline-size: 2em; - margin: 0; - } - } - .card__body { padding-inline: 0; - } - .avatar { - block-size: 3em; - inline-size: 3em; - margin-block-start: -0.2em; + .card--mini & { + padding: 0 var(--inline-space-double) var(--block-space); + } } .card__tags { @@ -91,6 +86,11 @@ font-weight: bold; } + .avatar { + block-size: 2.75em; + inline-size: 2.75em; + } + @media (prefers-color-scheme: dark) { --border-color: var(--color-subtle-dark); --border-size: 1px; @@ -393,7 +393,7 @@ --border-size: 1px; --row-gap: 0.25em; - margin-inline-start: var(--inline-space-double); + margin-inline: var(--inline-space-double); strong { font-weight: 900; @@ -402,6 +402,10 @@ .separator { height: calc(2lh + 2ex); } + + .card--mini & { + margin-inline-start: 0; + } } .card__move-button { diff --git a/app/helpers/users_helper.rb b/app/helpers/users_helper.rb index 58b3e12d6..e0a2c4422 100644 --- a/app/helpers/users_helper.rb +++ b/app/helpers/users_helper.rb @@ -2,4 +2,10 @@ module UsersHelper def prepend_current_user_to(users_scope) users_scope.to_a.prepend(Current.user).uniq end + + def familiar_name_for(user) + names = user.name.split + return user.name if names.length == 1 + "#{names.first} #{names[1..].map { |n| "#{n[0]}." }.join}" + end end diff --git a/app/views/cards/assignments/create.turbo_stream.erb b/app/views/cards/assignments/create.turbo_stream.erb index d66721e4b..f05f15d8d 100644 --- a/app/views/cards/assignments/create.turbo_stream.erb +++ b/app/views/cards/assignments/create.turbo_stream.erb @@ -1 +1 @@ -<%= turbo_stream.replace([ @card, :assignees ], partial: "cards/display/perma/assignees", locals: { card: @card }) %> +<%= turbo_stream.replace([ @card, :meta ], partial: "cards/display/perma/meta", locals: { card: @card }) %> diff --git a/app/views/cards/display/_mini.html.erb b/app/views/cards/display/_mini.html.erb index 0fd3892f0..2dd1ff438 100644 --- a/app/views/cards/display/_mini.html.erb +++ b/app/views/cards/display/_mini.html.erb @@ -1,19 +1,20 @@ -
    - <%= avatar_image_tag card.creator, class: "avatar" %> +
    +
    + + <%= card.collection.name %> + + +
    <%= render "cards/display/mini/tags", card: card %>
    +
    -

    - <%= card_title(card) %> -

    - -
    <%= "Added to #{card.collection.name} by #{card.creator.name}" %> - <%= local_datetime_tag(card.created_at, style: :daysago) %> +
    +

    + <%= card_title(card) %> +

    -
    - <%= render "cards/display/mini/assignees", card: card %> -
    <%= render "cards/display/mini/tags", card: card %>
    -
    + <%= render "cards/display/mini/meta", card: card %>
    <%= link_to collection_card_path(card.collection, card), class: "card__link" do %> diff --git a/app/views/cards/display/_perma.html.erb b/app/views/cards/display/_perma.html.erb index 4b205e33b..814387565 100644 --- a/app/views/cards/display/_perma.html.erb +++ b/app/views/cards/display/_perma.html.erb @@ -35,7 +35,6 @@
    - <%= render "cards/display/perma/people", card: card %> <%= render "cards/display/perma/meta", card: card %>
    diff --git a/app/views/cards/display/_preview.html.erb b/app/views/cards/display/_preview.html.erb index 035c72e58..d7ac89149 100644 --- a/app/views/cards/display/_preview.html.erb +++ b/app/views/cards/display/_preview.html.erb @@ -21,8 +21,7 @@ <%= render "cards/stagings/stages", card: card if card.doing? %>
    -