Use proper tags, adjust spacing, reset list height
This commit is contained in:
@@ -1,7 +1,8 @@
|
||||
.users-list {
|
||||
max-block-size: 40dvh;
|
||||
overflow: auto;
|
||||
padding-block: 1ch;
|
||||
--btn-size: 4ch;
|
||||
--avatar-size: var(--btn-size);
|
||||
|
||||
inline-size: 100%;
|
||||
|
||||
li + li {
|
||||
margin-block-start: 1ch;
|
||||
|
||||
@@ -191,17 +191,7 @@
|
||||
/* Lists */
|
||||
:where(.list-style-none) {
|
||||
margin: 0 auto;
|
||||
min-inline-size: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
display: block;
|
||||
margin: 0;
|
||||
max-inline-size: 100%;
|
||||
min-inline-size: 0;
|
||||
padding: 0;
|
||||
text-align: start;
|
||||
}
|
||||
}
|
||||
|
||||
/* Accessibility */
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
<li class="flex align-center gap-half pad-inline" data-filter-target="item">
|
||||
<%= avatar_tag user, hidden_for_screen_reader: true %>
|
||||
|
||||
<strong class="overflow-ellipsis">
|
||||
<%= link_to user.name, user, class: "txt-ink btn btn--plain" %>
|
||||
</strong>
|
||||
<li class="flex align-center gap-half" data-filter-target="item">
|
||||
<%= link_to user, class: "txt-ink flex gap-half align-center min-width" do %>
|
||||
<%= avatar_preview_tag user, hidden_for_screen_reader: true %>
|
||||
<strong class="overflow-ellipsis"><%= user.name %></strong>
|
||||
<% end %>
|
||||
|
||||
<hr class="separator--horizontal flex-item-grow" style="--border-color: var(--color-ink-medium); --border-style: dashed" aria-hidden="true">
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="panel shadow center flex flex-column">
|
||||
<strong class="divider txt-large">Do or Die</strong>
|
||||
<div class="panel shadow center flex flex-column gap">
|
||||
<h2 class="divider txt-large">Do or Die</h2>
|
||||
<p class="margin-none-block-start">Choose default settings for this account. You can override them in individual collections.</p>
|
||||
<%= render "entropy/auto_close", model: account.default_entropy_configuration, url: account_entropy_configuration_path %>
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,10 @@
|
||||
<div class="panel shadow center flex flex-column">
|
||||
<strong class="divider txt-large margin-block-end">People on the account</strong>
|
||||
<div class="panel shadow center flex flex-column gap" data-controller="filter">
|
||||
<h2 class="divider txt-large">People on the account</h2>
|
||||
<%#= render "accounts/invite" # Scheduled work in https://3.basecamp.com/2914079/buckets/37331921/todos/8746162337 %>
|
||||
|
||||
<div class="flex flex-column" data-controller="filter">
|
||||
<input placeholder="Filter…" class="input input--transparent full-width" type="search" autocorrect="off" autocomplete="off" data-1p-ignore="true" data-filter-target="input" data-action="input->filter#filter">
|
||||
<input placeholder="Filter…" class="input input--transparent full-width" type="search" autocorrect="off" autocomplete="off" data-1p-ignore="true" data-filter-target="input" data-action="input->filter#filter">
|
||||
|
||||
<div data-filter-target="list" class="users-list">
|
||||
<%= render partial: "accounts/user", collection: users %>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="users-list list-style-none" data-filter-target="list">
|
||||
<%= render partial: "accounts/user", collection: users %>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user