diff --git a/index.html b/index.html index 8e0abfd..e694baa 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,79 @@ + + - - - - - - - - - + + + + Playlist + + + + + +
+ + + +
+ +
+ +

Track Bin

+ + +
+ +
+ + + + +
+ + + + + + +
+ + + + +
+ +
+ + +
+
+ + +
© 2015 Reese Adamonis
+ + +
+ + + +
+ + + + + + + +
+ + + + + + + + + + + \ No newline at end of file diff --git a/page2.html b/page2.html new file mode 100644 index 0000000..36179ce --- /dev/null +++ b/page2.html @@ -0,0 +1,65 @@ + + + + + + Playlist2 + + + + + +
+ +
+ +
+ +
+ + + + +
+ +
+ + +
+ +
+
Click an album to add its tracks to the bin
+
+ + +
+
+ + +
© 2015 Reese Adamonis
+ + +
+ + + +
+ + + + + + + +
+ + + + + + + + + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..67eebbd --- /dev/null +++ b/style.css @@ -0,0 +1,118 @@ +* { + margin:0; + padding: 0; + +} + + +.container { + margin: 0; + padding: 0; + background-color: ; + width: 100%; + height: 100%; + +} + +.navtop { + width:100%; + height:60px; + background-color: grey; + position: fixed; + list-style-type: none; + margin: 0; + padding: 0; + top: 0; +border-bottom: 1px solid black; +} + + + +.link{ + display: inline-block; + color: white; + text-align: center; + padding: 14px 4px; + text-decoration: none; + font-family: sans-serif +} + + + +h1 { + color: black; +} + +.main-container { + width: 735px; + height: 780px; + /*border: 1px solid black;*/ +display: inline-block; +background-color: red; +float: right; +background-image: url("https://raw.githubusercontent.com/reese22adamonis/playlist/master/resources/track.jpg"); +background-size: cover; +opacity: 0.5; +} + +/*.thirds { + + + display: inline-block; + border: solid black 1px; + width:250px; + height:270px; + +}*/ + +.navbot{ +width:100%; + height:50px; + background-color: grey; + position: fixed; + list-style-type: none; + margin: 0; + padding: 0; + bottom:0px; +border-top: 1px solid black; + +} + + + +.rcontainer{ + width: 700px; + height: 800px; + /*border: 1px solid black;*/ +margin-left: 0px; +display: inline-block; +background-color: white; +float: left +padding-top:50px; + +} + +img +{ +/*display: inline-block;*/ +/*max-width:100%; +max-height:100%;*/ +display: inline-block; +margin-left: 5px; +height: 50px; +width: 10px; +border-radius: 100%; +border: 2px solid black + + + +} + +.holds2containers{ + + +} + +button { + padding:25px 25px 25px 25px; +} \ No newline at end of file diff --git a/style2.css b/style2.css new file mode 100644 index 0000000..1c14b84 --- /dev/null +++ b/style2.css @@ -0,0 +1,87 @@ + + + +* { + margin:0; + padding: 0; + +} + + +.container2 { + margin: 0; + padding: 0; + background-color: white; + width: 100%; + height: 100%; +} + +.navtop2 { + width:100%; + height:120px; + background-color: grey; + position: fixed; + list-style-type: none; + margin: 0; + padding: 0; + top: 0; +border-bottom: 1px solid black; +display: table-cell; +vertical-align: bottom; +} + + + +.link2{ + display: inline-block; + color: white; + text-align: center; + padding: 14px 4px; + text-decoration: none; + font-family: sans-serif +} + + + + +.main-container2 { + width: 50%; + height: 100%; + border: 1px solid black; +display: inline-block; +background-color: red; +float: right; +} + + +.navbot2{ +width:100%; + height:50px; + background-color: grey; + position: fixed; + list-style-type: none; + margin: 0; + padding: 0; + bottom:0px; +border-top: 1px solid black; + + +} + + + +.rcontainer2{ + width: 700px; + height: 800px; + border: 1px solid black; +margin-left: 0px; +display: inline-block; +background-color: brown; +float: left + +} + +.holds2containers2{ + + +} \ No newline at end of file