github.com/vnforks/kid/v5@v5.22.1-0.20200408055009-b89d99c65676/templates/unsupported_browser.html (about) 1 2 {{define "unsupported_browser-browser"}} 3 <div 4 class='browser-container' 5 data-mattermost-hover='browser' 6 > 7 <div class='browser'> 8 <img 9 class='browser-image' 10 src='{{.LogoSrc}}' 11 /> 12 <div class='browser-top-text'>{{.Title}}</div> 13 <div class='browser-bottom-text'>{{.SupportedVersionString}}</div> 14 </div> 15 <div 16 class='browser browser-hover hidden' 17 data-mattermost-click='{{.Src}}' 18 > 19 <img 20 class='browser-image' 21 src='{{.LogoSrc}}' 22 /> 23 <div class='browser-top-text'>{{.GetLatestString}}</div> 24 </div> 25 </div> 26 {{end}} 27 {{define "unsupported_browser-system_browser"}} 28 <div 29 class='browser-container' 30 data-mattermost-hover='browser' 31 > 32 <div class='browser'> 33 <img 34 class='browser-image' 35 src='{{.LogoSrc}}' 36 /> 37 <div class='browser-top-text'>{{.Title}}</div> 38 <div class='browser-bottom-text'>{{.SupportedVersionString}}</div> 39 </div> 40 <div class='browser browser-hover no-pointer hidden'> 41 <img 42 class='browser-image' 43 src='{{.LogoSrc}}' 44 /> 45 <div 46 class='browser-top-text pointer' 47 data-mattermost-click='{{.LinkOpen}}' 48 > 49 <p>{{.LabelOpen}}</p> 50 </div> 51 <div class='browser-bottom-text'>{{.OrString}}</div> 52 <div 53 class='browser-top-text pointer' 54 data-mattermost-click='{{.LinkMakeDefault}}' 55 > 56 <p>{{.MakeDefaultString}}</p> 57 </div> 58 </div> 59 </div> 60 {{end}} 61 {{define "unsupported_browser-app"}} 62 <div 63 class='mattermost-app-container' 64 data-mattermost-hover='mattermost-app' 65 > 66 <div class='mattermost-app'> 67 <img 68 class='mattermost-app-image' 69 src='{{.LogoSrc}}' 70 /> 71 <div class='browser-top-text'>{{.Title}}</div> 72 <div class='browser-bottom-text'>{{.SupportedVersionString}}</div> 73 </div> 74 <div class='mattermost-app mattermost-app-hover hidden'> 75 <img 76 class='mattermost-app-image' 77 src='{{.LogoSrc}}' 78 /> 79 <button 80 class='mattermost-app-button' 81 data-mattermost-click='{{.Link}}' 82 > 83 {{.Label}} 84 </button> 85 <div class='mattermost-app-hover-alt'> 86 <a href='{{.InstallGuideLink}}' target='_blank'>{{.InstallGuide}}</a> 87 </div> 88 </div> 89 </div> 90 {{end}} 91 {{define "unsupported_browser"}} 92 <!DOCTYPE html> 93 <html> 94 <head> 95 <style> 96 body { 97 overflow: hidden; 98 } 99 .hidden { 100 display: none; 101 } 102 .content { 103 height: 540px; 104 width: 100%; 105 position: absolute; 106 top: 50%; 107 margin-top: -270px; 108 } 109 .we-no-longer-support { 110 height: 55px; 111 color: #3D3C40; 112 font-family: "Open Sans"; 113 font-size: 40px; 114 font-weight: 600; 115 letter-spacing: -0.2px; 116 line-height: 55px; 117 text-align: center; 118 } 119 .download-the-matterm { 120 height: 26px; 121 color: #3D3C40; 122 font-family: "Open Sans"; 123 font-size: 20px; 124 line-height: 26px; 125 text-align: center; 126 padding-top: 24px; 127 } 128 .downloads { 129 height: 212px; 130 width: 100%; 131 padding-top: 40px; 132 text-align: center; 133 font-size: 0; 134 } 135 .learn-more-about-sup { 136 height: 22px; 137 width: 100%; 138 line-height: 22px; 139 text-align: center; 140 position: absolute; 141 bottom: 0px; 142 } 143 .learn-more-about-sup a { 144 color: #145DBF; 145 text-decoration: none; 146 font-family: "Open Sans"; 147 font-size: 14px; 148 } 149 .learn-more-about-sup a:hover { 150 text-decoration: underline; 151 } 152 .vr { 153 display: inline-block; 154 vertical-align: top; 155 margin-left: 32px; 156 margin-right: 30px; 157 width: 1px; 158 background-color: #D8D8D8; 159 height: 164px; 160 position: relative; 161 top: 24px; 162 } 163 .mattermost-app { 164 height: 148px; 165 width: 188px; 166 padding: 32px 30px; 167 } 168 .mattermost-app-container { 169 height: 212px; 170 width: 248px; 171 display: inline-block; 172 vertical-align: top; 173 } 174 .browser { 175 height: 212px; 176 width: 164px; 177 padding-left: 14px; 178 padding-right: 14px; 179 } 180 .browser-container { 181 height: 212px; 182 width: 192px; 183 display: inline-block; 184 vertical-align: top; 185 padding: 0 2px; 186 } 187 .browser-image { 188 height: 80px; 189 padding: 32px 42px 24px 42px; 190 } 191 .mattermost-app-image { 192 height: 80px; 193 padding: 0px 54px 24px 54px; 194 } 195 .browser-bottom-text { 196 font-family: "Open Sans"; 197 font-size: 14px; 198 line-height: 22px; 199 text-align: center; 200 color: rgba(61,60,64,0.7); 201 } 202 .browser-top-text { 203 color: #145DBF; 204 font-family: "Open Sans"; 205 font-size: 16px; 206 letter-spacing: -0.2px; 207 line-height: 22px; 208 text-align: center; 209 } 210 .browser-top-text p { 211 margin: 0; 212 } 213 .browser-top-text p:hover { 214 text-decoration: underline; 215 } 216 .container-hover { 217 background-color: #EDF2FA; 218 border-radius: 4px; 219 border: 0; 220 } 221 .browser-hover { 222 cursor: pointer; 223 } 224 .browser-hover .browser-top-text { 225 font-weight: 600; 226 width: 128px; 227 padding: 0 18px; 228 } 229 .mattermost-app-button { 230 height: 36px; 231 width: 156px; 232 border: 0; 233 border-radius: 4px; 234 background-color: #145DBF; 235 padding: 8px 16px; 236 color: #FFFFFF; 237 font-family: "Open Sans"; 238 font-size: 14px; 239 line-height: 20px; 240 cursor: pointer; 241 } 242 .mattermost-app.mattermost-app-hover { 243 padding-bottom: 0; 244 } 245 .no-pointer { 246 cursor: auto; 247 } 248 .pointer { 249 cursor: pointer; 250 } 251 .mattermost-app-hover-alt { 252 height: 18px; 253 font-family: "Open Sans"; 254 font-size: 12px; 255 line-height: 18px; 256 text-align: center; 257 padding-top: 10px; 258 } 259 .mattermost-app-hover-alt a { 260 text-decoration: none; 261 color: #145DBF; 262 } 263 .mattermost-app-hover-alt a:hover { 264 text-decoration: underline; 265 } 266 </style> 267 <link 268 href='https://fonts.googleapis.com/css?family=Open+Sans&display=swap' 269 rel='stylesheet' 270 /> 271 <script 272 type='text/javascript' 273 src='/unsupported_browser.js' 274 > 275 </script> 276 </head> 277 <body> 278 <div class='content'> 279 <div class='we-no-longer-support'> 280 {{.Props.NoLongerSupportString}} 281 </div> 282 <div class='download-the-matterm'> 283 {{.Props.DownloadAppOrUpgradeBrowserString}} 284 </div> 285 <div class='downloads'> 286 {{template "unsupported_browser-app" .Props.App}} 287 <div class='vr'></div> 288 {{range .Props.Browsers}} 289 {{template "unsupported_browser-browser" .}} 290 {{end}} 291 {{if .Props.SystemBrowser}} 292 {{template "unsupported_browser-system_browser" .Props.SystemBrowser}} 293 {{end}} 294 <div class='learn-more-about-sup'> 295 <a href='https://docs.mattermost.com/install/requirements.html#pc-web' target='_blank' rel='noopener noreferrer'>{{.Props.LearnMoreString}}</a> 296 </div> 297 </div> 298 </div> 299 </body> 300 </html> 301 {{end}}