better UI on hq app authorizations#new

This commit is contained in:
24c02 2026-03-24 16:38:12 -04:00
parent aba5b912e3
commit 469736a68f
2 changed files with 23 additions and 13 deletions

View file

@ -5,8 +5,8 @@
.oauth-official-byline {
font-size: 0.875rem;
color: var(--text-muted-strong);
text-align: center;
color: var(--text-muted);
margin: 0.25rem 0 0;
}
.oauth-permissions {
@ -26,19 +26,25 @@
}
// collapsed variant for hq official apps
&[open] summary {
text-align: center;
&[open] > summary {
margin-bottom: 1rem;
}
> summary {
font-size: 0.8125rem;
font-weight: 500;
color: var(--text-muted-strong);
color: var(--text-muted);
cursor: pointer;
display: flex;
display: inline-flex;
align-items: center;
gap: 0.375rem;
list-style-type: none;
padding: 0.375rem 0.875rem;
border: 1px solid var(--surface-2-border);
border-radius: 999px;
background: var(--surface-2);
transition: background 0.15s ease;
&::-webkit-details-marker,
&::marker {
@ -53,12 +59,17 @@
&::before {
content: "";
font-size: 1rem;
font-weight: 600;
line-height: 1;
transition: transform 0.15s ease;
}
&:hover {
background: var(--surface-1);
}
}
&[open] summary::before {
&[open] > summary::before {
transform: rotate(90deg);
}
}

View file

@ -20,14 +20,13 @@
<small>
<%= raw t('.prompt', client_name: content_tag(:strong) { @pre_auth.client.name }) %>
</small>
<% if application&.hq_official? %>
<p class="oauth-official-byline">
<%= t('.official_byline', byline: application.byline.presence || t('.official_byline_default')) %>
</p>
<% end %>
</header>
<% if application&.hq_official? %>
<div class="oauth-official-byline">
<%= t('.official_byline', byline: application.byline.presence || t('.official_byline_default')) %>
</div>
<% end %>
<% if @pre_auth.scopes.count > 0 %>
<%
scopes = @pre_auth.scopes.map(&:to_s)