Fix visual bugs on AccessSecretStorageDialog (#8160)
* Remove duplicate mx_Dialog_buttons Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Group buttons on mx_Dialog with span - Cancel default styling for elements inside .mx_AccessSecretStorageDialog_primaryContainer Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Move common rules of mx_Dialog_buttons_row to _common.scss - Set 16px gap between buttons per https://github.com/vector-im/element-web/issues/19426#issuecomment-949778515 Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Spacing variables Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Nesting - .mx_AccessSecretStorageDialog_reset - Fix the reset link color - Set $spacingStart variable Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Remove unnecessary rule Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
This commit is contained in:
Suguru Hirahara
GitHub
parent
e2a612b070
commit
464eb93a44
5 changed files with 255 additions and 179 deletions
|
|
@ -245,19 +245,23 @@ Array [
|
|||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
<span
|
||||
class="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
@ -466,19 +470,23 @@ Array [
|
|||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
<span
|
||||
class="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
@ -815,22 +823,26 @@ Array [
|
|||
<div
|
||||
className="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
<span
|
||||
className="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</DialogButtons>
|
||||
</div>
|
||||
|
|
@ -1086,19 +1098,23 @@ Array [
|
|||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
<span
|
||||
class="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
@ -1307,19 +1323,23 @@ Array [
|
|||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
<span
|
||||
class="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
@ -1656,22 +1676,26 @@ Array [
|
|||
<div
|
||||
className="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
<span
|
||||
className="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</DialogButtons>
|
||||
</div>
|
||||
|
|
@ -1914,19 +1938,23 @@ Array [
|
|||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
<span
|
||||
class="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
@ -2135,19 +2163,23 @@ Array [
|
|||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
<span
|
||||
class="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
@ -2484,22 +2516,26 @@ Array [
|
|||
<div
|
||||
className="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
<span
|
||||
className="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</DialogButtons>
|
||||
</div>
|
||||
|
|
@ -2833,22 +2869,26 @@ Array [
|
|||
<div
|
||||
className="mx_Dialog_buttons"
|
||||
>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
<span
|
||||
className="mx_Dialog_buttons_row"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
<button
|
||||
data-test-id="dialog-cancel-button"
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
className="mx_Dialog_primary"
|
||||
data-test-id="dialog-primary-button"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Export
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</DialogButtons>
|
||||
</div>,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue