From afb4ddb83a80bd18d66c05e99dbcd01c17760fb2 Mon Sep 17 00:00:00 2001
From: stevenhaskell <stevenwhaskell@gmail.com>
Date: Mon, 15 Oct 2018 13:15:13 -0400
Subject: [PATCH] Added Barbell and Placement of plates

Stylized barbell added as well as area where the plates would be added. Need to find out how to add plates needed.
---
 css/appstyling-v2.css        | 30 ++++++++++++++++++++++++++++++
 images/10lbs-Plate.svg       |  1 +
 images/25lbs-Plate.svg       |  1 +
 images/2halflbs-Plate.svg    |  1 +
 images/35lbs-Plate.svg       |  1 +
 images/45lbs-Plate.svg       |  1 +
 images/5lbs-Plate.svg        |  1 +
 images/BarBell.svg           |  1 +
 whatareyouliftingapp-V5.html |  8 ++++++--
 9 files changed, 43 insertions(+), 2 deletions(-)
 create mode 100644 images/10lbs-Plate.svg
 create mode 100644 images/25lbs-Plate.svg
 create mode 100644 images/2halflbs-Plate.svg
 create mode 100644 images/35lbs-Plate.svg
 create mode 100644 images/45lbs-Plate.svg
 create mode 100644 images/5lbs-Plate.svg
 create mode 100644 images/BarBell.svg

diff --git a/css/appstyling-v2.css b/css/appstyling-v2.css
index db5c383..b1541b6 100644
--- a/css/appstyling-v2.css
+++ b/css/appstyling-v2.css
@@ -116,6 +116,36 @@ p.subheading {
 	letter-spacing: .015px;
 }
 
+.b-platevisual__weight{
+	position: relative;
+	max-width: 300px;
+	margin: auto;
+}
+
+.b-platevisual__barbell{
+	width: 100%;
+	max-width: 300px;
+	vertical-align: top;
+}
+
+.b-platevisual__plates{
+	position: absolute;
+
+}
+
+.b-platevisual__plates--left{
+	top: 50%;
+	transform: translate(-100%, -50%);
+	left: 21%;
+
+}
+
+.b-platevisual__plates--right{
+	top: 50%;
+	transform: translateY(-50%);
+	left: 79%;
+}
+
 .b-calulatorinputs {
 	height: 40vh;
 	width: auto;
diff --git a/images/10lbs-Plate.svg b/images/10lbs-Plate.svg
new file mode 100644
index 0000000..22ff8ac
--- /dev/null
+++ b/images/10lbs-Plate.svg
@@ -0,0 +1 @@
+<svg height="48" viewBox="0 0 8 48" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="48" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1.192383" y="22">1</tspan> <tspan x="1.192383" y="33">0</tspan></text></g></svg>
\ No newline at end of file
diff --git a/images/25lbs-Plate.svg b/images/25lbs-Plate.svg
new file mode 100644
index 0000000..7161512
--- /dev/null
+++ b/images/25lbs-Plate.svg
@@ -0,0 +1 @@
+<svg height="56" viewBox="0 0 8 56" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="56" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1.192383" y="26">2</tspan> <tspan x="1.192383" y="37">5</tspan></text></g></svg>
\ No newline at end of file
diff --git a/images/2halflbs-Plate.svg b/images/2halflbs-Plate.svg
new file mode 100644
index 0000000..c05d065
--- /dev/null
+++ b/images/2halflbs-Plate.svg
@@ -0,0 +1 @@
+<svg height="32" viewBox="0 0 8 32" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="32" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1" y="20">2</tspan> <tspan x="2.491699" y="23">.</tspan> <tspan x="11.175781" y="33.561523"/><tspan x="11.175781" y="36.561523"/> <tspan x="1" y="32">5</tspan></text></g></svg>
\ No newline at end of file
diff --git a/images/35lbs-Plate.svg b/images/35lbs-Plate.svg
new file mode 100644
index 0000000..88f6071
--- /dev/null
+++ b/images/35lbs-Plate.svg
@@ -0,0 +1 @@
+<svg height="64" viewBox="0 0 8 64" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="64" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1.192383" y="30">3</tspan> <tspan x="1.192383" y="41">5</tspan></text></g></svg>
\ No newline at end of file
diff --git a/images/45lbs-Plate.svg b/images/45lbs-Plate.svg
new file mode 100644
index 0000000..66c6be4
--- /dev/null
+++ b/images/45lbs-Plate.svg
@@ -0,0 +1 @@
+<svg height="72" viewBox="0 0 8 72" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="72" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1.192383" y="34">4</tspan> <tspan x="1.192383" y="45">5</tspan></text></g></svg>
\ No newline at end of file
diff --git a/images/5lbs-Plate.svg b/images/5lbs-Plate.svg
new file mode 100644
index 0000000..07165a3
--- /dev/null
+++ b/images/5lbs-Plate.svg
@@ -0,0 +1 @@
+<svg height="40" viewBox="0 0 8 40" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="40" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1.192383" y="23.5">5</tspan></text></g></svg>
\ No newline at end of file
diff --git a/images/BarBell.svg b/images/BarBell.svg
new file mode 100644
index 0000000..eff07b3
--- /dev/null
+++ b/images/BarBell.svg
@@ -0,0 +1 @@
+<svg height="31" viewBox="0 0 288 31" width="288" xmlns="http://www.w3.org/2000/svg"><g fill="none"><rect fill="#c5c5c5" height="16" rx="4" width="70" y="7"/><path d="m68 11h152v8h-152z" fill="#c5c5c5"/><path d="m90 11h32v8h-32z" fill="#8c8e90"/><path d="m104 11h4v8h-4z" fill="#c5c5c5"/><path d="m166 11h32v8h-32z" fill="#8c8e90"/><rect fill="#c5c5c5" height="16" rx="4" width="70" x="218" y="7"/><rect fill="#8c8e90" height="31" rx="4" width="16" x="60"/><rect fill="#8c8e90" height="31" rx="4" width="16" x="212"/><path d="m180 11h4v8h-4z" fill="#c5c5c5"/></g></svg>
\ No newline at end of file
diff --git a/whatareyouliftingapp-V5.html b/whatareyouliftingapp-V5.html
index c024ed3..313c26e 100644
--- a/whatareyouliftingapp-V5.html
+++ b/whatareyouliftingapp-V5.html
@@ -38,8 +38,12 @@
             <div class="b-platevisual">
                 <div class="b-platevisual__container">
                     <p class="b-platevisual__weightfinal"><span class="input-element input-final">0</span> LBS</p>
-                    <div class="b-platevisual__barbell">
-                        <img src="https://qph.fs.quoracdn.net/main-qimg-377c39d784e8860d4ce6142fba0e09e0-c" style="width: 50%;max-width: 300px;">
+                    <div class="b-platevisual__weight">
+                        <img src="/Users/stevenh/Desktop/Side_Projects/What_Are_You_Lifting-App/WhatAreYouLifting/images/BarBell.svg" class="b-platevisual__barbell">
+                        <div class="b-platevisual__plates b-platevisual__plates--left">
+                        </div>
+                        <div class="b-platevisual__plates b-platevisual__plates--right">
+                        </div>
                     </div>
                     <p class="subheading">Offset: <span class="input-difference">0</span> LBS</p>
                 </div>