* Move mx_EventTile_highlight etc. out of mx_EventTile:not([data-layout=bubble])
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set highlight text color globally
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set 100% max-width to mx_DisambiguatedProfile on TimelineCard
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Unset the max-width value inside ReplyTile
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Revert "Prevent new composer from overflowing from non-breakable text (#8829)"
This reverts commit 57dff8131c.
* Revert "Fix scroll jump issue with the composer (#8791)"
This reverts commit 5167521ea4.
* Revert "Fix scroll jump issue with the composer (#8788)"
This reverts commit f568a76dc6.
* Revert "Revert link color change in composer (#8784)"
This reverts commit aedbeb2995.
* Revert "Improve composer visiblity (#8578)"
This reverts commit f14374a51c.
* Include descedants of mx_SettingsTab_section
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include descedants of mx_SettingsFlag
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use logical properties and variables
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include a descedant of mx_SettingsTab_heading
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove redundant declarations specified by default with _SettingsFlag.scss
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use not logical properties
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include a in mx_SettingsTab
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove margin from warning E2E icon between an avatar and a hidden event
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use a variable to ensure the same spacing around the E2E icon
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Apply the style to E2E icon
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Rename variables
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Implement searching for public rooms and users in new search experience
* Implement loading indicator for spotlight results
* Moved spotlight dialog into own subfolder
* Extract search result avatar into separate component
* Build generic new dropdown menu component
* Build new network menu based on new network dropdown component
* Switch roomdirectory to use new network dropdown
* Replace old networkdropdown with new networkdropdown
* Added component for public room result details
* Extract hooks and subcomponents from SpotlightDialog
* Create new hook to get profile info based for an mxid
* Add hook to automatically re-request search results
* Add hook to prevent out-of-order search results
* Extract member sort algorithm from InviteDialog
* Keep sorting for non-room results stable
* Sort people suggestions using sort algorithm from InviteDialog
* Add copy/copied tooltip for invite link option in spotlight
* Clamp length of topic for public room results
* Add unit test for useDebouncedSearch
* Add unit test for useProfileInfo
* Create cypress test cases for spotlight dialog
* Add test for useLatestResult to prevent out-of-order results
* Apply style declarations for mobile UI to modern layout, which breaks the current layout
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove the style declarations to restore the current layout
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Readd zero margin for event tile content
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove a comment
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Crude way of layering the waveform and seek bar
Not intended for production.
* Use a layout prop instead of something less descriptive
* Fix alignment properly, and play with styles
* Convert back to a ball
* Use `transparent` which makes NVDA happy enough
* Allow keyboards in the seek bar
* Try to make the clock behave more correctly with screen readers
MIDNIGHT
* Remove legacy export
* Remove redundant attr
* Appease the linter
* Remove all mentions of Piwik
* Kill off all consumer of the old Piwik Analytics module
* Simplify ModalManager interface
* i18n
* Attempt to fix old e2e tests
* Remove unused component
* Iterate PR
* Set the default margin between the debug button and the subsection texts
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove obsolete style rule for AccessibleButton
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove the special block margin setting from the reload button
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove obsolete class name - mx_HelpUserSettingsTab_versions
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Replace <br>s for spacing with a margin style declaration
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Replace <br> for spacing with a margin style declaration
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove <br>s for spacing
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Apply mx_SettingsTab_subsectionText to the credits list
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Apply spacing-16 instead of spacing-12
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Fix keyboard shortcuts being wrapped
Setting $spacing-8 gap between the labels and the shortcuts
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add the block margin to the rows, not to the keys
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add the inline margin to the shortcuts, not to the keys
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set min-width to prevent a flex blowout
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use a native spacing property
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set max-width: 100% to display name inside the image reply
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove blank header from video room view frame
* Add a beta card for video rooms
* Rename the 'disclaimer' on beta cards to 'FAQ'
Because that's what the section actually gets used as
* Add beta pills to video room creation buttons
* Remove duplicate tooltips from face piles
* Add beta pill to headers of video rooms
* Factor RoomInfoLine out of SpaceRoomView
* Factor RoomPreviewCard out of SpaceRoomView
* Adapt RoomPreviewCard for video rooms
* "New video room" → "Video room"
* Add comment about unused cases in RoomPreviewCard
* Add types
* Clarify !important comments
* Add a reload warning
* Fix the reload warning being the wrong way around
* Fix lints
* Make widgets in video rooms mutable again to de-risk future upgrades
* Ensure that the video channel exists when mounting VideoRoomView
* Fix lint
* Iterate beta reload warning
* Place room tiles with grid
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set padding inside of name stack
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove overflow:hidden (to be cancelled)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Replace text-align with margin
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Style invite failure dialog with display:grid
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Merge style rules of room tiles and tiles on invitation failure dialog
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Normalize avatar size for multiInviterError
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set text overflow with ellipsis
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use spacing variables
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set narrow gap to nameStack
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Rename mx_InviteDialog_inviterErrorTile_error
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Create mx_InviteDialog_tile
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set padding to room tiles only
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove space between name / userID and time (there is gap by default)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove the margin from the last child
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Refer mx_MessageActionBar on pinned messages card
Normalize mx_MessageActionBar style rules
- Allow the varaible (--MessageActionBar-size-button) to be used
- Remove redundant declarations
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use variables for normalization
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set class name
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Readd the comment
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use Heading size='h4'
- Use size='h4' instead of 'h2' as 15px has been specified as the font-size of the header
- Use logical values following _Heading.scss
- Remove line-height declaration in favor of the default value
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include mx_MessageActionBar_maskButton::after in mx_MessageActionBar_maskButton
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include mx_MessageActionBar_maskButton:hover::after in mx_MessageActionBar_maskButton
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Ensure buttons on message action bar used only with mx_MessageActionBar_maskButton as expected
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include mx_Indicator in mx_MessageActionBar_threadButton
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include mx_MessageActionBar_downloadButton.mx_MessageActionBar_downloadSpinnerButton in mx_MessageActionBar_downloadButton
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add support for MD / HTML in room topics
Setting MD / HTML supported:
- /topic command
- Room settings overlay
- Space settings overlay
Display of MD / HTML supported:
- /topic command
- Room header
- Space home
Based on extensible events as defined in [MSC1767]
Fixes: vector-im/element-web#5180
Signed-off-by: Johannes Marbach <johannesm@element.io>
[MSC1767]: matrix-org/matrix-spec-proposals#1767
* Fix build error
* Add comment to explain origin of styles
Co-authored-by: Travis Ralston <travpc@gmail.com>
* Empty commit to retrigger build
* Fix import grouping
* Fix useTopic test
* Add tests for HtmlUtils
* Add slash command test
* Add further serialize test
* Fix ternary formatting
Co-authored-by: Travis Ralston <travpc@gmail.com>
* Add blank line
Co-authored-by: Travis Ralston <travpc@gmail.com>
* Properly mock SettingsStore access
* Remove trailing space
* Assert on HTML content and add test for plain text in HTML parameter
* Appease the linter
* Fix JSDoc comment
* Fix toEqual call formatting
* Repurpose test for literal HTML case
* Empty commit to fix CI
Co-authored-by: Travis Ralston <travpc@gmail.com>
Co-authored-by: Travis Ralston <travisr@matrix.org>
* Remove obsolete declarations - border-radius of EventTile_line
The border-radius is specified with .mx_EventTile[data-shape="ThreadsList"]
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move declarations for ThreadSummary on Threadslist from _ThreadsPanel.scss to _EventTile.scss
To .mx_EventTile[data-shape=ThreadsList]
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* mx_ThreadPanel_replies block is used only on threads list after all
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* &::after and &::before
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set shorthand property and use variables
- Shorthand for inset property of border between threads
- Use variables
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Change 'ThreadPanel_ThreadsAmount' class name to 'ThreadPanel_replies_amount'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* specific to prevent regressions
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Improve the look of the `Message edits` dialog
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Left-align title
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Improve widet buttons behaviour and layout
Relates to vector-im/element-web#20506
See PSC-79
Signed-off-by: Michael Weimann <michaelw@matrix.org>
* Add AppTile tests
* Move mx_RoomView_MessageList h2 block from _GroupLayout.scss to _RoomView.scss
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move mx_MatrixChat_useCompactLayout block from _GroupLayout.scss to _EventTile.scss
This block is not related to the group layout.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include EventTile_continuation block in EventTile_emote
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use logical properties for the padding values
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Sort declarations for maintainability
- EventTile_avatar
- EventTile_line
- EventTile_reply
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Separate selectors of .markdown-body
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* fix: replace fixed height based styling with flex for invite and dev dialogs
* feat: create flex wrapper class for dialogs
* feat: make invite dialogs use flex layout
* feat: make devtools dialogs use flex layout
* Fix RR overflow on the right chat panel
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Align with RR outside of info tile
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use inset-inline property
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Change dot size from 10px to 8px
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Set inset 8px to the dot
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use shorthand properties for inset
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move blocks from '.mx_EventTile:not([data-layout=bubble])' to '.mx_EventTile[data-shape=ThreadsList]'
For a notification dot it does not matter whether the layout of the event tile is bubble or not. Instead what matters is that the dot is expected to be displayed on the threads list.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove redundant declarations
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove an obsolete z-index declaration
The declaration was added with ed34952 to fix a clickability issue. Now the event tile is clickable everywhere, it is no longer required.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
To respect the concept of cascading. Also using a mixin to unset the declarations can easily cause a style inconsistency.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Fix file button and audio player overflowing from message bubble
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move '.mx_EventTile_image' to '.mx_EventTile_mediaLine'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use class names for now, adding a TODO comment
Remove unset as it is no longer required.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* '.mx_EventTile_e2eIcon_warning' and '.mx_EventTile_e2eIcon_normal'
- Include '.mx_EventTile_e2eIcon_warning' and '.mx_EventTile_e2eIcon_normal'
- Merge '.mx_EventTile_e2eIcon_warning' and '.mx_EventTile_e2eIcon_normal'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* mx_EventTile_spoiler
- Group 'mx_EventTile_spoiler'
- mx_EventTile_spoiler.visible
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group 'mx_EventTile_button'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_collapseButton' and '.mx_EventTile_expandButton'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_body .mx_EventTile_pre_container'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_copyButton'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_collapseButton'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_expandButton'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_copyButton' and '.mx_EventTile_collapseButton'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Group '.mx_EventTile_collapseButton'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include '.mx_EventTile_collapsedCodeBlock' in '.mx_EventTile_pre_container'
Collapsed code block is displayed only in mx_EventTile_pre_container
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* .mx_EventTile_keyRequestInfo
- Include '.mx_EventTile_keyRequestInfo_text' in '.mx_EventTile_keyRequestInfo'
- Include '.mx_AccessibleButton' in '.mx_EventTile_keyRequestInfo_text'
- Include '.mx_EventTile_keyRequestInfo_tooltip_contents p:first-child' and 'p:last-child' in '.mx_EventTile_keyRequestInfo_tooltip_contents p'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Separate properties of mx_EventTile_button
The properties which should only be applied to buttons inside mx_EventTile_pre_container should not be applied to the top level.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Apply mask-size of collapse button and expand button to ones in mx_EventTile_pre_container only
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move declarations of buttons from mx_EventTile_button to mx_EventTile_pre_container
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move buttons declarations below mx_EventTile_button
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Include '.mx_EventTile_pre_container' in '.mx_EventTile_body .mx_EventTile_pre_container'
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Specify width and height to only buttons in mx_EventTile_pre_container
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Dedupe 'mx_EventTile_e2eIcon' ::before
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Hide buttons in mx_EventTile_pre_container and show them on hover by default
Setting "visibility: hidden" to mx_EventTile_button can easily cause a regression. The declaration should be exclusively applied to buttons inside mx_EventTile_pre_container, and "visibility: visible" should be set to those buttons only.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove redundant nestings for E2E icons
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Edit properties and values of EventTile on ThreadView
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove obsolete order properties of EventTile on ThreadView
These values are no longer required as the reactions row is displayed under the message by default.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add padding-right to EventTile_line in EventTile_info on TimelineCard
Also ensure the same padding values are applied to EventTile_line on TimelineCard.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove git diff
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Variable on mx_BaseCard_Header
- Use a variable for margin of buttons on mx_BaseCard_header
- Reduce default margin instead of setting negative left and right values
- Set margin to span in order to ensure spacing between the back button and the span (6px: 30px - 24px)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use the same variable to the mask button
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Use spacing variables
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove obsolete declarations - mx_ThreadPanel_button
mx_ThreadPanel_button does not seem to be used anywhere.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move declarations related to position from _MImageBody.scss to _EventTile.scss
These declarations should not be defined as default values as position depends on other factors such as layout, etc.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Move min-height and min-width declarations from _MImageBody.scss to _EventTile.scss
Since min-height and min-width have been specified for bubble layout, the declarations have been expected to be applied to the other layouts.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Apply 'justify-content: center' to bubble layout only
'justify-content: center' was added for the bubble layout with 1436f23. It should not be applied to the other layouts.
In order to prevent an issue related to cascading from happening, 'justify-content: flex-start' is explicitly specified.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* yarn run lint:style --fix
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add an option to ignore (block) a user when reporting their events
This is primarily useful if the content being reported really doesn't belong on your screen, and the room moderators are slow to react.
Ideally we'd use the word "block" instead of "ignore", but we call it "ignore user" everywhere else. See https://github.com/vector-im/element-web/issues/19590 for further context on the word choice.
This change includes a minor refactor to the styles of labelled toggles (for reusability).
* Appease the linter
* Use a checkbox instead of toggle in the dialog
* Update classnames handling for toggle switch
* Appease the linter