mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
feat(docs-infra): add Angie to the embedded editor error state
When the embedded editor fails to boot the preview sandbox, the error
card showed only a text message. Add the press-kit Error pose above the
message so the failure state matches the mascot treatment already used
for the loading steps and the empty search states.
The card is also centered in the preview pane (previously pinned 5% from
the top) so the pose and message read as one block. Behaviour is
unchanged; this is presentation only.
(cherry picked from commit 72cc548d34)
This commit is contained in:
@@ -1,4 +1,10 @@
|
||||
<div class="adev-preview-error docs-light-mode docs-mini-scroll-track">
|
||||
<img
|
||||
class="adev-preview-error-angie"
|
||||
src="assets/images/angie/error.svg"
|
||||
alt=""
|
||||
aria-hidden="true"
|
||||
/>
|
||||
@if (error()?.type === ErrorType.UNSUPPORTED_BROWSER_ENVIRONMENT) {
|
||||
@if (isIos) {
|
||||
<p>Open angular.dev on desktop to code in your browser.</p>
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
:host {
|
||||
margin: 5% auto;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.adev-preview-error-angie {
|
||||
display: block;
|
||||
width: 140px;
|
||||
height: auto;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.adev-preview-error {
|
||||
|
||||
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 21 KiB |
Reference in New Issue
Block a user