buttons: Redesign some old-style buttons with rounded class.

Fixes part of #35006.
This commit is contained in:
Maneesh Shukla
2025-07-04 15:45:00 +05:30
committed by Tim Abbott
parent 9de1b47ffa
commit 3bd8c28fca
8 changed files with 45 additions and 19 deletions

View File

@@ -1337,17 +1337,23 @@ div.settings-radio-input-parent {
}
.stream-settings-color-selector {
border: 1px solid var(--color-border-zulip-button);
display: flex;
align-items: center;
gap: 10px;
overflow: hidden;
&.action-button-quiet-neutral {
box-shadow: none;
}
}
.stream-settings-color-preview {
/* 33px at 12.8 font size (from .button.small) at 14px em */
width: 2.5781em;
height: 2.5781em;
margin: -6px 0 -6px -10px;
/* 28px at 16px font size */
width: 1.75em;
height: 1.75em;
/* -6px 0 -6px 10px at 16px font size. */
margin: -0.375em 0 -0.375em -0.625em;
}
#subscription_overlay .channel-folder-widget-container {

View File

@@ -331,10 +331,18 @@ p.n-margin {
}
.exit-me {
font-size: 20pt;
font-weight: 200;
margin: 0 0 0 10px;
cursor: pointer;
margin: 0 0 0 5px;
}
.float-header {
display: flex;
align-items: center;
}
.feedback-button-container {
display: flex;
align-items: center;
margin-left: auto;
}
}

View File

@@ -21,9 +21,9 @@
<div class="delete-selected-drafts-button-container">
{{> ./components/icon_button intent="danger" custom_classes="delete-selected-drafts-button" icon="trash" disabled=true }}
</div>
<button class="button small rounded select-drafts-button" role="checkbox" aria-checked="false">
<button class="action-button action-button-quiet-neutral select-drafts-button" role="checkbox" aria-checked="false">
<span>{{t "Select all drafts" }}</span>
<i class="fa fa-square-o fa-lg select-state-indicator" aria-hidden="true"></i>
<i class="fa fa-square-o select-state-indicator" aria-hidden="true"></i>
</button>
</div>
</div>

View File

@@ -1,9 +1,11 @@
<div class="float-header">
<h3 class="light no-margin small-line-height float-left feedback_title"></h3>
<div class="exit-me float-right">&#215;</div>
<div class="feedback-button-container">
{{#if has_undo_button}}
<button class="button small rounded float-right feedback_undo" type="button" name="button"></button>
{{> components/action_button intent="neutral" attention="quiet" custom_classes="feedback_undo"}}
{{/if}}
{{> ./components/icon_button intent="neutral" custom_classes="exit-me" icon="close"}}
</div>
<div class="float-clear"></div>
</div>
<p class="n-margin feedback_content"></p>

View File

@@ -31,7 +31,12 @@
<table class="profile_field_choices_table">
<tbody id="profile_field_choices" class="profile-field-choices"></tbody>
</table>
<button type="button" class="button white rounded alphabetize-choices-button">{{t "Alphabetize choices" }}</button>
{{> ../components/action_button
label=(t "Alphabetize choices")
custom_classes="alphabetize-choices-button"
intent="neutral"
attention="quiet"
}}
</div>
<div class="input-group" id="custom_external_account_url_pattern">
<label for="custom_field_url_pattern" class="modal-field-label">{{t "URL pattern" }}</label>

View File

@@ -18,7 +18,12 @@
{{/each}}
</div>
</div>
<button type="button" class="button white rounded alphabetize-choices-button">{{t "Alphabetize choices" }}</button>
{{> ../components/action_button
label=(t "Alphabetize choices")
custom_classes="alphabetize-choices-button"
intent="neutral"
attention="quiet"
}}
</div>
{{else if is_external_account_field}}
<div class="prop-element" id="id-custom-profile-field-field-data" data-setting-widget-type="field-data-setting">

View File

@@ -40,8 +40,8 @@
<div class="input-group hide" id="integrations-event-container">
<label for="integrations-event-options">{{t "Events to include:"}}</label>
<div class="integration-all-events-buttons">
<button class="button rounded" id="add-all-integration-events">{{t "Check all"}}</button>
<button class="button rounded" id="remove-all-integration-events">{{t "Uncheck all"}}</button>
{{> ../components/action_button attention="quiet" intent="neutral" id="add-all-integration-events" label=(t "Check all") }}
{{> ../components/action_button attention="quiet" intent="neutral" id="remove-all-integration-events" label=(t "Uncheck all") }}
</div>
<div id="integrations-event-options"></div>
</div>

View File

@@ -152,7 +152,7 @@
{{/each}}
<div class="input-group">
<label class="settings-field-label channel-color-label">{{t "Channel color" }}</label>
<button class="button small rounded stream-settings-color-selector choose_stream_color" data-stream-id="{{ sub.stream_id }}">
<button class="action-button action-button-quiet-neutral stream-settings-color-selector choose_stream_color" data-stream-id="{{ sub.stream_id }}">
<span class="stream-settings-color-preview" style="background: {{sub.color}};"></span>
<span class="stream-settings-color-selector-label">{{t "Change color"}}</span>
</button>