Create network settings template

Change-Id: Id2f5a5ba3e13885c081bbd5b8e694793ecc49d93
Signed-off-by: Michael Davis <michael.s.davis@ibm.com>
diff --git a/app/configuration/controllers/network-controller.html b/app/configuration/controllers/network-controller.html
index cea74d9..6421e46 100644
--- a/app/configuration/controllers/network-controller.html
+++ b/app/configuration/controllers/network-controller.html
@@ -1,5 +1,89 @@
 <div id="configuration-network">
-    <div class="row column">
-        <h1>Network</h1>
-    </div>
+	<div class="row column">
+		<h1>Network settings</h1>
+	</div>
+	<form class="net-config__form" role="form" action="">
+		<section class="row column">
+			<div class="column small-12 page-header">
+				<h2 class="inline h4">Common settings</h2>
+			</div>
+			<fieldset>
+				<div class="row column">
+					<label for="netinterface-select" class="inline">Network interface</label>
+					<div id="netinterface-select" class="dropdown__wrapper">
+						<button class="dropdown__button" ng-click="networkDevice = ! networkDevice">eth0</button>
+						<ul class="dropdown__list inline" ng-show="networkDevice">
+							<li>
+								<button ng-click="networkDevice=false;">eth0</button>
+							</li>
+							<li>
+								<button ng-click="networkDevice=false;">eth1</button>
+							</li>
+						</ul>
+					</div>
+				</div>
+				<div class="row column">
+					<label for="net-config__mac" class="inline">MAC address</label>
+					<input id="net-config__mac" type="text" class="inline"/>
+				</div>
+				<div class="row column">
+					<label for="net-config__host" class="inline">Hostname</label>
+					<input id="net-config__host" type="text" class="inline"/>
+				</div>
+				<div class="row column">
+					<label for="net-config__domain" class="inline">Domain name</label>
+					<input id="net-config__domain" type="text" class="inline"/>
+				</div>
+			</fieldset>
+		</section>
+		<section class="row column">
+			<div class="page-header">
+				<h2 class="inline h4">IPV4 settings</h2>
+			</div>
+			<fieldset>
+				<div class="row column">
+					<label class="control-radio" for="dhcp-address">Obtain an IP address automatically using DHCP
+						<input type="radio" name="ip-address" id="dhcp-address" ng-checked="true" ng-model="dhcp" ng-value="true" ng-init="dhcp=true"/>
+						<span class="control__indicator control__indicator-on"></span>
+					</label>
+				</div>
+				<div class="row column">
+					<label class="control-radio" for="static-ip-address">Assign a static IP address
+						<input type="radio" name="ip-address" id="static-ip-address" ng-model="dhcp" ng-value="false" />
+						<span class="control__indicator control__indicator-on"></span>
+					</label>
+				</div>
+				<fieldset class="net-config__static-ip-wrap">
+					<div class="row column">
+						<label for="net-config__ipv4-address" class="inline">IPV4 address</label>
+						<input id="net-config__ipv4-address" type="text" class="inline" ng-disabled="dhcp" value="178.45.23.122"/>
+					</div>
+					<div class="row column">
+						<label for="net-config__subnet" class="inline">Subnet mask</label>
+						<input id="net-config__subnet" type="text" class="inline" ng-disabled="dhcp" value="255.255.0.0"/>
+					</div>
+					<div class="row column">
+						<label for="net-config__default-gateway" class="inline">Default gateway</label>
+						<input id="net-config__default-gateway" type="text" class="inline" ng-disabled="dhcp" value="178.45.1.1"/>
+					</div>
+					<div class="row column">
+						<label for="net-config__prime-dns" class="inline">Primary DNS server</label>
+						<input id="net-config__prime-dns" type="text" class="inline"/>
+					</div>
+					<div class="row column">
+						<label for="net-config__secondary-dns" class="inline">Secondary DNS server</label>
+						<input id="net-config__secondary-dns" type="text" class="inline"/>
+					</div>
+					<div class="row column">
+						<label for="net-config__tertiary-dns" class="inline">Tertiary DNS server</label>
+						<input id="net-config__tertiary-dns" type="text" class="inline"/>
+					</div>
+				</fieldset>
+			</fieldset>
+			<div class="network-config__submit-wrapper float-right">
+				<button class="btn-primary inline">Save settings</button>
+				<button class="btn-secondary inline">Cancel</button>
+			</div>
+		</section>
+	</form>
 </div>
\ No newline at end of file
diff --git a/app/configuration/styles/network.scss b/app/configuration/styles/network.scss
index e69de29..22edf88 100644
--- a/app/configuration/styles/network.scss
+++ b/app/configuration/styles/network.scss
@@ -0,0 +1,45 @@
+.net-config__form {
+  .dropdown__button {
+    margin-bottom: 1.2em;
+  }
+  .dropdown__list {
+    margin-top: -17px;
+  }
+  input,
+  .dropdown__button {
+    width: 240px;
+    text-align: left;
+  }
+  input {
+    height: 2.1em;
+    margin-bottom: 1.2em;
+  }
+  label {
+    min-width: 300px;
+    font-weight: 700;
+  }
+  fieldset {
+    padding-left: 1.8em;
+    padding-top: 1em;
+  }
+  .net-config__static-ip-wrap {
+    padding-left: 3.6em;
+    display: block;
+    label {
+      min-width: 250px;
+    }
+  }
+  .control-radio {
+    margin-top: 1em;
+  }
+  .network-config__submit-wrapper {
+    width: 100%;
+    margin-top: 3em;
+    padding-top: 1em;
+    border-top: 1px solid $lightgrey;
+    button {
+      float: right;
+      margin: .5em;
+    }
+  }
+}
\ No newline at end of file