Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
SVG backgrounds - no image host needed!
I have only gotten this to work with simple shapes, so far. I tried it with an SVG of Homer Simpson, and it didn't work. I don't know if this means it's impossible to put such intricate inline SVG into CSS, or if I did something wrong.
Any any rate, here's some CSS to give you balls like these, with no need for an image host!
|
1/19/2018, 2:34 am
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Joxcenia
Global Administrator
Runboard staff member
Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
Wow! Those are nice.
---
|
1/19/2018, 5:40 am
|
Link to post
Email Joxcenia
PM Joxcenia
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10257
Karma: 272 (+331/-59)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
I think the colors are great.
|
1/19/2018, 6:10 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Susa
Global Administrator
Registered: 07-2006
Location: Oχάιο
Posts: 4623
Karma: 128 (+137/-9)
|
Reply | Quote
|
|
Re:
I think it really looks nice. It is amazing you two can do something like this.
|
1/19/2018, 2:30 pm
|
Link to post
PM Susa
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
Thanks, everyone!
I don't think a lot of this would have been possible only 5 years ago, but as web standards change, it opens up more possibilities.
|
1/20/2018, 1:30 am
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10257
Karma: 272 (+331/-59)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
This is a very large SVG (from my POV). It does look nice as a background... I call it "Blue Bamboo."
Last edited by Pastor Rick, 1/21/2018, 12:54 am
|
1/21/2018, 12:12 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Joxcenia
Global Administrator
Runboard staff member
Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
I love that one. I would definitely use it if it went/blended well with the images I had on any of my boards.
---
|
1/21/2018, 12:49 am
|
Link to post
Email Joxcenia
PM Joxcenia
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10257
Karma: 272 (+331/-59)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
quote: Joxcenia wrote:
I love that one. I would definitely use it if it went/blended well with the images I had on any of my boards.
I am leaving the "Blue Bamboo" as the background for http://bfoldermania.runboard.com/ until LG or I can figure out why the SVG code for the image used in the message board's background is different from the SVG code used when posting the picture.
[edit]
LG just answered my question and concern over this SVG image. All is well.
[/edit]
Last edited by Pastor Rick, 1/21/2018, 5:55 am
|
1/21/2018, 1:05 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
Rick actually figured it out before I confirmed what the problem was, but I'll explain it for others here.
When you use [img]URL_HERE[/url] in a message board post, the underlying code results in:
<img src="URL_HERE">
SVG URLs contain quotes, which can either be double quotes or single quotes. If you try to post it with double quotes, this results in double quotes inside double quotes, which basically cuts your URL off prematurely. For this reason, you need to change all double quotes to single quotes in your SVG's URL if you want to post it.
|
1/21/2018, 6:12 am
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10257
Karma: 272 (+331/-59)
|
Reply | Quote
|
|
Re: SVG backgrounds - no image host needed!
I created this one as one of five kitchen tile backsplash backgrounds.
This image is 5.18 KB in size.
-------
/* CSS BACKGROUND LIGHT BIEGE */
body {background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAADAFBMVEXp4NPbzLzVxrXXybje0sHn3tDs5Nfq4dTj2s7k1sXv5tnWx7fh18rPwa/azr7Wybnn2cbOvq7k3NDi2czm3c/Xy7z///7j2Mq7rp3ZyLbp3Mndzr3k287e0MDPwrLb0MLi1cbu5NfSxbPs38/Bsp/l2cjHuqrp3c7IvKzm3M3w59rl2MnFt6Xt5tjm3tLv3s3ay7rm18XbzsDczLvQvqy9r53m28zg0sHMvq3czr7VyLjw6Nvg1cfSx7f17eDs4tXf08bk2sz//Ovr3Mnd0sT17dzy6dzr3srQwrTOvavGtKK5q5v///Hd1MfVxbLx6d3r4tfu4tDf1sncz7/SxLTm49Xi18jr4NOmmIfh1MXIuKT/9eTs4tPVy7nLuqvv59vo3tLi08HXybrLvayglIPu49bk18bm1MLg1MLcyrnSw7DQv6/LuqfBs6K/sqHz59Xz5NXo28vp2sbKvKivoI707+Tn3M/YyLTRwq//+ej27uD06drq3Mvh08Pe0L3YzLzSwrLXz8L78uPl3tD///jw49Dgz7zCsJzp39DbybfLv7C6q5ebjX////T56tbs4c/n2crn2MHcz7rQxbLHuKf+9+b28eT57t7569rx5Nfz49Pv28zq3svd08Xi0sHdz8Hi0r/fz7/Zy7jOwa/KvKz48N7y6dnw49Pn3cvXxbStoI3/9unHtqTy697j18jUwK7/++7359bTyrzYw7C1pJD//+z69uLi2Mrazre0pZT6+u36+OX58eTr5Nj15tbt49Hm3cns3cbm3MbZybrQxbXUxLTLvam/vKixopGOgXP+8N3j1cHQwa349vH49uj+/Of59OX48OL18N7k2MvXzb+1qZqrm4rQvKn59uzNxbWhkX//+Ovs5Nm+rJqvn4zs2cXl0L11Zlf+7dbDtKCNfmrw3Mrj2srn2sjx2Mjl1cXUxrjVyK3GuaiCdGje077SxbXUxa/GsZ+3q5yzsZuvpJionI6Ug3KQgnGIfm3n4tXJv7L28Oj16t++qpdrXVJaSjx+1Em/AAAL5UlEQVRo3u3aaVhUZRQH8Bflzh0uE+LM4KSODKPIMgQpKqKDLIq4MYJoiIqiJq5glqKJiSYuiEvuS2Vm7hmouKQVlmVWtodlamqm7ftetv7n/859fPQbX3r6wO/L7c6d25GZc88977kjhJHEMyTMJGJJVJG+9zuJfaSfp5HIJv30OBK5JBBjx3YYdv7EZJhW45wF67Ny0yHI4OgGUebczfCCsY3X7fu++hleubajFNYmJ8VDE3NCDASkOXdATzV/J9wVU/I+zC9AkO3D4M3zk6fB0ppZ6+FUVnoQNDJ0i4LJ5s0vwFxjm9vh430/vwKXr5Wuhe7J8U0g1BwTAI+m7egJ29Wdd3nFvD8fmjUEqXeQYW/CofPTlsLVmvWnYFhWUCO41xA1GY6aX5gLfYy3f+y175XL8M+1td0hM7lJKIwwBzwKC9N6bofDKmPsj5nfDLxBRDKJ+0nP1gwSNzKQ7536eSmkH8sifa+EcGZBEj8ZY+TdEDwy8j5oUVoTAf3s8YMgwp40EBordbNhizO9KzS1MncD1fQmcIsyxA8axYV1geYyodun5PpDuzQE4SfT0Xh3MLQfeV8LuKc0oh+8Zx8UAZ3sAxvDRGX2Fpjg7NoU+lrjA2GS2uQWGKr4NYI+cV2aw15zTHsYl+LfDvo3BKl3kEYdYagxuD28OrLFPXCptN97sNQe0QkO2htPhDPKlgmw29m0L/xlDZwEReotQ2GR0qgPDI1rvhfOmNuPgw9T2vWHjgiiV0wjCQPpeybSX0wh4SD9RRMJlYRPLAmQPoiZDWUWXqTL3bnfwJHYgYOgyLSCf7Zr8yAYYWZ+Bqa634HD6wa2hqk5zPkebpnJcWEtoblgQvdXwrbA4joEmV0Giy13LYeP3N8cgS9jBxXBIpP8s12DRsAic5dA6Jj6zmF4c13rqbAo574ecNwtv5q4lvxOhF9/wOe7GA40BKl3kDL+l2X5R17uI1/CmdiiRXDQNO5DL9cI7pkDO0JR6mGW7XVT+WJOj+Nwyc1MviBTuEj0PwN9lcUH4AyCCIXELBI7SEwnkU/CTnqalpCe0D7RpG/SSFgJR7PtJsgxeE5DN60mCm5N2xQCvctZRv1ENTfZfHGi8GcVLgxJhHBPJEtEim08dFHSqmFIXOQKCBYsxmHTEcSUA+mG092gUou6FR5PC+kNEeX+LOCCm93ZIROhSMiyUpgYDgc9LBErU8azxivVQ6BV3IpgGCdiwqBzQ5B6B8lJh3hDt0q4Tbv1cTiX1jsCJpezgE8Sfrthb/ZEXjxCVuHC8IOQ57lnpVcKa/xEZUgr6BAXPM5LhHWGhQhyU89gJH1TSMLHRCKeRDoJJ+lZ7lNKYjBh/8/7z8JL5TJpBavpVkt0W2jvcnwBidEmB4RYhNdgW9UbkFnAi+hZt+xDTBVtvAx1YeBf1ZV9SJItFRx2BDn7EvxYzm9hhGiyFZ6wtOUtzPVFIlyJdoTACYv8l9neyIT5BfnPwgA3b6xNTbIZN4T5Q4cqeWNNSnXAnIYg9Q7y0o/weHnvEVAstj4BFyztX4VHXYlXYEl0yAmotDBGvi1TttHPDoAF7kZNYagJzTgY/DtA8yrZhyQ55sAXCCLMpCetmW7qEtyktwfvk16hfbJJjCRhId+GvTCvartcj6XIgqsyMQONsjNODomCTiZZk12y/KYqVojWUudAa6M8XSSMhVGaP29vnsKNMCsfQfzY3NnlAiNFVhA1KBBeM8pWLzmqE0wzySLjkvUk1RoNn2hz2LQY5eli7ChYqPH21tezcRZsaAhS7yCyF7bL9ViKLLhq4GtQZJR1PLnTNDhn4j/nNZcsv6nRn0CuxqblilGeLkYthFVaRxZqz6wN4A0ickj4uEhP6GQSIXRT61BO+jufJOFjp+stcVzhFNivpQVA54zTlTDZU/Ew9EoO2QadQqrWwVMlLNStteHsNRycOkwx7PoUgm2unjAvq443LVE9G1oqMq+nI8iU/bBcC+gMLTMqud71PNwLjidv45cRsu4pWFYS0hpO+m6ejp1T4Jjh02BYaes5D9Zm8aY1Qcxm363wi3qkIUi9g+xnp611bgmLMyYfhTxPr+NevtwNeWoZzC9pfRKu+HoNx5RjsN8QvBI+tM3jECSr1QRoLth3H1ACHgE2Ei7SW2IPCY1EY9J7WgfpE4k9pOfudNJHc/NIFJB3Oce6u8rKnja4YnoCrDDIKlxW8jo0E3KTXfUWdK8tPAYbzle+C2PO7lgPwyLZXSzLrPwB8sQ1HvNs5pI4CUH8V8EMawt+thUJK+BzgywrZa838xJyk/0WRza1xzbAqfPvjoGrZ9cPg5mRbyyDZpk/5MGvgsd+83BJ/P3/O8jy/+NfsmoGfGlFKkLFis+9DLIKlzUjITfZ3dmm1G445XV+zFW4fHbYTDgUuYxvycz7FS6LMb/BZU+f7+EvBNHz00nCQHpD8AeJEtJrchYJE+nZuo6EhfQsNxFiqEzatk7Z0yqykRC5reCxfNbd1dYnN0GQ8B2r5lWdIYuxwrJdbN80HEJ9FTrnE7bE5XJaUYEgCW1hrDOIOa3w7jdDtHoMvssPWQ1TrZuCYLjQj02AAxmsLheVymI4ah8eCl/5Sk5OGK+9ci6/LzUEqXeQtmMhwMmcxgRuBuwVj30HZ/JXT4Vwa9BwWC18xyZwzpBx60U4pxSzbNtDv4JOvgqdI6+98h6XwBtET1qV9IT2MdFNczefTaQ3zyrd2DxfXw1qfG4xOpvruElyHTfWICfBxopIeDg7gTcfs1weaBwIj7ZjkAxuOSUWcmOV5zmDQuE2i439RBqCbB4Nc7ObTAIsTMbCqwY52jRGsmnJljcfs1weaPE8wc4YwW654BZyY+V59zpDb4MlFnmDbAhS7yCj58KI7ElyHTeW6ziDnAQb2bT0yH5kISw2306+E+xyWu2W8wkhN9bG98JJ521L4KJF9hNp11PYx0x6NdVIFJK+l056B5FEQqGbNiNJCJHFJ3B3KnKwmzOYy00xuA0M0JIcMFyVSzZFPqlIl/2EmvE27InNL4SNWXzLILONvbCT/89EY1oujI9GkG53QrgiJ5U5AxZ4iTYDvDQHL3V1Drs6RY7e0+UNUn17D+yL5bpwStYcOZ8ewluEs1siFBtzx0NZQ5B6B7kzHJYo8hFFzgISjLFAG74aTqpsgvsq8klFuuwn1D37YFnsRvbdWZxP9zXzFtHfmVgMS4zjy+AIgugzMhPpI7aZpI95FdIrrYv0jUrCTvqLFhIgWZiKMwsid0ELFzM5tDTqJ1haY7WDzVeTVT6weLH69zu81OnRkKBwmvZALQv1KLcsv6YEG4QJpnCqFUHeZuNUsKsFPO/is8k1pT8tha9r7DbIlUVmrur3IvSpvoPUaHY5SpsHvGoDuLZ2y3pisrFbEbmpsLkhSL2DzDwEmQUtnvdyha6BRaVLv4a/a2y5kGRozAfM6ot9oK8eRHY5ygNUy1HEBLcsvyZ2K11E6mbwQxBRRXruxpHezBpIf3EkCRlE2EjvjJ104w8urncltXWcdWuOExBhlg+KFfbC7URSF2is8LlFS1XuWdo85FXHh3RPl8jqLeTG10iUVvaDvNNKpNdIBOGsu4N2gg9HzXJmpLRiBRFdeKNTxvMOp8o9C2N8VvfO03CohOXoCSGrku/OWNovD345zRi7GoLUO0hnjnI1Pks+apYjNl/BFewLihTZEKhyz/LQZ151TzP1S25hAyJkEbfKt5Tm/QJfn2Y9/BRB9FmCh26qnwbS13GSnq3rSM9klfRjNSQ0wimqdRc8V84Z2YNqpFev2GqOw7X43rBGO1EML3vkryKUan6+Tse3sM1k5YXvlu2IKquwQ/7aJ4NLxK42BNn1HDxfvvNBQBB2WrEch+/Weq+BC1rxy3DOIx/zK/x8Zzi/3QbhJl74AW55f1VlWXHIn69kBHWFrQ1B6h3kOZbfcsY4pvbiQ+nYDhwPa2suwEXt5XNw1SN/FaF04KrOuS0cjpraBsB4t2xHVFmFHT23e2V03QprEERUkBhM+l4aiVTSew0b6cduaIL1vU0kUkg/4b/xL40unXAPwR8QAAAAAElFTkSuQmCC')}
Last edited by Pastor Rick, 2/20/2018, 1:53 am
|
2/20/2018, 1:37 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|