0
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2026-08-05 10:42:34 +08:00
discourse/app/assets/stylesheets/common/components
Kris 665494fc53
DEV: simplify and use reuable components in invite modal, fix bug, (#42273)
We were creating some new conventions here instead of relying on
existing components. This gets the invite modal on more shared
components, reduces the custom css, and fixes the bug reported here:
https://meta.discourse.org/t/invite-restricted-cant-remove/409058

reusing existing components
- segment control 
- formkit conditional section
- advanced mode toggle  


Removed some redundant text: 
"invite people to join this site" — what else would you be inviting
people to?
"share a link or send an email invitation" – that's what the radio
options already indicate
"to invite a specific person, use email above" – that's implied by
"email"

before
<img width="600" alt="image"
src="https://github.com/user-attachments/assets/1cdb474c-e393-4066-854f-3b6d714b0195"
/>

after
<img width="600" alt="image"
src="https://github.com/user-attachments/assets/506229b7-88fe-437f-8a2d-db3618814c48"
/>


I've also triggered the success button on the copy button on the second
step, as an indication that the link has been copied successfully.

<img width="600" alt="image"
src="https://github.com/user-attachments/assets/52c9ef8d-94ea-4b11-923d-9e5745a7e53e"
/>


Changed the order here so the descriptions are associated with the
selection and below them (rather than being above them, which is awkward
for reading order)

Removed "invite people to join your staff team" which was redundant, the
roles describe what kind of access you're inviting — also elaborated a
little to make the full admin scope more apparent

before
<img width="600" alt="image"
src="https://github.com/user-attachments/assets/9f4684ec-b2d0-43d6-92b7-23dd27156f77"
/>


after
<img width="600" alt="image"
src="https://github.com/user-attachments/assets/b7af2317-21c4-4b0c-809a-c4ac13c218e3"
/>


Mobile also fits slightly better on the tiniest screens at 320px wide 

before
<img width="320" alt="image"
src="https://github.com/user-attachments/assets/11e61205-f3a6-4f68-a8ea-0c1ef75b9aa1"
/>

after
<img width="320" alt="image"
src="https://github.com/user-attachments/assets/b2caef7d-5562-452f-8d51-6c9af779a809"
/>
2026-08-03 15:31:55 -04:00
..
sidebar/edit-navigation-menu DEV: move desktop tags-modal CSS to common (#40802) 2026-06-11 14:10:20 -04:00
_index.scss FEATURE: Allow selection of multiple content languages when viewing topics and posts (#42128) 2026-07-30 12:19:44 +08:00
ace-editor.scss
add-pm-participants.scss DEV: remove old unused autocomplete CSS (#40848) 2026-06-15 09:17:02 -04:00
admin-onboarding-banner.scss UX: Style tweaks for wizard & onboarding banner (#41950) 2026-07-22 17:04:05 -05:00
autocomplete.scss UX: add unstyled-list mixin + replace (#41224) 2026-06-26 12:23:27 +02:00
badges.scss
banner.scss
bookmark-list.scss
bookmark-menu.scss
bookmark-modal.scss
bulk-topic-actions-manage-tags.scss
buttons.scss
calendar-date-time-input.scss
char-counter.scss
color-input.scss
composer-toggle-switch.scss
conditional-loading-section.scss
content-language-preferences-modal.scss FEATURE: Allow selection of multiple content languages when viewing topics and posts (#42128) 2026-07-30 12:19:44 +08:00
convert-to-public-topic-modal.scss
d-access-control.scss FEATURE: Support users in DAccessControl and backend (#41358) 2026-07-15 09:18:06 +10:00
d-autocomplete.scss
d-breadcrumbs.scss
d-combo-button.scss
d-filter-controls.scss FIX: Chat browse page on mobile (#42115) 2026-07-30 09:50:23 +10:00
d-icon-grid-picker.scss UX: various mondernized foundation style adjustments (#40808) 2026-06-11 17:53:39 -04:00
d-multi-select.scss FEATURE: Add workflow tags (#42056) 2026-07-27 17:22:42 +02:00
d-otp.scss FEATURE: User API key device authorization flow (#40189) 2026-06-10 16:09:44 -04:00
d-overflow-controls.scss UX: Indicate when the emoji picker category list is scrollable (#41858) 2026-07-21 11:18:35 -03:00
d-page-header.scss
d-post-accordion.scss
d-segmented-control.scss DEV: simplify and use reuable components in invite modal, fix bug, (#42273) 2026-08-03 15:31:55 -04:00
d-select.scss UX: improve admin filters, add to users and permalinks (#42029) 2026-07-24 17:04:26 -04:00
d-stat-tiles.scss
d-toggle-switch.scss
date-input.scss
date-picker.scss
date-range-picker.scss UX: Polish the admin dashboard date range picker calendar (#40598) 2026-06-08 13:38:22 +08:00
date-time-input-range.scss
date-time-input.scss
docked-composer.scss DEV: Add a dResizeEdge modifier and adopt it in the docked composer (#42200) 2026-07-31 12:57:25 -03:00
download-calendar.scss
drafts-dropdown-menu.scss DEV: move desktop draft dropdown css into common (#40765) 2026-06-11 10:05:52 -04:00
emoji-picker.scss UX: Indicate when the emoji picker category list is scrollable (#41858) 2026-07-21 11:18:35 -03:00
empty-states.scss UX: remove absolute positioning for tip in EmptyState (#42130) 2026-07-29 15:59:37 +02:00
expanding-text-area.scss UX: minor expanding textarea fixes (#40910) 2026-06-15 15:23:25 -04:00
feature-topic-modal.scss
file-size-input.scss
filter-input.scss
filter-navigation.scss
footer-nav.scss
form-template-field.scss
gifs.scss UX: gifs modal style improvements (#41766) 2026-07-16 14:56:55 +04:00
group-member-dropdown.scss
group-selector.scss
groups-form-membership-fields.scss UX: combine group visibility and access configuration (#40758) 2026-06-11 11:20:29 -04:00
hashtag.scss
header-search.scss DEV: move desktop header-search CSS to common file (#40801) 2026-06-11 13:53:25 -04:00
horizontal-overflow-nav.scss
iframed-html.scss
ignored-user-list.scss
keyboard_shortcuts.scss
load-more.scss
more-topics.scss UX: fix alignment of topic list header tab (#40655) 2026-06-08 15:04:11 -04:00
navs.scss
notifications-tracking.scss
offline-indicator.scss
pick-files-button.scss
post-list.scss
post-translations.scss UX: Allow user to set post and topic title language when manually creating post translations in modal (#41734) 2026-07-16 10:43:39 +08:00
powered-by-discourse.scss
relative-time-picker.scss UX: remove wrapping from relative time control (#41665) 2026-07-13 12:11:03 -04:00
signup-progress-bar.scss
site-skeleton.scss UX: Add horizon site skeleton to setup wizard (#40617) 2026-06-08 14:32:38 -07:00
svg.scss
table-layout.scss FEATURE: Category management UI for admins (#41218) 2026-07-15 09:17:25 +10:00
tap-tile.scss
theme-card-preview.scss
theme-card.scss
time-input.scss
time-shortcut-picker.scss
topic-map.scss UX: clean up topic map styles (#41343) 2026-07-01 12:30:37 -04:00
topic-query-filter.scss
user-card.scss DEV: merge desktop user-card CSS into common file (#40800) 2026-06-11 13:29:01 -04:00
user-info.scss DEV: move user-info desktop css to common (#40771) 2026-06-11 10:11:41 -04:00
user-status-message.scss
user-status-picker.scss
user-stream-item.scss DEV: move user-stream-item desktop css to common (#40772) 2026-06-11 09:31:50 -04:00
user-stream.scss
welcome-banner.scss
welcome-header.scss
widget-dropdown.scss