Commit 495f0b4a authored by Jr Prévost's avatar Jr Prévost Committed by Jean-Baptiste Kempf

Fix CSS browser inconsistencies

- removed inline css
- added browser specific css attributes
- removed text gradient as it breaks on certain browsers (Opera) and
create a visual inconsistency accross browsers.
Signed-off-by: Jean-Baptiste Kempf's avatarJean-Baptiste Kempf <jb@videolan.org>
parent 19738bed
......@@ -27,12 +27,6 @@
});
});
</script>
<style>
.bar {
height: 18px;
background: green;
}
</style>
</head>
<body>
<div class="container">
......@@ -40,7 +34,7 @@
<div id="appIcon"></div>
<h1>VLC for iOS</h1>
</header>
<div id="progress" style="display: none;">
<div id="progress" style="">
<div class="bar" style="width: 50%;"></div>
</div>
<form>
......
......@@ -31,12 +31,6 @@ header h1 {
font-size: 3em;
line-height: 2em;
color: #e08d33;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(234, 171, 103)), to(rgb(214, 112, 0)));
background-image: -webkit-linear-gradient(top, rgb(234, 171, 103), rgb(214, 112, 0));
background-image: linear-gradient(top, rgb(234, 171, 103), rgb(214, 112, 0));
-webkit-background-clip: text;
-webkit-text-fill-color:transparent;
font-weight: normal;
}
#progress {
......@@ -45,13 +39,18 @@ header h1 {
border-radius: 5px;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(170, 170, 170)), to(rgb(200, 200, 200)));
background-image: -webkit-linear-gradient(top, rgb(170, 170, 170), rgb(200, 200, 200));
background-image: -moz-linear-gradient(top, rgb(170, 170, 170), rgb(200, 200, 200));
background-image: -ms-linear-gradient(top, rgb(170, 170, 170), rgb(200, 200, 200));
background-image: -o-linear-gradient(top, rgb(170, 170, 170), rgb(200, 200, 200));
background-image: linear-gradient(top, rgb(170, 170, 170), rgb(200, 200, 200));
}
#progress .bar {
border-radius: 5px;
height: 18px;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(234, 171, 103)), to(rgb(214, 112, 0)));
background-image: -webkit-linear-gradient(top, rgb(234, 171, 103), rgb(214, 112, 0));
background-image: -moz-linear-gradient(top, rgb(234, 171, 103), rgb(214, 112, 0));
background-image: linear-gradient(top, rgb(234, 171, 103), rgb(214, 112, 0));
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment