projects.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>DSC Projects Showcase</title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="author" content="DSC University Name">
    <meta name="description" content="Discover edgy project built by our Developer Student Club for our local community.">
    <meta name="keywords" content="dsc,developer student clubs,google developers, sub saharan africa, students, technology, computer science">
    <meta name="theme-color" content="#2F5BE7">
    <link href="src/css/ionicons.min.css" rel="stylesheet">
    <link rel="manifest" href="manifest.json">
    <link rel="icon" href="images/icon.png" type="image/png">
    <link rel="stylesheet" href="src/css/owl.carousel.min.css">
    <link rel="stylesheet" href="src/css/bootstrap.min.css">
    <link href="https://fonts.googleapis.com/css?family=Google+Sans:400,500,700|Material+Icons" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="src/css/pace-theme.css">
    <link rel="stylesheet" href="src/css/styles.css">
    <link rel="stylesheet" href="src/css/responsive.css">
    <script>(function (i, s, o, g, r, a, m) {
            i['GoogleAnalyticsObject'] = r;
            i[r] = i[r] || function () {
                (i[r].q = i[r].q || []).push(arguments)
            }, i[r].l = 1 * new Date();
            a = s.createElement(o),
                m = s.getElementsByTagName(o)[0];
            a.async = 1;
            a.src = g;
            m.parentNode.insertBefore(a, m)
        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
        ga('create', 'UA-124904500-1', 'auto');
        ga('send', 'pageview');</script>
</head>

<body class="x-hidden has-sticky-header">
    <nav class="navbar navbar-expand-lg fixed-top custom-menu custom-menu__light">
        <div class="container"><a class="navbar-brand" href="#"><img src="src/images/showcase.png" height="35" alt="Image"> </a><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span class="menu-icon__circle"></span> <span class="menu-icon"><span class="menu-icon__bar"></span> <span class="menu-icon__bar"></span> <span class="menu-icon__bar"></span></span></button>
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav ml-lg-auto">
                    <li class="nav-item active"><a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a></li>
                    <li class="nav-item"><a href="learn.html" target="_blank" rel="noopener noreferrer" class="nav-link">Learn</a></li>
                    <li class="nav-item"><a href="index.html" target="_blank" rel="noopener noreferrer" class="nav-link">Stories</a></li>
                </ul>
                <div class="custom-menu__right"><a href="#" class="btn btn-primary btn-pills" target="_blank">Submit a project</a></div>
            </div>
        </div>
    </nav>
    <section id="web" class="section-spacer">
        <header class="section-header text-center">
            <h2 class="section-title">Web projects & experiments</h2>
        </header>
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-12">
                    <div class="card project-card">
                        <div class="cardheader">
                            <div class="img-top"><img src="src/images/assets/technologies/cloud.png" alt="Card image cap"></div>
                            <h5 class="card-title">Project title</h5>
                        </div>
                        <div class="card-body">
                            <div class="project-tag">
                                <p class="tagging stack1">HTML</p>
                                <p class="tagging stack2">Css</p>
                                <p class="tagging stack3">PWA</p>
                            </div>
                            <p class="card-text">Quick sample text to create the Project title and make up the body of the card's content.<br>Ensure you keep it brief, short and to the point. We don't want to give out too many details, do we?</p><a href="#" class="btn btn-primary float-right">View project</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 col-12">
                    <div class="card project-card">
                        <div class="cardheader">
                            <div class="img-top"><img src="src/images/assets/technologies/cloud.png" alt="Card image cap"></div>
                            <h5 class="card-title">Project title</h5>
                        </div>
                        <div class="card-body">
                            <div class="project-tag">
                                <p class="tagging stack1">HTML</p>
                                <p class="tagging stack2">Css</p>
                                <p class="tagging stack3">PWA</p>
                            </div>
                            <p class="card-text">Quick sample text to create the Project title and make up the body of the card's content.<br>Ensure you keep it brief, short and to the point. We don't want to give out too many details, do we?</p><a href="#" class="btn btn-primary float-right">View project</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 col-12">
                    <div class="card project-card">
                        <div class="cardheader">
                            <div class="img-top"><img src="src/images/assets/technologies/cloud.png" alt="Card image cap"></div>
                            <h5 class="card-title">Project title</h5>
                        </div>
                        <div class="card-body">
                            <div class="project-tag">
                                <p class="tagging stack1">HTML</p>
                                <p class="tagging stack2">Css</p>
                                <p class="tagging stack3">PWA</p>
                            </div>
                            <p class="card-text">Quick sample text to create the Project title and make up the body of the card's content.<br>Ensure you keep it brief, short and to the point. We don't want to give out too many details, do we?</p><a href="#" class="btn btn-primary float-right">View project</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <header class="section-header text-center">
        <h2 class="section-title">Android projects & experiments</h2>
    </header>
    <section id="android" class="section-spacer">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-12">
                    <div class="card project-card">
                        <div class="cardheader">
                            <div class="img-top"><img src="src/images/assets/technologies/android.png" alt="Card image cap"></div>
                            <h5 class="card-title">Project title</h5>
                        </div>
                        <div class="card-body">
                            <div class="project-tag">
                                <p class="tagging stack1">Kotlin</p>
                                <p class="tagging stack2">Android</p>
                                <p class="tagging stack3">Open Source</p>
                            </div>
                            <p class="card-text">Quick sample text to create the Project title and make up the body of the card's content.<br>Ensure you keep it brief, short and to the point. We don't want to give out too many details, do we?</p><a href="#" class="btn btn-primary float-right">View project</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 col-12">
                    <div class="card project-card">
                        <div class="cardheader">
                            <div class="img-top"><img src="src/images/assets/technologies/android.png" alt="Card image cap"></div>
                            <h5 class="card-title">Project title</h5>
                        </div>
                        <div class="card-body">
                            <div class="project-tag">
                                <p class="tagging stack1">Kotlin</p>
                                <p class="tagging stack2">Android</p>
                                <p class="tagging stack3">Open Source</p>
                            </div>
                            <p class="card-text">Quick sample text to create the Project title and make up the body of the card's content.<br>Ensure you keep it brief, short and to the point. We don't want to give out too many details, do we?</p><a href="#" class="btn btn-primary float-right">View project</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 col-12">
                    <div class="card project-card">
                        <div class="cardheader">
                            <div class="img-top"><img src="src/images/assets/technologies/android.png" alt="Card image cap"></div>
                            <h5 class="card-title">Project title</h5>
                        </div>
                        <div class="card-body">
                            <div class="project-tag">
                                <p class="tagging stack1">Kotlin</p>
                                <p class="tagging stack2">Android</p>
                                <p class="tagging stack3">Open Source</p>
                            </div>
                            <p class="card-text">Quick sample text to create the Project title and make up the body of the card's content.<br>Ensure you keep it brief, short and to the point. We don't want to give out too many details, do we?</p><a href="#" class="btn btn-primary float-right">View project</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <footer class="section-spacer footer-section">
        <div class="container">
            <div class="row flex-column-reverse flex-sm-row flex-lg-row">
                <div class="col-md-4 col-12">
                    <div class="footer-widget first-of-footer-widget"><img src="src/images/footer-logo.png" class="logo-sm mb-10" alt="Image">
                        <p>Copyright &copy; 2019. All Rights Reserved.</p><span>Feel free to drop us an email at </span><a href="mailto:team@dsc.scuniversityname.org">team@dscuniversityname.org</a>
                        <ul class="social-list__inline mt-10">
                            <li><a href="https://twitter.com/DSCUniversityName"><i class="fab fa-twitter"></i></a></li>
                            <li><a href="https://github.com/DSCUniversityName"><i class="fab fa-github"></i></a></li>
                            <li><a href=""><i class="fab fa-slack"></i></a></li>
                            <li><a href="https://www.youtube.com/user/GoogleDevelopers"><i class="fab fa-youtube"></i></a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-md-8 col-sm-10">
                    <div class="row">
                        <div class="col-md-4 col-6">
                            <div class="footer-widget">
                                <h4 class="footer-widget__title">Programs</h4>
                                <ul class="list-unstyled">
                                    <li><a href="https://www.womentechmakers.com/" target="_blank" rel="noopener noreferrer">Women Techmakers</a></li>
                                    <li><a href="https://developers.google.com/experts/" target="_blank" rel="noopener noreferrer">Google Developer Experts</a></li>
                                    <li><a href="https://developers.google.com" target="_blank" rel="noopener noreferrer">Google Developer Groups</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-md-4 col-6">
                            <div class="footer-widget">
                                <h4 class="footer-widget__title">Developers</h4>
                                <ul>
                                    <li class="list-unstyled"></li>
                                    <li><a href="https://github.com/DSCUniversityName" target="_blank" rel="noopener noreferrer">Partner</a></li>
                                    <li><a href="https://github.com/DSCLEADSAfrica" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                                    <li><a href="https://developer.android.com/dev-summit/community-guidelines/" target="_blank" rel="noopener noreferrer">Code of conduct</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="footer-widget">
                                <h4 class="footer-widget__title">Contribute</h4>
                                <ul class="list-unstyled">
                                    <li><a href="https://github.com/kelvinkamau/Vibranium/issues/new?template=documentation-bug.md" target="_blank" rel="noopener noreferrer">File a bug</a></li>
                                    <li><a href="https://github.com/kelvinkamau/Vibranium" target="_blank" rel="noopener noreferrer">View source</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer><a href="#" id="scroll" style="display: none;"><i class="fas fa-angle-up"></i></a>
    <script src="src/js/vendors/pace.js"></script>
    <script src="src/js/vendors/jquery.min.js"></script>
    <script src="src/js/vendors/bootstrap.bundle.min.js"></script>
    <script src="src/js/vendors/jquery.magnific-popup.min.js"></script>
    <script src="src/js/vendors/jquery.easing.min.js"></script>
    <script src="src/js/vendors/swiper.min.js"></script>
    <script src="src/js/vendors/owl.carousel.min.js"></script>
    <script src="src/js/custom.js"></script>
</body>

</html>