feat(client): change the layout of lowerjaw hint and test to flex (#48322)

* feat(client): change the layout of lowerjaw hint and test description to flex

* remove the align center, and fix the margins

* Revert mistake

* add RTL layout support

* Remove global variables, and add gap for spacing
pull/48508/head
Muhammed Mustafa 2022-11-14 09:19:03 +02:00 committed by GitHub
parent 9609e3a19b
commit f227b60c9e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 6 deletions

View File

@ -117,14 +117,13 @@ textarea.inputarea {
}
.test-feedback p {
margin: 0.5rem 0 0;
margin: 0.45rem 0 0;
font-family: 'Lato', sans-serif;
}
.test-feedback h2 {
font-size: 1rem;
line-height: 1.5;
padding-right: 0.5rem;
/* using float instead of inline display so screen readers recognize h2 as a block element */
float: left;
margin: 0.5em 0 0;
@ -137,18 +136,21 @@ textarea.inputarea {
.test-feedback svg {
height: 1.5rem;
width: auto;
margin-right: 0.5rem;
margin-top: 0.6rem;
margin-top: 0.5rem;
}
.test-feedback > div {
.test-feedback .test-status,
.test-feedback .hint-status {
margin-top: 1rem;
display: flex;
gap: 0.5rem;
flex-direction: row;
}
.test-status-description,
.hint-description {
display: flex;
gap: 0.5rem;
width: 100%;
}
@ -174,11 +176,11 @@ textarea.inputarea {
.lower-jaw-icon-bar {
overflow: hidden;
display: flex;
gap: 10px;
flex-direction: row;
}
.lower-jaw-icon-bar > button {
line-height: 0;
margin-right: 10px;
}
.lower-jaw-icon-bar > button:focus {