Updates the supported browser list and closes #372.

- Adds Safari and IE in the supported browser list.
- Adds version numbers for the supported browsers.

css/unsupported_browser.css

@@ -11,8 +11,8 @@ body {
 #wrap{
     display: block;
     position: absolute;
-    width:900px;
+    width:500px;
-    height: 365px;
+    height: 565px;
     overflow:hidden;
     text-align: center;
     margin: auto;
@@ -29,7 +29,7 @@ body {
 #text{
     display:inline-block;
     font-size: 28px;
-    width: 568px;
+    /* width: 568px; */
     vertical-align:middle;
     padding-top: 25px;
 }
@@ -51,18 +51,23 @@ a {
 .browser_wrapper
 {
     width: 138px;
-    height: 188px;
+    /* height: 188px; */
     vertical-align: middle;
     color: #929391;
     font-size: 20px;
     float: left;
     margin-left: 15px;
+    margin-top: 5px;
 }
 
+.browser_text
+{
+    height: 2em;
+}
 .supported_browsers
 {
     margin: 0px auto 0px auto;
-    width: 660px;
+    /* width: 660px; */
 }
 
 .clear
@@ -97,14 +102,14 @@ a {
 }
 #chromium_logo
 {
-    width: 85px;
+    width: 77px;
-    height: 79px;
+    height: 78px;
     background-image: url('/images/chromium.png');
 }
 #firefox_logo
 {
-    width: 73px;
+    width: 86px;
-    height: 79px;
+    height: 80px;
     background-image: url('/images/firefox.png');
 }
 
@@ -114,5 +119,18 @@ a {
     height: 78px;
     background-image: url('/images/opera.png');
 }
-   
+
-   
+#safari_logo
+{
+    width: 78px;
+    height: 79px;
+    background-image: url('/images/safari.png');
+}
+
+#ie_logo
+{
+    width: 80px;
+    height: 78px;
+    background-image: url('/images/ie.png');
+}
+

unsupported_browser.html

@@ -12,33 +12,50 @@
 
     <div class="supported_browsers">
         <div class="browser_wrapper">
-            Chrome
+            Chrome 44+
             <div class="browser">
                 <div class="logo" id="chrome_logo"></div>
                 <a href="http://google.com/chrome"><div class="button">DOWNLOAD</div></a>
             </div>
         </div>
         <div class="browser_wrapper">
-            Chromium
+            Chromium 44+
             <div class="browser">
                 <div class="logo" id="chromium_logo"></div>
                 <a href="http://www.chromium.org/"><div class="button">DOWNLOAD</div></a>
             </div>
         </div>
         <div class="browser_wrapper">
-            Opera
+            Opera 32+
             <div class="browser">
                 <div class="logo" id="opera_logo"></div>
                 <a href="http://www.opera.com"><div class="button">DOWNLOAD</div></a>
             </div>
         </div>
         <div class="browser_wrapper">
-            Firefox
+            <div class="browser_text">
+                Firefox and Iceweasel 40+</div>
             <div class="browser">
                 <div class="logo" id="firefox_logo"></div>
                 <a href="http://www.getfirefox.com/"><div class="button">DOWNLOAD</div></a>
             </div>
         </div>
+        <div class="browser_wrapper">
+            <div class="browser_text">
+                IE <br /> <span style="font-size: small">(Temasys 0.8.854+)</span></div>
+            <div class="browser">
+                <div class="logo" id="ie_logo"></div>
+                <a href="https://temasys.atlassian.net/wiki/display/TWPP/WebRTC+Plugins"><div class="button">DOWNLOAD</div></a>
+            </div>
+        </div>
+        <div class="browser_wrapper">
+            <div class="browser_text">
+                Safari <br /> <span style="font-size: small">(Temasys 0.8.854+)</span></div>
+            <div class="browser">
+                <div class="logo" id="safari_logo"></div>
+                <a href="https://temasys.atlassian.net/wiki/display/TWPP/WebRTC+Plugins"><div class="button">DOWNLOAD</div></a>
+            </div>
+        </div>
     </div>
     <div class="clear"></div>
 </div>