diff options
| author | Alex Moon <moonmeister@users.noreply.github.com> | 2017-09-06 13:23:14 -0700 |
|---|---|---|
| committer | Christopher Speller <crspeller@gmail.com> | 2017-09-06 13:23:14 -0700 |
| commit | cb266eb942789dc60e6b61ec9c7f2e35e43de0ce (patch) | |
| tree | ac936afb13ea394199495d3463d697887c24879d /templates | |
| parent | 66a4d0112587608533aa744578d2db18bd88db56 (diff) | |
| download | chat-cb266eb942789dc60e6b61ec9c7f2e35e43de0ce.tar.gz chat-cb266eb942789dc60e6b61ec9c7f2e35e43de0ce.tar.bz2 chat-cb266eb942789dc60e6b61ec9c7f2e35e43de0ce.zip | |
[PLT-959] Browser Compatibility (#6945)
* Error page implimentation
* Update Browser Compatibility check to check Chrome, FF, IE, Edge, and Safai
* Update strings with proper edge version
* undo uneeded changes and move to go template.
* more unneeded additions
* eliminate js and add local triangle
* fix typo
* Correct debug logging of browser version
* Modify Browser Check to pass user_agent object only and write test.
* Fix chrome version typo and correct testing change that broke chrome UA chack
* simplity browser version detection by using maps instead of string splitting
Diffstat (limited to 'templates')
| -rw-r--r-- | templates/unsupported_browser.html | 178 |
1 files changed, 178 insertions, 0 deletions
diff --git a/templates/unsupported_browser.html b/templates/unsupported_browser.html new file mode 100644 index 000000000..79656e10c --- /dev/null +++ b/templates/unsupported_browser.html @@ -0,0 +1,178 @@ +{{define "unsupported_browser"}} + <head> + <style> + body { + margin-top: 0px; + margin-right: 0px; + margin-bottom: 0px; + margin-left: 0px; + font-family: "Open Sans", sans-serif; + font-size: 14px; + line-height: 1.42857; + color: rgb(51, 51, 51); + background-color: whitesmoke; + -webkit-font-smoothing: antialiased; + background-image: initial; + background-position-x: initial; + background-position-y: initial; + background-size: initial; + background-repeat-x: initial; + background-repeat-y: initial; + background-attachment: initial; + background-origin: initial; + background-clip: initial; + height: 100%; + position: relative; + width: 100%; + } + * { + box-sizing: border-box; + } + html, body { + height: 100%; + } + .sticky { + background-image: initial; + background-position-x: initial; + background-position-y: initial; + background-size: initial; + background-repeat-x: initial; + background-repeat-y: initial; + background-attachment: initial; + background-origin: initial; + background-clip: initial; + background-color: white; + } + .container-fluid { + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; + height: 100%; + position: relative; + } + .container-fluid::after { + content: " "; + display: block; + height: 0px; + clear: both; + overflow-x: hidden; + overflow-y: hidden; + visibility: hidden; + } + .exclamation-triangle { + width: 22px; + opacity: 0.6; + } + body.error .container-fluid { + display: table; + height: 90%; + } + body.error .error__container { + color: rgb(85, 85, 85); + display: table-cell; + margin-top: 0px; + margin-right: auto; + margin-bottom: 0px; + margin-left: auto; + max-width: 800px; + padding-top: 5em; + padding-right: 0px; + padding-bottom: 5em; + padding-left: 0px; + text-align: left; + vertical-align: top; + } + body.error .error__icon { + color: rgb(204, 204, 204); + font-size: 4em; + } + h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { + font-family: inherit; + font-weight: 500; + line-height: 1.1; + color: inherit; + } + h1, .h1, h2, .h2, h3, .h3 { + margin-top: 20px; + margin-bottom: 10px; + } + h2, .h2 { + font-size: 30px; + } + body.error h2 { + font-size: 1.5em; + font-weight: 600; + margin-top: 0.8em; + margin-right: 0px; + margin-bottom: 0.5em; + margin-left: 0px; + } + h2 { + font-size: 25px; + } + ul, ol { + margin-top: 0px; + margin-bottom: 10px; + } + a { + background-color: transparent; + color: rgb(35, 137, 215); + text-decoration-line: none; + text-decoration-style: initial; + text-decoration-color: initial; + cursor: pointer; + word-break: break-word; + } + a:focus { + outline-color: -webkit-focus-ring-color; + outline-style: auto; + outline-width: 5px; + outline-offset: -2px; + } + </style> +</head> + <body class="sticky error"> + <div data-reactroot="" class="container-fluid" > + <div class="error__container" > + <div class="error__icon" > + <img src="/static/images/warning.png" alt="warning" class="exclamation-triangle" ></img> + </div> + <h2 > + <span>{{.Props.Title}}</span> + </h2> + <div> + <span>{{.Props.Message}}</span> + <ul> + <li> + <a href="https://www.google.com/chrome/browser/desktop/index.html" target="_blank" rel="noopener noreferrer"> + <span>Google Chrome 43+</span> + </a> + </li> + <li> + <a href="https://www.mozilla.org/en-US/firefox/new/" target="_blank" rel="noopener noreferrer"> + <span>Mozzilla Firefox 52+</span> + </a> + </li> + <li> + <a href="https://www.microsoft.com/en-ca/download/internet-explorer.aspx" target="_blank" rel="noopener noreferrer"> + <span>Microsoft Internet Explorer 11+</span> + </a> + </li> + <li> + <a href="https://www.microsoft.com/en-ca/download/details.aspx?id=48126" target="_blank" rel="noopener noreferrer"> + <span>Microsoft Edge 40+</span> + </a> + </li> + <li> + <a href="https://support.apple.com/en-us/HT204416" target="_blank" rel="noopener noreferrer"> + <span>Apple Safari 9+</span> + </a> + </li> + </ul> + </div> + </div> + </div> +</body> + +{{end}} |