flyimg/flyimg

View on GitHub
src/Core/Views/Default/index.php

Summary

Maintainability
A
0 mins
Test Coverage
A
100%
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="favicon.ico">

    <title>Flyimg App</title>

    <link rel="stylesheet" href="/css/bootstrap.min.css" crossorigin="anonymous">

    <!-- Custom styles for this template -->
    <link href="css/main.css" rel="stylesheet">
</head>

<body>

<div class="site-wrapper">

    <div class="site-wrapper-inner">

        <div class="cover-container">

            <div class="masthead clearfix">
                <div class="inner">
                    <h3 class="masthead-brand">Flyimg App</h3>

                </div>
            </div>

            <div class="inner cover">
                <p>
                    <img src="/upload/w_300/https://raw.githubusercontent.com/flyimg/graphic-assets/master/logo/raster/flyimg-logo-rgb.png">
                </p>
                <h2 id="hello-from-flyimg">Hello from Flyimg</h2>

                <h3 id="the-image-above-logo-has-been-served-using-flyimg.">The image above (logo) has been served using
                    flyimg.</h3>

                <p>how? Calling the source in the <code>&lt;img&gt;</code> like this:</p>

                <code>/upload/w_300/https://raw.githubusercontent.com/flyimg/graphic-assets/master/logo/raster/flyimg-logo-rgb.png</code>

                <p>It got transformed from the original file which was 6000px wide!</p>
                <p>Now, on the server, there is a cached version of this transformed image. There is no need to do the
                    transformation again next time someone requests this image.</p>
                <p>The best of all is that you get <em>Moz-jpeg</em> compression by default on all your JPEGs.</p>


                <h2 id="transformations">Transformations</h2>

                <p>You can do many different transformations to you images, like: <strong>quality</strong>,
                    <strong>face-crop</strong>, <strong>face-blur</strong>, <strong>width</strong>,
                    <strong>height</strong>,
                    <strong>crop</strong>, <strong>background</strong>, <strong>rotate</strong>, <strong>scale</strong>,
                    amongst
                    many others.</p>


                <p><a href="https://github.com/flyimg/flyimg" target="_blank">Check the docs for more info</a>.</p>
                <p>Happy imaging!</p>
            </div>

            <div class="mastfoot">
                <div class="inner">
                    <p><a href="https://flyimg.io" target="_blank">Flyimg.io</a></p>
                </div>
            </div>

        </div>

    </div>

</div>

</body>
</html>