liuffy.github.io/open.html at master · liuffy/liuffy.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html lang="en">
  <head>
    <link rel="apple-touch-icon" sizes="180x180" href="img/favicon/apple-touch-icon.png">
    <link rel="icon" type="image/png" href="img/favicon/favicon-32x32.png" sizes="32x32">
    <link rel="icon" type="image/png" href="img/favicon/favicon-16x16.png" sizes="16x16">
    <link rel="manifest" href="img/favicon/manifest.json">
    <link rel="mask-icon" href="img/favicon/safari-pinned-tab.svg">
    <link rel="shortcut icon" href="img/favicon/favicon.ico">
    <meta name="msapplication-config" content="img/favicon/browserconfig.xml">
    <meta name="theme-color" content="#ffffff">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/animsition.min.css">
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/owl.carousel.css">
    <link rel="stylesheet" href="css/font-awesome.css">
    <link rel="stylesheet" href="css/animate.css">
    <link rel="stylesheet" href="css/magnific-popup.css">
    <link rel="stylesheet" href="css/graph.css">
    <link rel="stylesheet" href="css/main.css">
    <title> | Open </title>
    <link rel="stylesheet" href="css/light.css">
  </head>
  <body class="animsition">
    <div class="showbox">
      <div class="loader">
        <svg viewBox="25 25 50 50" class="circular">
          <circle cx="50" cy="50" r="20" fill="none" stroke-width="6" stroke-miterlimit="10" class="path"></circle>
        </svg>
      </div>
    </div>
    <div class="background"></div>
    <div class="flex-wrapper">
      <div class="main-content align-center">
        <div class="container-fluid">
          <div class="row">
            <div class="container">
              <div class="row">
                <div class="col-md-7 col-md-offset-1 visible-lg visible-md">
                  <div class="open-project-lightbox">


                  <a href="img/portfolio/open/open0.png"><span class="plus"><span></span><span></span></span>
                  <img alt="" src="img/portfolio/open/open0.png"></a>

                  <a href="img/portfolio/open/open1.png"><span class="plus"><span></span><span></span></span>
                  <img alt="" src="img/portfolio/open/open1.png"></a>

                  <a href="img/portfolio/open/open2.png"><span class="plus"><span></span><span></span></span><img alt="" src="img/portfolio/open/open2.png"></a>

                  <a href="img/portfolio/open/open3.png"><span class="plus"><span></span><span></span></span><img alt="" src="img/portfolio/open/open3.png"></a></div>

                </div>
                <div class="col-md-3 col-md-offset-0 col-sm-8 col-sm-offset-1 project-description">
                  <h5 class="text-1-opacity">Open - Chrome Extension </h5>
                  <p>Open is a Google Chrome Extension that lets you check if a business is open without navigating to external websites. All data retrieved comes from the Yelp Fusion API. In addition to using standard Chrome extension technology (JavaScript, HTML, and CSS), it also uses React/Redux to handle state.</p>

                  <p><span class="cool-feature">Cool feature:</span> Open displays different information depending on the current state of the business; if open, page displays
                  the hour it will close for that day; if closed, displays the next hour and day it will be open.
                  </p>
                  <div class="project-info">
                    <p><span class="info text-uppercase">client</span><span class="info-description"> Personal Project</span></p>
                    <p><span class="info text-uppercase">completed</span><span class="info-description"> March 2017</span></p>
                    <p><span class="info text-uppercase">github</span><span class="info-description"><a href="https://github.com/liuffy/Open" target="_blank">Open</a></span></p>
                    <p><span class="info text-uppercase">download</span><span class="info-description"><a href="https://chrome.google.com/webstore/detail/open/eopgolhpjpkpkkbjenhicbajeodohbae?authuser=1o" target="_blank">Chrome Store</a></span></p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="container navigation">
      <div class="portfolio-open-nav"><a href="tracktive.html" class="prev animsition-link"><i class="fa fa-angle-left"></i>prev</a><a href="sleep.html" class="next animsition-link">next<i class="fa fa-angle-right"></i></a>
      <a href="portfolio.html" class="close animsition-link back">EXIT</a></div>
    </div>
    <script>
      if(/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) {
          document.write('<script src="js/browser-polyfill.min.js"><\/script>');
          document.write('<script src="js/innersvg.js"><\/script>');
      }
    </script>
    <script src="js/jquery-2.1.1.min.js"></script>
    <script src="js/animsition.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/owl.carousel.min.js"></script>
    <script src="js/jquery.nicescroll.min.js"></script>
    <script src="js/isotope.pkgd.js"></script>
    <script src="js/masonry-horizontal.js"></script>
    <script src="js/imagesloaded.pkgd.min.js"></script>
    <script src="js/jquery.magnific-popup.min.js"></script>
    <script src="js/graph.js"></script>
    <script src="js/main.js"></script>
  </body>
</html>