Merge pull request #1584 from basecamp/andy-13-nov-a

Andy 13 nov a
This commit is contained in:
Andy Smith
2025-11-13 14:43:12 -06:00
committed by GitHub
19 changed files with 73 additions and 58 deletions
+2 -2
View File
@@ -73,11 +73,11 @@
--z-events-column-header: 1;
--z-events-day-header: 3;
--z-flash: 12;
--z-nav: 11;
--z-popup: 10;
--z-terminal: 20;
--z-tray: 21;
--z-tooltip: 30;
--z-nav: 30;
--z-tooltip: 40;
/* OKLCH colors: Fixed */
--lch-black: 0% 0 0;
+1
View File
@@ -16,6 +16,7 @@
font-family: var(--font-sans);
interpolate-size: allow-keywords;
line-height: 1.375;
max-inline-size: 100vw;
scroll-behavior: auto;
text-rendering: optimizeLegibility;
text-size-adjust: none;
+20
View File
@@ -199,6 +199,26 @@
}
}
.btn--back {
--btn-border-size: 0;
font-size: var(--text-medium);
@media (max-width: 639px) {
padding: 0.5em;
strong, kbd {
display: none;
}
}
@media (min-width: 640px) {
.icon--arrow-left {
display: none;
}
}
}
/* Button groups
/* ------------------------------------------------------------------------ */
+2 -3
View File
@@ -45,8 +45,7 @@
min-block-size: 20lh;
}
/* Hide on small, fat-finger touch devices */
@media (hover: none) and (pointer: coarse) and (max-width: 519px) {
@media (max-width: 519px) {
display: none;
}
}
@@ -748,7 +747,7 @@
padding-inline: 3vw;
/* Hide on larger devices with cursors */
@media (hover: hover) and (min-width: 520px) {
@media (min-width: 520px) {
display: none;
}
+2
View File
@@ -3,6 +3,8 @@
/* ------------------------------------------------------------------------ */
.header--events {
--header-button-count: 1;
@media (min-width: 640px) {
--header-actions-width: 7.25rem !important;
}
+17
View File
@@ -91,4 +91,21 @@
margin-inline-end: 0.8ch;
}
}
/* Optional class to stack header actions on small screens
/* ------------------------------------------------------------------------ */
/* .header--mobile-actions-stack {
@media (max-width: 639px) {
grid-template-columns: 1fr 1fr;
grid-template-areas:
"menu menu"
"actions-start actions-end"
"title title";
.header__title {
margin-block-start: 0.25rem;
}
}
} */
}
+6
View File
@@ -15,4 +15,10 @@ module ApplicationHelper
return File.read(file_path).html_safe if File.exist?(file_path)
"(not found)"
end
def back_link_to(label, url, action, **options)
link_to url, class: "btn btn--back", data: { controller: "hotkey", action: action }, **options do
icon_tag("arrow-left") + tag.strong("Back to #{label}", class: "overflow-ellipsis") + tag.kbd("", class: "txt-x-small hide-on-touch").html_safe
end
end
end
+1 -4
View File
@@ -1,9 +1,6 @@
module BoardsHelper
def link_back_to_board(board)
link_to board, class: "btn borderless txt-medium",
data: { controller: "hotkey", action: "keydown.left@document->hotkey#click click->turbo-navigation#backIfSamePath" } do
tag.span(tag.strong("Back to #{board.name}", class: "overflow-ellipsis") + tag.kbd("", class: "txt-x-small margin-inline-start hide-on-touch"), class: "flex align-center").html_safe
end
back_link_to board.name, board, "keydown.left@document->hotkey#click click->turbo-navigation#backIfSamePath"
end
def link_to_edit_board(board)
@@ -1,4 +1,4 @@
<% @page_title = "Column: Closed" %>
<% @page_title = "Column: Done" %>
<% content_for :header do %>
<div class="header__actions header__actions--start">
@@ -1,4 +1,4 @@
<% @page_title = "Column: Now now" %>
<% @page_title = "Column: Not Now" %>
<% content_for :header do %>
<div class="header__actions header__actions--start">
+3 -1
View File
@@ -1,5 +1,5 @@
<% @page_title = "Home" %>
<% @header_class = "header--events" %>
<% @header_class = "header--events header--mobile-actions-stack" %>
<%= render "cards/broadcasts", filter: @filter %>
@@ -14,6 +14,8 @@
<%= render "events/index/filter", user_filtering: @user_filtering %>
<% end %>
</h1>
<%= render "events/index/add_board_button", user_filtering: @user_filtering %>
<% end %>
<%= tag.div id: "activity", class: "events", data: { controller: "pagination", pagination_paginate_on_intersection_value: true } do %>
@@ -0,0 +1,9 @@
<div class="header__actions header__actions--end">
<div>
<%= link_to new_board_path, class: "btn btn--link btn--circle-mobile", data: { controller: "hotkey", action: "keydown.b@document->hotkey#click" } do %>
<%= icon_tag "board", class: "show-on-touch" %>
<span class="overflow-ellipsis">Add a board</span>
<kbd class="hide-on-touch">B</kbd>
<% end %>
</div>
</div>
@@ -7,11 +7,3 @@
<% end %>
<% end %>
</div>
<div class="header__actions header__actions--end">
<%= link_to new_board_path, class: "btn btn--link btn--circle-mobile", data: { controller: "hotkey", action: "keydown.b@document->hotkey#click" } do %>
<%= icon_tag "board", class: "show-on-touch" %>
<span class="overflow-ellipsis">Add a board</span>
<kbd class="hide-on-touch">B</kbd>
<% end %>
</div>
@@ -1,13 +1,8 @@
<% @page_title = "Column: Closed" %>
<% @page_title = "Column: Done" %>
<% content_for :header do %>
<div class="header__actions header__actions--start">
<%= link_to published_board_url(@board), class: "btn borderless txt-medium", data: { controller: "hotkey", action: "keydown.left@document->hotkey#click" } do %>
<span class="flex align-center">
<strong class="overflow-ellipsis">Back to <%= @board.name %></strong>
<kbd class="txt-x-small hide-on-touch margin-inline-start">&larr;</kbd>
</span>
<% end %>
<%= back_link_to @board.name, published_board_url(@board), "keydown.left@document->hotkey#click" %>
</div>
<h1 class="header__title divider divider--fade full-width">
@@ -2,12 +2,7 @@
<% content_for :header do %>
<div class="header__actions header__actions--start">
<%= link_to published_board_url(@board), class: "btn borderless txt-medium", data: { controller: "hotkey", action: "keydown.left@document->hotkey#click" } do %>
<span class="flex align-center">
<strong class="overflow-ellipsis">Back to <%= @board.name %></strong>
<kbd class="txt-x-small hide-on-touch margin-inline-start">&larr;</kbd>
</span>
<% end %>
<%= back_link_to @board.name, published_board_url(@board), "keydown.left@document->hotkey#click" %>
</div>
<h1 class="header__title divider divider--fade full-width">
@@ -2,12 +2,7 @@
<% content_for :header do %>
<div class="header__actions header__actions--start">
<%= link_to published_board_url(@column.board), class: "btn borderless txt-medium", data: { controller: "hotkey", action: "keydown.left@document->hotkey#click" } do %>
<span class="flex align-center">
<strong class="overflow-ellipsis">Back to <%= @column.board.name %></strong>
<kbd class="txt-x-small hide-on-touch margin-inline-start">&larr;</kbd>
</span>
<% end %>
<%= back_link_to @column.board.name, published_board_url(@column.board), "keydown.left@document->hotkey#click" %>
</div>
<h1 class="header__title divider divider--fade full-width">
@@ -2,12 +2,7 @@
<% content_for :header do %>
<div class="header__actions header__actions--start">
<%= link_to published_board_url(@board), class: "btn borderless txt-medium", data: { controller: "hotkey", action: "keydown.left@document->hotkey#click" } do %>
<span class="flex align-center">
<strong class="overflow-ellipsis">Back to <%= @board.name %></strong>
<kbd class="txt-x-small hide-on-touch margin-inline-start">&larr;</kbd>
</span>
<% end %>
<%= back_link_to @board.name, published_board_url(@board), "keydown.left@document->hotkey#click" %>
</div>
<h1 class="header__title divider divider--fade full-width">
@@ -31,4 +26,4 @@
<% content_for :footer do %>
<%= render "public/footer" %>
<% end %>
<% end %>
+1 -6
View File
@@ -14,12 +14,7 @@
<% content_for :header do %>
<div class="header__actions header__actions--start">
<%= link_to published_board_url(@card.board), class: "btn borderless txt-medium", style: "view-transistion-name: card-board-title;", data: { controller: "hotkey", action: "keydown.left@document->hotkey#click" } do %>
<span class="overflow-ellipsis flex align-center">
<strong>Back to <%= @card.board.name %></strong>
<kbd class="txt-x-small margin-inline-start hide-on-touch">&larr;</kbd>
</span>
<% end %>
<%= back_link_to @card.board.name, published_board_url(@card.board), "keydown.left@document->hotkey#click", style: "view-transistion-name: card-board-title;" %>
</div>
<% end %>
+1 -6
View File
@@ -2,12 +2,7 @@
<% content_for :header do %>
<div class="header__actions header__actions--start">
<%= link_to @webhook, class: "btn borderless txt-medium", data: { controller: "hotkey", action: "keydown.left@document->hotkey#click" } do %>
<span class="overflow-ellipsis flex align-center">
<strong>Back to <%= @page_title %></strong>
<kbd class="txt-x-small margin-inline-start hide-on-touch">&larr;</kbd>
</span>
<% end %>
<%= back_link_to @page_title, @webhook, "keydown.left@document->hotkey#click" %>
</div>
<% end %>