|
The iPhone Wiki is no longer updated. Visit this article on The Apple Wiki for current information. |
Difference between revisions of "MediaWiki talk:Vector.css"
| Line 1: | Line 1: | ||
| + | == Data URIs == |
||
@thekirbylover, want to make it so instead of using images, it uses date uri's? just use [http://websemantics.co.uk/online_tools/image_to_data_uri_convertor/ this site] and paste the data uri in place of the image. browsers that don't support data uri's are old, but you could keep the image as a backup. newer browsers will notice the data uri and use it instead of sending another request to the server for the image, while older browsers (even before IE 6) will see the data uri, not know how to parse it and use the image instead. ex: |
@thekirbylover, want to make it so instead of using images, it uses date uri's? just use [http://websemantics.co.uk/online_tools/image_to_data_uri_convertor/ this site] and paste the data uri in place of the image. browsers that don't support data uri's are old, but you could keep the image as a backup. newer browsers will notice the data uri and use it instead of sending another request to the server for the image, while older browsers (even before IE 6) will see the data uri, not know how to parse it and use the image instead. ex: |
||
#content{background:#C5CCD4 url(/wiki/images/d/d6/Pinstripes_loop.png) top left repeat !important;} |
#content{background:#C5CCD4 url(/wiki/images/d/d6/Pinstripes_loop.png) top left repeat !important;} |
||
| Line 7: | Line 8: | ||
} |
} |
||
--[[User:balloonhead66|Cole Johnson]] 21:47, 8 January 2012 (MST) |
--[[User:balloonhead66|Cole Johnson]] 21:47, 8 January 2012 (MST) |
||
| + | |||
| + | == New User icon == |
||
| + | See that icon next to your user name? See the white around it? You can fix that with this: |
||
| + | #pt-userpage, #pt-anonuserpage, #pt-login { |
||
| + | background: url(//upload.wikimedia.org/wikipedia/commons/thumb/a/a8/System-users.svg/16px-System-users.svg.png) left top no-repeat; |
||
| + | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAAB3RJTUUH2QcUEgsrxFSsCgAAAphJREFUOI2NksuPFFUUh7+qut1dXT3DNDCZHobxMTwCTEDkEaMGVFxoMBrHFW5MDAtnY8LayKJJ+AOIbkxMDO51xQYNJJ24IVHD4II4m3bi9EDz6Fd1VVfduvfWdTU4Y4bgtzs5+X055+TAFtTruPU67la9/+JsCn5A4G+f/bo6FrwltSKKRjfUvQcX6g3SpwnExqJcnf3qlSNz58eCEt1en1bbftamBjxYfKagXscdf1h+O/ALTE9NkqYSz7GMB+LdP67Mf+MV/VqW9O/0h83LZ+roLSeQMnM7vT6plAzCIZlMeOPkwV3Te44tGhmi+s0FIQrHLcsfOmABvPVwo4E9uqfwkSB7IRwM6PYGvDgzxv4jpzx/6mUcr4gZPURYte/uCXnnu0ayDPx76YVzlQvx88FLy6GkFeZ0pEC5ApN2UeHfmKSDVSNcx3oFUZzftMLZBfZO79rxhXEfVeVul5YWpCPNFJrDvb/IR4+xRqKje0hbiZRKr60LXIBiqbLoeLKmtUWpHIeMkg8/dT+lsbKNZPgYk8WEZoIfVw7ZT367WFsXeAAHDgUfu65zLLeKPAejYS1eYOi/R7NwitBsozy2k+9XT/OrfL00XvbOiN2nf+gt/xy6AGtryTXX8yNygcogkQVk8TXiVPKoL/ldvsq+d75kqTtLGMbI3D63faJ86ckE91vmz3I5vS9EdUduKmEUz8Rp8GZVKu1YaxkMR3h5ylKzgzWKLB0RCK1Xl65/++QPbv2irkL7KuD71bx29P3Ordwbn86NxgFu3l7FZAk215B2SZSINv3BBrROo0Fxcj6bqPgHBabgIXUSxVqgM4FOyM3ddqv5+bB1u+1sIdhIsTQ5N+fgzmCt57gixcQrSXet9Yzc/+cfhMA9ZoCY3h8AAAAASUVORK5CYII=) left top no-repeat; |
||
| + | } |
||
| + | data URI necessary as the main CSS for vector uses it also, so to override it on newer browsers (explained above), we need it<br /> |
||
| + | --[[User:balloonhead66|Cole Johnson]] 21:58, 8 January 2012 (MST) |
||
Revision as of 04:58, 9 January 2012
Data URIs
@thekirbylover, want to make it so instead of using images, it uses date uri's? just use this site and paste the data uri in place of the image. browsers that don't support data uri's are old, but you could keep the image as a backup. newer browsers will notice the data uri and use it instead of sending another request to the server for the image, while older browsers (even before IE 6) will see the data uri, not know how to parse it and use the image instead. ex:
#content{background:#C5CCD4 url(/wiki/images/d/d6/Pinstripes_loop.png) top left repeat !important;}
to
#content{
background: #C5CCD4 url(/wiki/images/d/d6/Pinstripes_loop.png) top left repeat !important;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAABCAIAAACdaSOZAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAABRJREFUGFdjOHrmChK6dPrSDSACALh0EOJgMOPvAAAAAElFTkSuQmCC);
}
--Cole Johnson 21:47, 8 January 2012 (MST)
New User icon
See that icon next to your user name? See the white around it? You can fix that with this:
#pt-userpage, #pt-anonuserpage, #pt-login {
background: url(//upload.wikimedia.org/wikipedia/commons/thumb/a/a8/System-users.svg/16px-System-users.svg.png) left top no-repeat;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAAB3RJTUUH2QcUEgsrxFSsCgAAAphJREFUOI2NksuPFFUUh7+qut1dXT3DNDCZHobxMTwCTEDkEaMGVFxoMBrHFW5MDAtnY8LayKJJ+AOIbkxMDO51xQYNJJ24IVHD4II4m3bi9EDz6Fd1VVfduvfWdTU4Y4bgtzs5+X055+TAFtTruPU67la9/+JsCn5A4G+f/bo6FrwltSKKRjfUvQcX6g3SpwnExqJcnf3qlSNz58eCEt1en1bbftamBjxYfKagXscdf1h+O/ALTE9NkqYSz7GMB+LdP67Mf+MV/VqW9O/0h83LZ+roLSeQMnM7vT6plAzCIZlMeOPkwV3Te44tGhmi+s0FIQrHLcsfOmABvPVwo4E9uqfwkSB7IRwM6PYGvDgzxv4jpzx/6mUcr4gZPURYte/uCXnnu0ayDPx76YVzlQvx88FLy6GkFeZ0pEC5ApN2UeHfmKSDVSNcx3oFUZzftMLZBfZO79rxhXEfVeVul5YWpCPNFJrDvb/IR4+xRqKje0hbiZRKr60LXIBiqbLoeLKmtUWpHIeMkg8/dT+lsbKNZPgYk8WEZoIfVw7ZT367WFsXeAAHDgUfu65zLLeKPAejYS1eYOi/R7NwitBsozy2k+9XT/OrfL00XvbOiN2nf+gt/xy6AGtryTXX8yNygcogkQVk8TXiVPKoL/ldvsq+d75kqTtLGMbI3D63faJ86ckE91vmz3I5vS9EdUduKmEUz8Rp8GZVKu1YaxkMR3h5ylKzgzWKLB0RCK1Xl65/++QPbv2irkL7KuD71bx29P3Ordwbn86NxgFu3l7FZAk215B2SZSINv3BBrROo0Fxcj6bqPgHBabgIXUSxVqgM4FOyM3ddqv5+bB1u+1sIdhIsTQ5N+fgzmCt57gixcQrSXet9Yzc/+cfhMA9ZoCY3h8AAAAASUVORK5CYII=) left top no-repeat;
}
data URI necessary as the main CSS for vector uses it also, so to override it on newer browsers (explained above), we need it
--Cole Johnson 21:58, 8 January 2012 (MST)
