BootstrapPortfolioProject/src/index.html at 46e8e1ac2e12170be77e1c3be0d2a56245f0fac8 · codeschool-projects/BootstrapPortfolioProject · 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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <link rel="stylesheet" href="main.css">
  <title>HTML Portfolio</title>

</head>
<body>

  <nav class="navbar navbar-default">
    <div class="container">
      <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#portfolio-collapse-menu">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
        <a class="navbar-brand" href="#">katie</a>
      </div>

      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse" id="portfolio-collapse-menu">
        <ul class="nav navbar-nav">
          <li><a href="#">Home</a></li>
          <li><a href="#">About</a></li>
        </ul>
      </div>
      <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
  </nav>

  <div id="portfolio-carousel" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#portfolio-carousel" data-slide-to="0" class="active"></li>
      <li data-target="#portfolio-carousel" data-slide-to="1"></li>
      <li data-target="#portfolio-carousel" data-slide-to="2"></li>
    </ol>
    <div class="carousel-inner" role="listbox">
      <div class="item active">
        <div class="container">
          <div class="carousel-caption">
            <h1>The Moofia</h1>
            <p>Sandy Mozzarella leads the Moofia. The Moofia was assembled to extort milk from the lunchboxes of schoolyard
              bullies. Mozzarella is loving and kind to good kids but ruthless and feared by those who harass the innocent.
              By taking the milkfrom the bad and giving it to the good, the Moofia know thegood will grow up strong and healthy
              to protect themselves. Milk is power. Milk is protection.</p>
          </div>
        </div>
      </div>
      <div class="item">
        <div class="container">
          <div class="carousel-caption">
            <h1>Cactus Friends</h1>
            <p>Sandy The cactus is a sign of protection. Kids are naïve and vulnerable and need protection. SANDy and her friends
              zip themselves into cactus suits because they think the world is a cold and scary place, and they need some
              armor to face it. The cactus is the conserver of water, and water means life. The Cactus Friends are the representation
              of life, of being fragile and strong at the same time… and pure like water.</p>
          </div>
        </div>
      </div>
      <div class="item">
        <div class="container">
          <div class="carousel-caption">
            <h1>Til Death Do Us Part</h1>
            <p>Sandy Adios spent 500 years in fire and brimstone before the Devil discovered his good natured ways and kicked
              him out of Hell. Too mischievous for Heaven, Adios was condemned to live forever on earth in his modern grave-loft
              with his girlfriend Ciao Ciao and their cat Skeletrino. Together, Adios and Ciao Ciao wander the world, sharing
              with others how to make the most out of this lif.</p>
          </div>
        </div>
      </div>
    </div>
    <a class="left carousel-control" href="#portfolio-carousel" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
    <a class="right carousel-control" href="#portfolio-carousel" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
  </div>

  <div class="marketing">
    <div class="container">
      <div class="row">
        <div class="col-md-4">
            <h2>header </h2>
          <p> hello <span class="glyphicon glyphicon-heart">
            </span>
            </p>
        </div>

        <div class="col-md-4">
          <h2>header </h2>
         <p>2 <span class="glyphicon glyphicon-heart">
            </span>
            </p>
          </div>

          <div class="col-md-4">
              <h2>header </h2>
            <p>3<span class="glyphicon glyphicon-heart">
              </span>
              </p>
            </div>
      </div>
    </div>
  </div>

  <footer>
    <div class="container">
      <h3>Tokidoki</h3>
      <p>2017</p>
    </div>
  </footer>


  <script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

</body>
</html>