Merge branch 'css2'

sf-wdi-25 · Mar 7, 2016 · 462b3ad · 462b3ad
2 parents 9e1b163 + d3d2fa3
commit 462b3ad
Show file tree

Hide file tree

Showing 13 changed files with 121 additions and 27 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/models/genre.js b/models/genre.js
@@ -6,11 +6,14 @@ var AlbumSchema = new Schema({
     artistName: String,
     name: String,
     releaseDate: String,
+    coverImage: String,
     genres: [String]
 });
 
 var GenreSchema = new Schema({
  name: String,
+ coverImage: String,
+
  albums: [AlbumSchema]
 });
 

diff --git a/public/css/styles.css b/public/css/styles.css
@@ -1,9 +1,19 @@
+@import url('https://fonts.googleapis.com/css?family=Play');
+/*@import url('vapor.ttf');*/
+
+body {
+
+  font-family: 'Play';
+}
+
+
 .jumbotron {
-  background-image: url(/images/vapor1.png);
+  background-color: #CE869B;
   background-size: cover;
   background-repeat: no-repeat;
   color: #EEE;
   margin: -20px;
+  position: relative;
 }
 
 .jumbotron .container {
@@ -17,19 +27,44 @@
 }
 
 @font-face {
-  font-family: 'vapor';
-  src: url('fonts/vapor.ttf'); 
+  font-family: vapor;
+  src: url('/fonts/vapor.ttf'); 
 }
 
-.vaporfont {
-  font-family: 'vapor';
+
+.btn-color {
+  background-color: #C5BCB0;
 }
 
 .btn-color {
   background-color: #C5BCB0;
 }
 
 
+.legend2 {
+    font-family: vapor;
+    font-size: 40px;
+    font-weight: bold;
+
+}
+
+.vaporfont {
+margin-top: 70px;
+font-size: 50px; 
+font-weight: bold;
+font-family: vapor;
+
+}
+
+.aFonts {
+
+  font-size: 20px;
+}    
+
+.aFonts {
+
+  font-size: 20px;
+
 /*---- Splash Style ----*/
 
 .splash-title {
@@ -81,6 +116,51 @@
  border-color: #5AFFF7;
 }
 
+.statue {
+
+  top: 166px;
+  left: 815px;
+  position: absolute;
+}
+
+.statue2{
+
+  top: -55px;
+  left: 946px;
+  position: absolute;
+}
+
+.mainbtn {
+  background-color: limegreen;
+  font-size: 20px;
+/*
+  background-image: url('/images/tape.jpg');
+  background-size: 80px 60px;*/
+/*  padding: 19px 17px;
+*/
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+=======
 .navbar-brand {
 	padding: 0px;
 	padding-left: 10px;
@@ -90,3 +170,4 @@
 .navbar-brand > img {
 	height: 32px;
 }
+>>>>>>> master
diff --git a/public/fonts/.DS_Store b/public/fonts/.DS_Store
diff --git a/public/images/ctapehot.png b/public/images/ctapehot.png
diff --git a/public/images/cupcake.jpg b/public/images/cupcake.jpg
diff --git a/public/images/tape.jpg b/public/images/tape.jpg
diff --git a/public/images/vstatue1.png b/public/images/vstatue1.png
diff --git a/public/images/vstatue2.png b/public/images/vstatue2.png
diff --git a/public/images/vstatueg.png b/public/images/vstatueg.png
diff --git a/public/js/app.js b/public/js/app.js
@@ -287,10 +287,7 @@ function renderAlbum(album) {
   "                        <h4 class='inline-header'>Released date:</h4>" +
   "                        <span class='album-release-date'>" + album.releaseDate + "</span>" +
   "                      </li>" +
-  // "                      <li class='list-group-item'>" +
-  // "                        <h4 class='inline-header'>Cover Image:</h4>" +
-  // "                        <span class='cover-image'>" + album.coverImage + "</span>" +
-  // "                      </li>" +
+
   "                    </ul>" +
   "                  </div>" +
   "                </div>" +
@@ -321,7 +318,7 @@ function renderGenre(genre){
   "              <!-- begin genre internal row -->" +
   "                <div class='row'>" +
   "                  <div class='col-md-3 col-xs-12 thumbnail genre-art'>" +
-  "                     <img src='" + "http://placehold.it/400x400'" +  " alt='genre image'>" +
+  "                     <img src='" + genre.coverImage + "' alt='genre image'>" +
   "                  </div>" +
   "                  <div class='col-md-9 col-xs-12'>" +
   "                    <ul class='list-group'>" +

diff --git a/views/genres.ejs b/views/genres.ejs
@@ -36,24 +36,37 @@
 
               <!-- Text input-->
               <div class="form-group">
-                <label class="col-md-4 control-label" for="name">Genre Name</label>
-                <div class="col-md-4">
+                <label class=" aFonts col-md-4 control-label" for="name">Genre Name</label>
+                <div class="col-md-6">
                 <input id="name" name="name" type="text" placeholder="" class="form-control input-md" required="">
 
                 </div>
               </div>
 
+
+               <!-- Text input-->
+            <div class="form-group">
+              <label class="aFonts col-md-4 control-label" for="coverImage">Cover Image</label>
+              <div class="col-md-6">
+              <input id="genreImage" name="coverImage" type="text" placeholder="URL" class="form-control input-md">
+
+              </div>
+            </div>
+
               <!-- Button -->
               <div class="form-group">
-                <label class="col-md-4 control-label" for="singlebutton">Save Genre</label>
+                <label class="aFonts col-md-4 control-label" for="singlebutton">Save Genre</label>
                 <div class="col-md-4">
-                  <button id="singlebutton" class="btn btn-primary" name="singlebutton">Submit</button>
+                  <button class="mainbtn" id="singlebutton" class="btn btn-primary" name="singlebutton">Submit</button>
                 </div>
               </div>
             </fieldset>
           </form>
         </div>
         </div>
+
+              <img class= "statue2" src="/images/vstatueg.png" alt="picture">
+
       </section>
       </div>
 

diff --git a/views/index.ejs b/views/index.ejs
@@ -31,6 +31,7 @@
   <div class="wrapper">
     <div class="jumbotron">
 
+
    <!--    Start Form -->
      <section id='album-form' class="container">
       <div class="row">
@@ -40,11 +41,11 @@
           <fieldset>
 
             <!-- Form Name -->
-            <legend>Add New Album</legend>
+            <legend class ="legend2">Add New Album</legend>
 
             <!-- Text input-->
             <div class="form-group">
-              <label class="col-md-4 control-label" for="name">Album Name</label>
+              <label class="aFonts col-md-4 control-label" for="name">Album Name</label>
               <div class="col-md-6">
               <input id="name" name="name" type="text" placeholder="" class="form-control input-md" required="">
 
@@ -53,7 +54,7 @@
 
             <!-- Text input-->
             <div class="form-group">
-              <label class="col-md-4 control-label" for="artistName">Artist Name</label>
+              <label class=" aFonts col-md-4 control-label" for="artistName">Artist Name</label>
               <div class="col-md-6">
               <input id="textinput" name="artistName" type="text" placeholder="" class="form-control input-md">
 
@@ -62,7 +63,7 @@
 
             <!-- Text input-->
             <div class="form-group">
-              <label class="col-md-4 control-label" for="releaseDate">Release Date</label>
+              <label class="aFonts col-md-4 control-label" for="releaseDate">Release Date</label>
               <div class="col-md-6">
               <input id="releaseDate" name="releaseDate" type="text" placeholder="1992" class="form-control input-md">
 
@@ -71,30 +72,27 @@
 
             <!-- Textarea -->
             <div class="form-group">
-              <label class="col-md-4 control-label" for="genres">Genres (separated by commas)</label>
+              <label class=" aFonts col-md-4 control-label" for="genres">Genres (separated by commas)</label>
               <div class="col-md-6">
                 <textarea class="form-control" id="genres" name="genres">rock, pop</textarea>
               </div>
             </div>
 
             <!-- Text input-->
             <div class="form-group">
-              <label class="col-md-4 control-label" for="coverImage">Cover Image</label>
+              <label class="aFonts col-md-4 control-label" for="coverImage">Cover Image</label>
               <div class="col-md-6">
               <input id="coverImage" name="coverImage" type="text" placeholder="URL" class="form-control input-md">
 
               </div>
             </div>
 
 
-
-
-
             <!-- Button -->
             <div class="form-group">
-              <label class="col-md-4 control-label" for="singlebutton">Save Album</label>
+              <label class="aFonts col-md-4 control-label" for="singlebutton">Save Album</label>
               <div class="col-md-4">
-                <button id="singlebutton" class="btn btn-primary" name="singlebutton">Submit</button>
+                <button id="singlebutton" class="mainbtn btn " name="singlebutton">Submit</button>
               </div>
             </div>
           </fieldset>
@@ -104,8 +102,8 @@
     </section>
    <!--  End Form -->
       <div class="container">
-        <h1 class="vaporfont">Welcome to tunely</h1>
-        <p>Your music binder!</p>
+        <h1 class="vaporfont">Welcome to Tunely</h1>
+        <p>Not your ordinary music!</p>
       </div>
     </div>
 
@@ -119,6 +117,8 @@
       <div id='albums'>
 
       </div>
+
+      <img class= "statue" src="./images/vstatue1.png" alt="picture">
     </section>
 
     <!-- begin songModal: this is not visible until you call .modal() on it -->