index.html

<!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="" />
        <title>IntuneCD</title>
        <!-- Favicon-->
        <link rel="icon" type="image/x-icon" href="pages/assets/favicon.ico" />
        <!-- Bootstrap icons-->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
        <!-- Google fonts-->
        <link href="https://fonts.googleapis.com/css?family=Dosis:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
        <!-- Core theme CSS (includes Bootstrap)-->
        <link href="pages/css/styles.css" rel="stylesheet" />
    </head>
    <body>
        <!-- Navigation-->
        <nav class="navbar navbar-light bg-light static-top">
            <div class="container text-center">
                <div class="col-sm">
                    <a class="navbar-brand" href="https://github.com/almenscorner/intunecd">IntuneCD</a>
                </div>
                <div class="col-sm">
                    <a class="navbar-brand" href="https://github.com/almenscorner/intunecd-monitor">IntuneCD Monitor</a>
                </div>
                <div class="col-sm">
                    <a class="navbar-brand" href="https://www.linkedin.com/groups/9269061/">LinkedIn group</a>
            </div>
            <div class="col-sm">
                <a class="navbar-brand" href="https://intunecd.slack.com">Slack</a>
        </div>
        <div class="col-sm">
            <a class="navbar-brand" href="https://discord.gg/msems">Discord</a>
    </div>
        </nav>
        <!-- Masthead-->
        <header class="masthead">
            <div class="container position-relative">
                <div class="row justify-content-center">
                    <div class="col-xl-6">
                        <div class="container-sm">
                            <img src="https://user-images.githubusercontent.com/78877636/204297420-4b5373a8-4864-4710-a4a5-802ea4ec08d5.png#gh-dark-mode-only" class="img-fluid">
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <!-- Icons Grid-->
        <section class="features-icons bg-light text-center">
            <div class="container">
                <div class="row">
                    <div class="col">
                        <div class="features-icons-item mx-auto mb-5 mb-lg-0 mb-lg-3">
                            <div class="features-icons-icon d-flex"><i class="bi-cloud-download m-auto text-primary"></i></div>
                            <h3>Backup</h3>
                            <p class="lead mb-0">Backup your Intune tenant in JSON or YAML, locally or in a pipeline!</p>
                        </div>
                    </div>
                    <div class="col">
                        <div class="features-icons-item mx-auto mb-5 mb-lg-0 mb-lg-3">
                            <div class="features-icons-icon d-flex"><i class="bi-cloud-upload m-auto text-primary"></i></div>
                            <h3>Update</h3>
                            <p class="lead mb-0">Automatically update configurations or create them!</p>
                        </div>
                    </div>
                    <div class="col">
                        <div class="features-icons-item mx-auto mb-0 mb-lg-3">
                            <div class="features-icons-icon d-flex"><i class="bi-markdown m-auto text-primary"></i></div>
                            <h3>Document</h3>
                            <p class="lead mb-0">Generate documentation based on the backup, never have out of date documentation again!</p>
                        </div>
                    </div>
                    <div class="col">
                        <div class="features-icons-item mx-auto mb-0 mb-lg-3">
                            <div class="features-icons-icon d-flex"><i class="bi-graph-up m-auto text-primary"></i></div>
                            <h3>Monitor</h3>
                            <p class="lead mb-0">Get an overview of how many changes is happening to your configurations!</p>
                        </div>
                    </div>
                    <div class="col">
                        <div class="features-icons-item mx-auto mb-0 mb-lg-3">
                            <div class="features-icons-icon d-flex"><i class="bi-door-open m-auto text-primary"></i></div>
                            <h3>Open source</h3>
                            <p class="lead mb-0">Don't pay anything to run Intune as code, IntuneCD is open source and free to run!</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Image Showcases-->
        <section class="showcase">
            <div class="container-fluid p-0">
                <div class="row g-0">
                    <div class="col-lg-6 order-lg-2 text-white showcase-img" style="background-image: url('pages/assets/img/bg-showcase-1.jpg')"></div>
                    <div class="col-lg-6 order-lg-1 my-auto showcase-text">
                        <h2>Run anywhere</h2>
                        <p class="lead mb-0">You can use this tool to backup and update locally from your own terminal or in an Azure DevOps pipeline, GitHub actions or even from the front end!</p>
                    </div>
                </div>
                <div class="row g-0">
                    <div class="col-lg-6 text-white showcase-img" style="background-image: url('pages/assets/img/bg-showcase-2.jpg')"></div>
                    <div class="col-lg-6 my-auto showcase-text">
                        <h2>Increase security</h2>
                        <p class="lead mb-0">By backing up a development environment and updating production based on changes made in development using IntuneCD, you can reduce admin permissions needed in production and make sure no unwanted changes are published!</p>
                    </div>
                </div>
                <div class="row g-0">
                    <div class="col-lg-6 order-lg-2 text-white showcase-img" style="background-image: url('pages/assets/img/bg-showcase-3.png')"></div>
                    <div class="col-lg-6 order-lg-1 my-auto showcase-text">
                        <h2>Get an overview</h2>
                        <p class="lead mb-0">Monitor changes made to your tenants over time and get an overview on what configurations has changed and how many changes that has been made!</p>
                    </div>
                </div>
            </div>
        </section>
        <!-- Testimonials-->
        <section class="testimonials text-center bg-light">
            <div class="container">
                <h2 class="mb-5">What people are saying...</h2>
                <div class="row">
                    <div class="col-lg-4">
                        <div class="testimonial-item mx-auto mb-5 mb-lg-0">
                            <h5>@randomsunrize</h5>
                            <p class="font-weight-light mb-0">"It will be good to backup and try monitor changes"</p>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="testimonial-item mx-auto mb-5 mb-lg-0">
                            <h5>Jenthe J.</h5>
                            <p class="font-weight-light mb-0">"it works as a charm 😄"</p>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="testimonial-item mx-auto mb-5 mb-lg-0">
                            <h5>Aaron P.</h5>
                            <p class="font-weight-light mb-0">"IntuneCD Monitor by @almenscorner is up and running  in my lab and it’s real damn cool"</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Call to Action-->
        <section class="call-to-action text-white text-center" id="signup">
            <div class="container position-relative">
                <div class="row justify-content-center">
                    <div class="col-xl-3 mb-4">
                        <h2 class="mb-4">Get started now!</h2>
                        <div class="col-auto">
                            <a class="btn btn-primary btn-lg" href="https://github.com/almenscorner/intunecd#install-this-package">Get started</a>
                        </div>
                    </div>
                    <div class="col-xl-3 mb-4">
                        <h2 class="mb-4">Follow on X!</h2>
                        <div class="col-auto">
                            <a class="btn btn-primary btn-lg" href="https://twitter.com/intunecd">Follow</a>
                        </div>
                    </div>
                    <div class="col-xl-3 mb-4">
                        <h2 class="mb-4">Leave a ⭐️ on GitHub!</h2>
                        <div class="col-auto">
                            <a class="btn btn-primary btn-lg" href="https://github.com/almenscorner/intunecd">Make it shine</a>
                        </div>
                    </div>
                    <div class="col-xl-3 mb-4">
                        <h2 class="mb-4">Join IntuneCD Slack!</h2>
                        <div class="col-auto">
                            <a class="btn btn-primary btn-lg" href="https://join.slack.com/t/intunecd/shared_invite/zt-1nf255xvo-POv60XoewYfY65TH9~tV_g">Join</a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Footer-->
        <footer class="footer bg-light">
            <div class="container">
                <div class="row">
                    <div class="col-lg-6 h-100 text-center text-lg-start my-auto">
                        <!---<ul class="list-inline mb-2">
                            <li class="list-inline-item"><a href="#!" class="text-primary">About</a></li>
                            <li class="list-inline-item">⋅</li>
                            <li class="list-inline-item"><a href="#!" class="text-primary">Contact</a></li>
                        </ul>--->
                        <p class="text-muted small mb-4 mb-lg-0">&copy; IntuneCD 2024. All Rights Reserved.</p>
                    </div>
                    <div class="col-lg-6 h-100 text-center text-lg-end my-auto">
                        <ul class="list-inline mb-0">
                            <li class="list-inline-item me-4">
                                <a href="https://github.com/almenscorner/intunecd"><i class="bi-github text-primary fs-3"></i></a>
                            </li>
                            <li class="list-inline-item me-4">
                                <a href="https://twitter.com/intunecd"><i class="bi-twitter text-primary fs-3"></i></a>
                            </li>
                            <li class="list-inline-item">
                                <a href="https://www.linkedin.com/company/intunecd"><i class="bi-linkedin text-primary fs-3"></i></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </footer>
        <!-- Bootstrap core JS-->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
        <!-- Core theme JS-->
        <script src="pages/js/scripts.js"></script>
        <script src="https://cdn.startbootstrap.com/sb-forms-latest.js"></script>
    </body>
</html>