JSFiddle - React, Tailwind, and code Playground
by Jan Hjørdie
HTML
<script src="//nørdefabrikken.dk/wp-content/plugins/revslider/rs-plugin/js/jquery.themepunch.tools.min.js?ver=4.6.5"></script>
<script src="//nørdefabrikken.dk/wp-content/plugins/revslider/rs-plugin/js/jquery.themepunch.revolution.min.js?ver=4.6.5"></script>
<!-- START REVOLUTION SLIDER 4.6.5 fullwidth mode -->
<div id="rev_slider_1_1" class="rev_slider fullwidthabanner revslider-initialised tp-simpleresponsive" style="max-height: 350px; height: 350px; backface-visibility: hidden; transform-style: preserve-3d; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.00166, 0, 0, 0, 1); perspective: 2500px;">
<ul class="tp-revslider-mainul" style="display: block; overflow: hidden; width: 100%; height: 100%; max-height: 350px;"> <!-- SLIDE -->
<li data-transition="random" data-slotamount="7" data-masterspeed="300" data-saveperformance="off" class="tp-revslider-slidesli active-revslide" style="width: 100%; height: 100%; overflow: hidden; z-index: 20; visibility: inherit; opacity: 1; position: absolute;">
<!-- MAIN IMAGE -->
<div class="slotholder" style="width:100%;height:100%;" data-duration="undefined" data-zoomstart="undefined" data-zoomend="undefined" data-rotationstart="undefined" data-rotationend="undefined" data-ease="undefined" data-bgpositionend="undefined" data-bgposition="center top" data-kenburns="undefined" data-easeme="undefined" data-bgfit="cover" data-bgfitend="undefined" data-owidth="undefined" data-oheight="undefined"><div class="tp-bgimg defaultimg" data-lazyload="undefined" data-bgfit="cover" data-bgposition="center top" data-bgrepeat="no-repeat" data-lazydone="undefined" src="http://xn--nrdefabrikken-bnb.dk/wp-content/uploads/MacbookAir.jpg" data-src="http://xn--nrdefabrikken-bnb.dk/wp-content/uploads/MacbookAir.jpg" style="width: 100%; height: 100%; opacity: 0; visibility: hidden; background-image: url(http://xn--nrdefabrikken-bnb.dk/wp-content/uploads/MacbookAir.jpg); background-color: rgba(0, 0, 0, 0); background-size: cover;...CSS
/*-----------------------------------------------------------------------------
- Revolution Slider 4.1 Captions -
Screen Stylesheet
version: 1.4.5
date: 27/11/13
author: themepunch
email: [email protected]
website: http://www.themepunch.com
-----------------------------------------------------------------------------*/
@font-face {
font-family: 'revicons';
src: url('../font/revicons.eot?5510888');
src: url('../font/revicons.eot?5510888#iefix') format('embedded-opentype'),
url('../font/revicons.woff?5510888') format('woff'),
url('../font/revicons.ttf?5510888') format('truetype'),
url('../font/revicons.svg?5510888#revicons') format('svg');
font-weight: normal;
font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'revicons';
src: url('../font/revicons.svg?5510888#revicons') format('svg');
}
}
*/
[class^="revicon-"]:before, [class*=" revicon-"]:before {
font-family: "revicons";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
/* opacity: .8; */
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
margin-left: .2em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.revicon-search-1:before { content: '\e802'; } /* 'î ‚' */
.revicon-pencil-1:before { content: '\e831'; }...