darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-09-07 10:18:25 -04:00
Code Issues Packages Projects Releases Wiki Activity
Files
cd1fe0640c8ece975ac43d8ea7d1fdca23cdd7fb
notifications-admin/app/assets/images/exclamation.svg

27 lines
1.0 KiB
XML
Raw Normal View History

Add some styling to broadcast messages This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
2020-07-08 17:24:08 +01:00
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
Restyle the broadcast message preview The preview of the broadcast message, with the 2px thick black lines no longer matched the style of the area labels, which have moved to just having a tinted background. This commit restyles the broadcast message preview (including the exclamation mark icon) to use shading only to differentiate the message from the rest of the page. This should make the page fit together more cohesively, and feel less busy.
2020-10-02 13:49:44 +01:00
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
Make SVG alert icon show in Internet Explorer 10 IE 10 supports using SVG[1] but has some buggy behaviour when they’re used as background images. Without an explicit width/height it stretches the viewBox of the SVG to fill the containing element. This causes the content of the file to display centered within the viewBox. Explicitly setting the width and height seems to be the thing that fixes this. Out of the suggested fixes on Stackoverflow[2] this one seems to be the most straightforward. 1. https://caniuse.com/#feat=svg 2. https://stackoverflow.com/questions/17944354/svg-background-image-position-is-always-centered-in-internet-explorer-despite-b
2020-08-18 09:57:03 +01:00
viewBox="0 0 17.5 14.5" width="17.5" height="14.5" style="enable-background:new 0 0 17.5 14.5;" xml:space="preserve">
Add some styling to broadcast messages This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
2020-07-08 17:24:08 +01:00
<style type="text/css">
Restyle the broadcast message preview The preview of the broadcast message, with the 2px thick black lines no longer matched the style of the area labels, which have moved to just having a tinted background. This commit restyles the broadcast message preview (including the exclamation mark icon) to use shading only to differentiate the message from the rest of the page. This should make the page fit together more cohesively, and feel less busy.
2020-10-02 13:49:44 +01:00
.st0{display:none;}
.st1{display:inline;fill:#BCBCBC;}
.st2{fill:#FFFFFF;}
.st3{fill:#6F777B;}
Add some styling to broadcast messages This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
2020-07-08 17:24:08 +01:00
</style>
Restyle the broadcast message preview The preview of the broadcast message, with the 2px thick black lines no longer matched the style of the area labels, which have moved to just having a tinted background. This commit restyles the broadcast message preview (including the exclamation mark icon) to use shading only to differentiate the message from the rest of the page. This should make the page fit together more cohesively, and feel less busy.
2020-10-02 13:49:44 +01:00
<g id="Layer_3" class="st0">
<rect x="-1.6" y="-0.8" class="st1" width="20.1" height="17.8"/>
Add some styling to broadcast messages This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
2020-07-08 17:24:08 +01:00
</g>
Restyle the broadcast message preview The preview of the broadcast message, with the 2px thick black lines no longer matched the style of the area labels, which have moved to just having a tinted background. This commit restyles the broadcast message preview (including the exclamation mark icon) to use shading only to differentiate the message from the rest of the page. This should make the page fit together more cohesively, and feel less busy.
2020-10-02 13:49:44 +01:00
<g id="Layer_1">
<path class="st2" d="M8.6,0L0,14.5h17.5L8.6,0L8.6,0z"/>
<g>
<circle class="st2" cx="8.8" cy="10.9" r="1.1"/>
</g>
Add some styling to broadcast messages This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
2020-07-08 17:24:08 +01:00
</g>
Restyle the broadcast message preview The preview of the broadcast message, with the 2px thick black lines no longer matched the style of the area labels, which have moved to just having a tinted background. This commit restyles the broadcast message preview (including the exclamation mark icon) to use shading only to differentiate the message from the rest of the page. This should make the page fit together more cohesively, and feel less busy.
2020-10-02 13:49:44 +01:00
<g id="Layer_2">
<path class="st3" d="M8.8,10.3c-0.8,0-1.5,0.7-1.5,1.5c0,0.8,0.7,1.5,1.5,1.5s1.5-0.7,1.5-1.5C10.2,11,9.6,10.3,8.8,10.3L8.8,10.3z
"/>
<path class="st3" d="M10.1,5.8C10.2,6.6,9.8,9,9.8,9S9.4,9,8.8,9C8.3,9,7.8,9,7.8,9S7.3,6.7,7.3,6c0,0,0-1.6,1.4-1.6
C10.1,4.4,10.1,5.8,10.1,5.8z"/>
Add some styling to broadcast messages This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
2020-07-08 17:24:08 +01:00
</g>
</svg>
Reference in New Issue Copy Permalink