index.ru.tpl.html

<!DOCTYPE html>
<html lang="ru">
<head>
    <title>Content-Security-Policy в dev и test окружениях.</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="https://shwr.me/shower/themes/ribbon/styles/styles.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css">

    <style>
        .shower {
            --slide-ratio: calc(16 / 10);
        }

        mark > mark.important {
            z-index: 2;
        }

        .slide-debug-name {
            position: absolute;
            top: 0;
            left: 0;
            font-size: 8px;
            z-index: 100500;
            background: #ddd;
            line-height: 8px;
        }

        .success-img {
            display: block;
            position: absolute;
            bottom: 5%;
            right: 0;
            z-index: 10;
            width: 20%;
            height: 36%;
            background: url('http://ed.titov.im/minskjs-feb-2020/pictures/success.png');
            background-size: cover;
        }

        .danger-img {
            display: block;
            position: absolute;
            bottom: 5%;
            right: 1%;
            z-index: 10;
            width: 22%;
            height: 31%;
            background: url('http://ed.titov.im/minskjs-feb-2020/pictures/danger.jpeg');
            background-size: cover;
        }
    </style>
</head>
<body class="shower list">

<header class="caption">
    <h1>CSP в dev среде.
        <small style="font-size: 60%;">боль и необходимость.</small>
    </h1>
</header>

<!-- SLIDES START -->
<!-- SLIDES END -->


<div class="progress"></div>

<script src="https://shwr.me/shower/shower.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>

<script>
    document.addEventListener('DOMContentLoaded', (event) => {
        document.querySelectorAll('pre code').forEach((block) => {
            if(!block.classList.contains('no-hljs')){
                hljs.highlightBlock(block);
            }
        });
    });
</script>

</body>
</html>