chinwag/chinwagsocial
chinwag/chinwagsocial
2
0
Fork 0
Code Issues Pull requests Releases 14 Wiki Activity

Add error boundary around routes in web UI (#19412)

Browse source 
* Add error boundary around routes in web UI

* Update app/javascript/mastodon/features/ui/util/react_router_helpers.js

Co-authored-by: Yamagishi Kazutoshi <ykzts@desire.sh>

* Update app/javascript/mastodon/features/ui/util/react_router_helpers.js

Co-authored-by: Yamagishi Kazutoshi <ykzts@desire.sh>

* Update app/javascript/mastodon/features/ui/components/bundle_column_error.js

Co-authored-by: Yamagishi Kazutoshi <ykzts@desire.sh>

Co-authored-by: Yamagishi Kazutoshi <ykzts@desire.sh>
This commit is contained in:
Eugen Rochko 2022-10-22 23:18:32 +02:00 • committed by GitHub
commit a43a823768
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 222 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

53
app/javascript/styles/mastodon/components.scss
View file

@ -89,6 +89,15 @@
cursor: default;
}
&.copyable {
transition: background 300ms linear;
}
&.copied {
background: $valid-value-color;
transition: none;
}
&::-moz-focus-inner {
border: 0;
}
@ -2656,7 +2665,8 @@ $ui-header-height: 55px;
.column-header,
.column-back-button,
.scrollable {
.scrollable,
.error-column {
border-radius: 0 !important;
}
}
@ -4292,7 +4302,6 @@ a.status-card.compact:hover {
}
.empty-column-indicator,
.error-column,
.follow_requests-unlocked_explanation {
color: $dark-text-color;
background: $ui-base-color;
@ -4330,7 +4339,47 @@ a.status-card.compact:hover {
}
.error-column {
padding: 20px;
background: $ui-base-color;
border-radius: 4px;
display: flex;
flex: 1 1 auto;
align-items: center;
justify-content: center;
flex-direction: column;
cursor: default;
&__image {
max-width: 350px;
margin-top: -50px;
}
&__message {
text-align: center;
color: $darker-text-color;
font-size: 15px;
line-height: 22px;
h1 {
font-size: 28px;
line-height: 33px;
font-weight: 700;
margin-bottom: 15px;
color: $primary-text-color;
}
p {
max-width: 48ch;
}
&__actions {
margin-top: 30px;
display: flex;
gap: 10px;
align-items: center;
justify-content: center;
}
}
}
@keyframes heartbeat {