mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
5e404d3114
Add support to material design icons in offline mode for Angular Devtools. Self hosting the web font so icons are loaded regardless of network connection. Bring the font file as well as its corresponding css file from third_party repo through bazel into shell-browser directory while building. PR Close #45743
73 lines
No EOL
1.4 KiB
HTML
73 lines
No EOL
1.4 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<link href="../third_party/github.com/google/material-design-icons/material-icons.css" rel="stylesheet" />
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.header-text {
|
|
margin: 0px;
|
|
text-align: center;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
.modal-content {
|
|
min-width: 300px;
|
|
padding: 10px;
|
|
}
|
|
|
|
.icon {
|
|
width: 20px;
|
|
margin-right: 16px;
|
|
}
|
|
|
|
.message {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: 5px;
|
|
}
|
|
|
|
.section-content {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
code {
|
|
font-size: 1em;
|
|
font-family: monospace;
|
|
}
|
|
|
|
p:not(:last-child) {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.material-icons {
|
|
color: rgb(107, 107, 107);
|
|
margin-right: 7px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="modal-content">
|
|
<h4 class="header-text">Angular DevTools</h4>
|
|
<div class="message">
|
|
<section class="section-content">
|
|
<span class="material-icons md-48">check</span>
|
|
<p>Angular application running development mode.</p>
|
|
</section>
|
|
<br />
|
|
<section class="section-content">
|
|
<span class="material-icons md-48">settings</span>
|
|
<p>Open developer tools, and select the Angular tab.</p>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |