imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve integration manager dialog style (#8888)

Browse source
This commit is contained in:
Suguru Hirahara 2022-06-25 11:54:07 +00:00 • committed by GitHub
parent 4b2a922e2e
commit e49aac7b3f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 28 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

48
res/css/views/settings/_IntegrationManager.scss
View file

@ -14,31 +14,33 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_IntegrationManager .mx_Dialog { .mx_IntegrationManager {
width: 60%; .mx_Dialog {
height: 70%; box-sizing: border-box;
overflow: hidden; width: 60%;
padding: 0px; height: 70%;
max-width: initial; overflow: hidden;
max-height: initial; max-width: initial;
} max-height: initial;
}
.mx_IntegrationManager iframe { iframe {
background-color: #fff; background-color: #fff;
border: 0px; border: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.mx_IntegrationManager_loading h3 { h3 {
text-align: center; margin-block: $spacing-20;
} }
.mx_IntegrationManager_error { .mx_IntegrationManager_loading,
text-align: center; .mx_IntegrationManager_error {
padding-top: 20px; text-align: center;
} }
.mx_IntegrationManager_error h3 { .mx_IntegrationManager_error h3 {
color: $alert; color: $alert;
}
} }

5
src/components/views/settings/IntegrationManager.tsx
View file

@ -22,6 +22,7 @@ import { ActionPayload } from '../../../dispatcher/payloads';
import Spinner from "../elements/Spinner"; import Spinner from "../elements/Spinner";
import { getKeyBindingsManager } from "../../../KeyBindingsManager"; import { getKeyBindingsManager } from "../../../KeyBindingsManager";
import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts"; import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts";
import Heading from '../typography/Heading';
interface IProps { interface IProps {
// false to display an error saying that we couldn't connect to the integration manager // false to display an error saying that we couldn't connect to the integration manager
@ -88,7 +89,7 @@ export default class IntegrationManager extends React.Component<IProps, IState>
if (this.props.loading) { if (this.props.loading) {
return ( return (
<div className='mx_IntegrationManager_loading'> <div className='mx_IntegrationManager_loading'>
<h3>{ _t("Connecting to integration manager...") }</h3> <Heading size="h3">{ _t("Connecting to integration manager...") }</Heading>
<Spinner /> <Spinner />
</div> </div>
); );
@ -97,7 +98,7 @@ export default class IntegrationManager extends React.Component<IProps, IState>
if (!this.props.connected || this.state.errored) { if (!this.props.connected || this.state.errored) {
return ( return (
<div className='mx_IntegrationManager_error'> <div className='mx_IntegrationManager_error'>
<h3>{ _t("Cannot connect to integration manager") }</h3> <Heading size="h3">{ _t("Cannot connect to integration manager") }</Heading>
<p>{ _t("The integration manager is offline or it cannot reach your homeserver.") }</p> <p>{ _t("The integration manager is offline or it cannot reach your homeserver.") }</p>
</div> </div>
); );