Skip to content
Snippets Groups Projects
Commit 42ff6730 authored by Anika Henke's avatar Anika Henke
Browse files

fixed performance issues with gradient in Firefox (which also added gradient...

fixed performance issues with gradient in Firefox (which also added gradient support for IE9) (FS#2447)

* removed all occurrences of '-moz-linear-gradient'
* added SVG as fallback for Firefox, IE9 and other browsers to page background and buttons
parent 5e984c56
No related branches found
No related tags found
No related merge requests found
......@@ -16,7 +16,8 @@ html,
body {
color: __text__;
background-color: __background_site__;
background-image: -moz-linear-gradient( top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
background-image: url(images/page-background.svg);
/*background-image: -moz-linear-gradient( top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em); see FS#2447*/
background-image: -webkit-linear-gradient(top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
background-image: -o-linear-gradient( top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
background-image: -ms-linear-gradient( top, __background_neu__ 0%, __background_alt__ 1em, __background_site__ 4em);
......@@ -333,7 +334,8 @@ button,
.qq-upload-button {
color: #333;
background-color: #eee;
background: -moz-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
/*background: -moz-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%); see FS#2447*/
background: -webkit-linear-gradient(top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
background: -o-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
background: -ms-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
......@@ -359,10 +361,11 @@ button:focus,
.qq-upload-button:hover {
border-color: #999;
background-color: #ddd;
background: -moz-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #cccccc 99%);
background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
/*background: -moz-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #cccccc 99%); see FS#2447*/
background: -webkit-linear-gradient(top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
background: -o-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #cccccc 99%);
background: -ms-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #cccccc 99%);
background: -o-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
background: -ms-linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
background: linear-gradient( top, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
}
......
......@@ -119,7 +119,7 @@
.dokuwiki dl.code dt,
.dokuwiki dl.file dt {
background-color: __background_alt__;
background: -moz-linear-gradient( top, __background__ 0%, __background_alt__ 100%);
/*background: -moz-linear-gradient( top, __background__ 0%, __background_alt__ 100%); see FS#2447 */
background: -webkit-linear-gradient(top, __background__ 0%, __background_alt__ 100%);
background: -o-linear-gradient( top, __background__ 0%, __background_alt__ 100%);
background: -ms-linear-gradient( top, __background__ 0%, __background_alt__ 100%);
......
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
<linearGradient id="g" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0" stop-color="#dddddd" />
<stop offset="0.1" stop-color="#eeeeee" />
<stop offset="0.4" stop-color="#fbfaf9" />
</linearGradient>
<rect x="0" y="0" width="100%" height="100%" fill="url(#g)" />
</svg>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment