wallabag/tests/Wallabag/ImportBundle/fixtures/wallabag-v1-read.json
2016-06-22 17:59:35 +02:00

53 lines
28 KiB
JSON
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

[
{
"0": "3",
"1": "Features - wallabag",
"2": "https://www.wallabag.org/features/",
"3": "0",
"4": "1",
"5": "\n\t\t<p>Here are some features. If one is missing, you can <a href=\"https://github.com/wallabag/wallabag\">open a new issue</a>.</p>\n<ul class=\"list-group\"><li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> wallabag is free and open source. Forever.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> No time to read? Save a link in your wallabag to read it later</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Read the saved articles in a comfortable view: the content, only the content</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You save all the content: text and pictures</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You can easily migrate from others private services.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You like an article? Share it by email, on twitter or in your <a href=\"https://github.com/sebsauvage/Shaarli\">shaarli</a></li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Because we are increasingly mobile, wallabag fits all your devices</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Saving a link is so easy because we provide you many tools: extensions for Chrome and Firefox, iOS, Android and Windows Phone application, a bookmarklet, a simple field in your config webpage. <a title=\"Download wallabag\" href=\"https://www.wallabag.org/downloads/\">You can download third-party applications here</a>.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> RSS feeds allows you to read your saved links in your RSS agregator</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You can set tags to your entries.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> wallabag is multilingual: french, english, spanish, german, italian, russian, persian, czech, polish, ukrainian and slovienian.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Youre not the only one at home to use wallabag? its good, wallabag is multi users</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You prefer a dark template? Perfect, many templates are available in the configuration screen</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Many storage allowed: sqlite, mysql and postgresql</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Scroll position is saved: when you return on an article, you come back where you was. So convenient!</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You can flattr flattrable articles directly from your wallabag</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You want to retrieve your wallabag datas? hey, remember, wallabag is open source, you can export it</li>\n</ul>",
"6": "1",
"id": "3",
"title": "Features - wallabag",
"url": "https://www.wallabag.org/features/",
"is_read": "0",
"is_fav": "1",
"content": "\n\t\t<p>Here are some features. If one is missing, you can <a href=\"https://github.com/wallabag/wallabag\">open a new issue</a>.</p>\n<ul class=\"list-group\"><li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> wallabag is free and open source. Forever.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> No time to read? Save a link in your wallabag to read it later</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Read the saved articles in a comfortable view: the content, only the content</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You save all the content: text and pictures</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You can easily migrate from others private services.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You like an article? Share it by email, on twitter or in your <a href=\"https://github.com/sebsauvage/Shaarli\">shaarli</a></li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Because we are increasingly mobile, wallabag fits all your devices</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Saving a link is so easy because we provide you many tools: extensions for Chrome and Firefox, iOS, Android and Windows Phone application, a bookmarklet, a simple field in your config webpage. <a title=\"Download wallabag\" href=\"https://www.wallabag.org/downloads/\">You can download third-party applications here</a>.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> RSS feeds allows you to read your saved links in your RSS agregator</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You can set tags to your entries.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> wallabag is multilingual: french, english, spanish, german, italian, russian, persian, czech, polish, ukrainian and slovienian.</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Youre not the only one at home to use wallabag? its good, wallabag is multi users</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You prefer a dark template? Perfect, many templates are available in the configuration screen</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Many storage allowed: sqlite, mysql and postgresql</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> Scroll position is saved: when you return on an article, you come back where you was. So convenient!</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You can flattr flattrable articles directly from your wallabag</li>\n<li class=\"list-group-item\"><span class=\"glyphicon glyphicon-ok\"></span> You want to retrieve your wallabag datas? hey, remember, wallabag is open source, you can export it</li>\n</ul>",
"user_id": "1",
"tags": ""
},
{
"0": "10",
"1": "Recreating The Square Slider",
"2": "http://gilbert.pellegrom.me/recreating-the-square-slider",
"3": "0",
"4": "0",
"5": "<p>The new <a href=\"https://squareup.com\">Square</a> site is lovely and I really like the slider they have on the homepage. So I decided to try and recreate it in a simple and reusable way.</p>\n\n<p> \n <a href=\"http://gilbert.pellegrom.me/demo/square-slider\">Demo</a> | <a href=\"http://dev7studios.com/downloads/50\">Download</a>\n</p>\n\n\n\n<h3>The HTML</h3>\n\n<pre class=\"language-markup\"><code>&lt;div class=\"square-slider\"&gt; \n &lt;div class=\"slide slide1\"&gt;\n &lt;div class=\"content light\"&gt;\n &lt;h3&gt;Recreating The Square Slider&lt;/h3&gt;\n &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros et augue vulputate \n aliquet pellentesque vitae tortor. Pellentesque mi velit, euismod nec semper&lt;/p&gt;\n &lt;/div&gt;\n &lt;img src=\"images/asset1.png\" alt=\"\" class=\"asset\" /&gt;\n &lt;/div&gt;\n &lt;div class=\"slide slide2\"&gt;\n &lt;div class=\"content dark\"&gt;\n &lt;h3&gt;Looks Amazing Right?&lt;/h3&gt;\n &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros et augue vulputate \n aliquet pellentesque vitae tortor. Pellentesque mi velit, euismod nec semper&lt;/p&gt;\n &lt;/div&gt;\n &lt;img src=\"images/asset2.png\" alt=\"\" class=\"asset\" /&gt;\n &lt;/div&gt;\n &lt;div class=\"slide slide3 inverted\"&gt;\n &lt;div class=\"content light\"&gt;\n &lt;h3&gt;And Simple To Use&lt;/h3&gt;\n &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros et augue vulputate \n aliquet pellentesque vitae tortor. Pellentesque mi velit, euismod nec semper&lt;/p&gt;\n &lt;/div&gt;\n &lt;img src=\"images/asset3.png\" alt=\"\" class=\"asset\" /&gt;\n &lt;/div&gt;\n &lt;a href=\"#\" class=\"prev\"&gt;Prev&lt;/a&gt;\n &lt;a href=\"#\" class=\"next\"&gt;Next&lt;/a&gt;\n &lt;div class=\"overlay\"&gt;&lt;/div&gt;\n&lt;/div&gt;</code></pre>\n\n<h3>The CSS</h3>\n\n<pre class=\"language-css\"><code>.square-slider { \n overflow: hidden;\n position: relative;\n background: #fff;\n}\n.square-slider .slide {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: none;\n opacity: 0;\n -moz-opacity: 0;\n -moz-transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n -webkit-transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n -o-transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n -moz-transform: translate3d(0, 0, 0);\n -webkit-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n.square-slider .slide:first-child { display: block; }\n.square-slider .slide:first-child,\n.square-slider .slide.active {\n opacity: 1;\n -moz-opacity: 1;\n}\n.square-slider .slide .content {\n position: absolute;\n top: 40%;\n left: 50%;\n margin-left: -450px;\n width: 360px;\n text-shadow: 0 1px 1px rgba(0,0,0,0.3);\n z-index: 7;\n -webkit-transition-property: -webkit-transform,opacity;\n -moz-transition-property: -moz-transform,opacity;\n -webkit-transition-duration: 800ms,700ms;\n -moz-transition-duration: 800ms,700ms;\n -webkit-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -moz-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -webkit-transform: translate3d(-30px, 0, 0);\n -moz-transform: translate(-30px, 0);\n}\n.square-slider .slide.inverted .content {\n left: auto;\n right: 50%;\n margin-left: 0;\n margin-right: -450px;\n -webkit-transform: translate3d(30px, 0, 0);\n -moz-transform: translate(30px, 0);\n}\n.square-slider .slide.active .content {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate(0, 0);\n}\n.square-slider .slide .asset {\n position: absolute;\n bottom: 0;\n left: 50%;\n -webkit-transition-property: -webkit-transform,opacity;\n -moz-transition-property: -moz-transform,opacity;\n -webkit-transition-duration: 800ms,700ms;\n -moz-transition-duration: 800ms,700ms;\n -webkit-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -moz-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate(0, 0);\n}\n.square-slider .slide.inverted .asset {\n left: auto;\n right: 50%;\n}\n.square-slider .slide.active .asset {\n -webkit-transform: translate3d(-7px, 3px, 0);\n -moz-transform: translate(-7px, 3px);\n}\n.square-slider .slide.inverted.active .asset {\n -webkit-transform: translate3d(7px, 3px, 0);\n -moz-transform: translate(7px, 3px);\n}\n.square-slider .prev,\n.square-slider .next {\n background: url(images/nav.png) no-repeat;\n display: block;\n width: 67px;\n height: 67px;\n position: absolute;\n top: 50%;\n margin-top: -30px;\n z-index: 10;\n border: 0;\n text-indent: -9999px;\n display: none;\n opacity: 0.6;\n -moz-opacity: 0.6;\n -webkit-transition: opacity 0.5s ease-in;\n -moz-transition: opacity 0.5s ease-in;\n -ms-transition: opacity 0.5s ease-in;\n -o-transition: opacity 0.5s ease-in;\n transition: opacity 0.5s ease-in;\n}\n.square-slider .prev { \n left: 40px; \n background-position: 0 100%;\n}\n.square-slider .next { right: 40px; }\n.square-slider .prev:hover,\n.square-slider .next:hover {\n opacity: 1;\n -moz-opacity: 1;\n}\n.square-slider .overlay {\n position: absolute;\n top: 0;\n left: -100%;\n width: 300%;\n height: 100%;\n z-index: 5;\n -moz-box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);\n -webkit-box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);\n box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);\n}\n\n\n.square-slider {\n width: 100%;\n height: 550px;\n margin: 40px auto;\n}\n.square-slider .slide .content.light { color: #fff; }\n.square-slider .slide .content.dark { \n color: #333; \n text-shadow: 0 1px 1px rgba(255,255,255,0.3);\n}\n.square-slider .slide1 { background: url(images/bg1.jpg) no-repeat 50% 50%; }\n.square-slider .slide2 { background: url(images/bg2.jpg) no-repeat 50% 50%; }\n.square-slider .slide3 { background: url(images/bg3.jpg) no-repeat 50% 50%; }</code></pre>\n\n<h3>The Javascript (jQuery)</h3>\n\n<pre class=\"language-javascript\"><code>(function($){\n\n $('.square-slider').each(function(){\n var slider = $(this),\n slides = slider.find('.slide'),\n currentSlide = 0;\n\n slides.show();\n $(slides[currentSlide]).addClass('active');\n $('.next,.prev', slider).show();\n\n $('.prev', slider).on('click', function(){\n slides.removeClass('active');\n currentSlide--;\n if(currentSlide &lt; 0) currentSlide = slides.length - 1;\n $(slides[currentSlide]).addClass('active');\n return false;\n });\n\n $('.next', slider).on('click', function(){\n slides.removeClass('active');\n currentSlide++;\n if(currentSlide &gt; slides.length - 1) currentSlide = 0;\n $(slides[currentSlide]).addClass('active');\n return false;\n });\n });\n\n})(window.jQuery);</code></pre>\n\n<h3>A Few Notes</h3>\n\n<ul><li>Feel free to <a href=\"http://dev7studios.com/downloads/50\">download the source</a> and customise and use it in your own sites. <strong>Dont</strong> use the images as they belong to <a href=\"https://squareup.com\">Square Inc</a>.</li>\n<li>Add the <code>.inverted</code> class to a <code>.slide</code> div to swap the position of the asset and content.</li>\n<li>Depending on the background youll want to use the <code>.light</code> or <code>.dark</code> class on the <code>.content</code> divs.</li>\n<li>This is pretty much cross browser (as in the slider itself will still work in most browsers, just not with the fancy transitions).</li>\n<li>If javascript is off (really?) it displays the first slide.</li>\n<li>Source code is Public domain.</li>\n</ul><p>Enjoy.</p>\n ",
"6": "1",
"id": "10",
"title": "Recreating The Square Slider",
"url": "http://gilbert.pellegrom.me/recreating-the-square-slider",
"is_read": "0",
"is_fav": "0",
"content": "<p>The new <a href=\"https://squareup.com\">Square</a> site is lovely and I really like the slider they have on the homepage. So I decided to try and recreate it in a simple and reusable way.</p>\n\n<p> \n <a href=\"http://gilbert.pellegrom.me/demo/square-slider\">Demo</a> | <a href=\"http://dev7studios.com/downloads/50\">Download</a>\n</p>\n\n\n\n<h3>The HTML</h3>\n\n<pre class=\"language-markup\"><code>&lt;div class=\"square-slider\"&gt; \n &lt;div class=\"slide slide1\"&gt;\n &lt;div class=\"content light\"&gt;\n &lt;h3&gt;Recreating The Square Slider&lt;/h3&gt;\n &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros et augue vulputate \n aliquet pellentesque vitae tortor. Pellentesque mi velit, euismod nec semper&lt;/p&gt;\n &lt;/div&gt;\n &lt;img src=\"images/asset1.png\" alt=\"\" class=\"asset\" /&gt;\n &lt;/div&gt;\n &lt;div class=\"slide slide2\"&gt;\n &lt;div class=\"content dark\"&gt;\n &lt;h3&gt;Looks Amazing Right?&lt;/h3&gt;\n &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros et augue vulputate \n aliquet pellentesque vitae tortor. Pellentesque mi velit, euismod nec semper&lt;/p&gt;\n &lt;/div&gt;\n &lt;img src=\"images/asset2.png\" alt=\"\" class=\"asset\" /&gt;\n &lt;/div&gt;\n &lt;div class=\"slide slide3 inverted\"&gt;\n &lt;div class=\"content light\"&gt;\n &lt;h3&gt;And Simple To Use&lt;/h3&gt;\n &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros et augue vulputate \n aliquet pellentesque vitae tortor. Pellentesque mi velit, euismod nec semper&lt;/p&gt;\n &lt;/div&gt;\n &lt;img src=\"images/asset3.png\" alt=\"\" class=\"asset\" /&gt;\n &lt;/div&gt;\n &lt;a href=\"#\" class=\"prev\"&gt;Prev&lt;/a&gt;\n &lt;a href=\"#\" class=\"next\"&gt;Next&lt;/a&gt;\n &lt;div class=\"overlay\"&gt;&lt;/div&gt;\n&lt;/div&gt;</code></pre>\n\n<h3>The CSS</h3>\n\n<pre class=\"language-css\"><code>.square-slider { \n overflow: hidden;\n position: relative;\n background: #fff;\n}\n.square-slider .slide {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: none;\n opacity: 0;\n -moz-opacity: 0;\n -moz-transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n -webkit-transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n -o-transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n transition: opacity 800ms cubic-bezier(0.51, 0.01, 0.37, 0.98) 100ms;\n -moz-transform: translate3d(0, 0, 0);\n -webkit-transform: translate3d(0, 0, 0);\n -o-transform: translate3d(0, 0, 0);\n -ms-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n.square-slider .slide:first-child { display: block; }\n.square-slider .slide:first-child,\n.square-slider .slide.active {\n opacity: 1;\n -moz-opacity: 1;\n}\n.square-slider .slide .content {\n position: absolute;\n top: 40%;\n left: 50%;\n margin-left: -450px;\n width: 360px;\n text-shadow: 0 1px 1px rgba(0,0,0,0.3);\n z-index: 7;\n -webkit-transition-property: -webkit-transform,opacity;\n -moz-transition-property: -moz-transform,opacity;\n -webkit-transition-duration: 800ms,700ms;\n -moz-transition-duration: 800ms,700ms;\n -webkit-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -moz-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -webkit-transform: translate3d(-30px, 0, 0);\n -moz-transform: translate(-30px, 0);\n}\n.square-slider .slide.inverted .content {\n left: auto;\n right: 50%;\n margin-left: 0;\n margin-right: -450px;\n -webkit-transform: translate3d(30px, 0, 0);\n -moz-transform: translate(30px, 0);\n}\n.square-slider .slide.active .content {\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate(0, 0);\n}\n.square-slider .slide .asset {\n position: absolute;\n bottom: 0;\n left: 50%;\n -webkit-transition-property: -webkit-transform,opacity;\n -moz-transition-property: -moz-transform,opacity;\n -webkit-transition-duration: 800ms,700ms;\n -moz-transition-duration: 800ms,700ms;\n -webkit-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -moz-transition-timing-function: cubic-bezier(0.51, 0.01, 0.37, 0.98);\n -webkit-transform: translate3d(0, 0, 0);\n -moz-transform: translate(0, 0);\n}\n.square-slider .slide.inverted .asset {\n left: auto;\n right: 50%;\n}\n.square-slider .slide.active .asset {\n -webkit-transform: translate3d(-7px, 3px, 0);\n -moz-transform: translate(-7px, 3px);\n}\n.square-slider .slide.inverted.active .asset {\n -webkit-transform: translate3d(7px, 3px, 0);\n -moz-transform: translate(7px, 3px);\n}\n.square-slider .prev,\n.square-slider .next {\n background: url(images/nav.png) no-repeat;\n display: block;\n width: 67px;\n height: 67px;\n position: absolute;\n top: 50%;\n margin-top: -30px;\n z-index: 10;\n border: 0;\n text-indent: -9999px;\n display: none;\n opacity: 0.6;\n -moz-opacity: 0.6;\n -webkit-transition: opacity 0.5s ease-in;\n -moz-transition: opacity 0.5s ease-in;\n -ms-transition: opacity 0.5s ease-in;\n -o-transition: opacity 0.5s ease-in;\n transition: opacity 0.5s ease-in;\n}\n.square-slider .prev { \n left: 40px; \n background-position: 0 100%;\n}\n.square-slider .next { right: 40px; }\n.square-slider .prev:hover,\n.square-slider .next:hover {\n opacity: 1;\n -moz-opacity: 1;\n}\n.square-slider .overlay {\n position: absolute;\n top: 0;\n left: -100%;\n width: 300%;\n height: 100%;\n z-index: 5;\n -moz-box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);\n -webkit-box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);\n box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);\n}\n\n\n.square-slider {\n width: 100%;\n height: 550px;\n margin: 40px auto;\n}\n.square-slider .slide .content.light { color: #fff; }\n.square-slider .slide .content.dark { \n color: #333; \n text-shadow: 0 1px 1px rgba(255,255,255,0.3);\n}\n.square-slider .slide1 { background: url(images/bg1.jpg) no-repeat 50% 50%; }\n.square-slider .slide2 { background: url(images/bg2.jpg) no-repeat 50% 50%; }\n.square-slider .slide3 { background: url(images/bg3.jpg) no-repeat 50% 50%; }</code></pre>\n\n<h3>The Javascript (jQuery)</h3>\n\n<pre class=\"language-javascript\"><code>(function($){\n\n $('.square-slider').each(function(){\n var slider = $(this),\n slides = slider.find('.slide'),\n currentSlide = 0;\n\n slides.show();\n $(slides[currentSlide]).addClass('active');\n $('.next,.prev', slider).show();\n\n $('.prev', slider).on('click', function(){\n slides.removeClass('active');\n currentSlide--;\n if(currentSlide &lt; 0) currentSlide = slides.length - 1;\n $(slides[currentSlide]).addClass('active');\n return false;\n });\n\n $('.next', slider).on('click', function(){\n slides.removeClass('active');\n currentSlide++;\n if(currentSlide &gt; slides.length - 1) currentSlide = 0;\n $(slides[currentSlide]).addClass('active');\n return false;\n });\n });\n\n})(window.jQuery);</code></pre>\n\n<h3>A Few Notes</h3>\n\n<ul><li>Feel free to <a href=\"http://dev7studios.com/downloads/50\">download the source</a> and customise and use it in your own sites. <strong>Dont</strong> use the images as they belong to <a href=\"https://squareup.com\">Square Inc</a>.</li>\n<li>Add the <code>.inverted</code> class to a <code>.slide</code> div to swap the position of the asset and content.</li>\n<li>Depending on the background youll want to use the <code>.light</code> or <code>.dark</code> class on the <code>.content</code> divs.</li>\n<li>This is pretty much cross browser (as in the slider itself will still work in most browsers, just not with the fancy transitions).</li>\n<li>If javascript is off (really?) it displays the first slide.</li>\n<li>Source code is Public domain.</li>\n</ul><p>Enjoy.</p>\n ",
"user_id": "1",
"tags": ""
},
{
"0": "11",
"1": "Jaime le logiciel libre",
"2": "http://framablog.org/2015/02/14/jaime-le-logiciel-libre/",
"3": "0",
"4": "0",
"5": "\n <p>Aujourdhui, cest la <em>Saint Valentin</em>, et loccasion de déclarer son amour des logiciels libres !</p>\n<p><a href=\"https://fsfe.org/campaigns/ilovefs/ilovefs.fr.html\"><img src=\"http://framablog.org/wp-content/uploads/2015/02/ilovefs-banner-extralarge.png\" alt=\"ilovefs-banner-extralarge\" width=\"627\" height=\"105\" class=\"aligncenter size-full wp-image-3239\" /></a></p>\n<p>Framasoft vous a déjà proposé <a href=\"http://framablog.org/2015/02/14/on-love-logiciel-libre/\">son adaptation délirante de poèmes</a> pour loccasion, et voici une petite bande-dessinée qui synthétise lévénement :</p>\n<p><a href=\"http://framablog.org/wp-content/uploads/2015/02/dm_001_jaime_le_logiciel_libre.jpg\"><img src=\"http://framablog.org/wp-content/uploads/2015/02/dm_001_jaime_le_logiciel_libre.jpg\" alt=\"dm_001_jaime_le_logiciel_libre\" width=\"800\" height=\"1200\" class=\"aligncenter size-full wp-image-3265\" /></a></p>\n<p>Cette bande-dessinée est extraite du nouveau blog <a href=\"http://grisebouille.net/\">Grise Bouille</a> hébergé par Framasoft.</p>\n<p><em>Crédit : <a href=\"http://grisebouille.net/\">Simon Gee Giraudot</a> (Creative Commons By-Sa)</em></p>\n<div title=\"Diaspora*\"><a><span><img src=\"http://www.framablog.org/wp-content/uploads/2015/01/diaspora.jpg\" alt=\"\" /></span></a></div><div class=\"twoclick-js\"></div><div><h3><a href=\"http://framablog.org/author/gee/\" title=\"All posts by Gee\">Gee</a></h3><div class=\"bio-gravatar\"><img alt=\"\" src=\"http://0.gravatar.com/avatar/4f71e4ffe5d4d9d89b16949563cd41f3?s=90&amp;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D90&amp;r=G\" class=\"avatar pull-left media-object avatar-90 photo\" height=\"90\" width=\"90\" /></div><a href=\"http://ptilouk.net/\" class=\"bio-icon bio-icon-website\"></a><a href=\"https://framasphere.org/u/gee\" class=\"bio-icon bio-icon-facebook\"></a><a href=\"https://twitter.com/ptilouk\" class=\"bio-icon bio-icon-twitter\"></a><p class=\"bio-description\">Auteur/dessinateur de bandes dessinées (Le Geektionnerd, Superflu, Bastards Inc, etc.) et doctorant en informatique sur son temps salarié.</p></div> ",
"6": "1",
"id": "11",
"title": "Jaime le logiciel libre",
"url": "http://framablog.org/2015/02/14/jaime-le-logiciel-libre/",
"is_read": "0",
"is_fav": "0",
"content": "\n <p>Aujourdhui, cest la <em>Saint Valentin</em>, et loccasion de déclarer son amour des logiciels libres !</p>\n<p><a href=\"https://fsfe.org/campaigns/ilovefs/ilovefs.fr.html\"><img src=\"http://framablog.org/wp-content/uploads/2015/02/ilovefs-banner-extralarge.png\" alt=\"ilovefs-banner-extralarge\" width=\"627\" height=\"105\" class=\"aligncenter size-full wp-image-3239\" /></a></p>\n<p>Framasoft vous a déjà proposé <a href=\"http://framablog.org/2015/02/14/on-love-logiciel-libre/\">son adaptation délirante de poèmes</a> pour loccasion, et voici une petite bande-dessinée qui synthétise lévénement :</p>\n<p><a href=\"http://framablog.org/wp-content/uploads/2015/02/dm_001_jaime_le_logiciel_libre.jpg\"><img src=\"http://framablog.org/wp-content/uploads/2015/02/dm_001_jaime_le_logiciel_libre.jpg\" alt=\"dm_001_jaime_le_logiciel_libre\" width=\"800\" height=\"1200\" class=\"aligncenter size-full wp-image-3265\" /></a></p>\n<p>Cette bande-dessinée est extraite du nouveau blog <a href=\"http://grisebouille.net/\">Grise Bouille</a> hébergé par Framasoft.</p>\n<p><em>Crédit : <a href=\"http://grisebouille.net/\">Simon Gee Giraudot</a> (Creative Commons By-Sa)</em></p>\n<div title=\"Diaspora*\"><a><span><img src=\"http://www.framablog.org/wp-content/uploads/2015/01/diaspora.jpg\" alt=\"\" /></span></a></div><div class=\"twoclick-js\"></div><div><h3><a href=\"http://framablog.org/author/gee/\" title=\"All posts by Gee\">Gee</a></h3><div class=\"bio-gravatar\"><img alt=\"\" src=\"http://0.gravatar.com/avatar/4f71e4ffe5d4d9d89b16949563cd41f3?s=90&amp;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D90&amp;r=G\" class=\"avatar pull-left media-object avatar-90 photo\" height=\"90\" width=\"90\" /></div><a href=\"http://ptilouk.net/\" class=\"bio-icon bio-icon-website\"></a><a href=\"https://framasphere.org/u/gee\" class=\"bio-icon bio-icon-facebook\"></a><a href=\"https://twitter.com/ptilouk\" class=\"bio-icon bio-icon-twitter\"></a><p class=\"bio-description\">Auteur/dessinateur de bandes dessinées (Le Geektionnerd, Superflu, Bastards Inc, etc.) et doctorant en informatique sur son temps salarié.</p></div> ",
"user_id": "1",
"tags": "framasoft,tag"
}
]