summary refs log tree commit diff
diff options
context:
space:
mode:
author1970-01-01 00:00:00 +0000
committer2025-01-14 03:21:29 +0000
commit197268c7abf615c805961b6ebefe1d2df74196dc (patch)
treedeaa7a527210da1eee1a6e4a3e0c3619cc00affa
parentintro (diff)
downloadhtml-197268c7abf615c805961b6ebefe1d2df74196dc.tar
html-197268c7abf615c805961b6ebefe1d2df74196dc.tar.gz
html-197268c7abf615c805961b6ebefe1d2df74196dc.tar.bz2
html-197268c7abf615c805961b6ebefe1d2df74196dc.tar.xz
html-197268c7abf615c805961b6ebefe1d2df74196dc.zip
portfolio
-rw-r--r--portfolio/css/main.css89
-rw-r--r--portfolio/index.html61
-rw-r--r--portfolio/intro/index.html44
-rw-r--r--portfolio/template/index.html53
4 files changed, 247 insertions, 0 deletions
diff --git a/portfolio/css/main.css b/portfolio/css/main.css
new file mode 100644
index 0000000..9ce1f3e
--- /dev/null
+++ b/portfolio/css/main.css
@@ -0,0 +1,89 @@
+html{
+	background-color: #000000;
+	background-image: url("../i/bg.png");
+	background-repeat: no-repeat;
+	background-size: 100%;
+	color: #EEBB99;
+}
+
+body{
+	margin: auto;
+	width: 70%;
+}
+
+h1{
+	margin: .5em;
+}
+
+p{
+	font-size: .85em;
+}
+
+a{
+	color: #AABBAA;
+	text-decoration: none;
+}
+
+hr{
+	color: #AA9988;
+}
+
+img{
+	width: 50%;
+	padding-left: 22%;
+
+}
+
+header{
+	width: 75%;
+	text-align: center;
+	font-size: .9em;
+}
+header i{
+	font-size: .6em;
+	font-weight: normal;
+}
+
+nav{
+	color: #998877;
+}
+nav a{
+	font-size: 1.03em;
+	padding-left: 1%;
+	padding-right: 1%;
+}
+nav i{
+	font-size: .85em;
+	color: #EECC99;
+	padding-right: 1%;
+	float: right;
+}
+
+main{
+	padding-top: 3%;
+}
+
+.col{
+	position: fixed;
+	width: 30%;
+	height: 100%;
+	overflow-x: hidden;
+	z-index: 1;
+}
+#left{
+	left: 0;
+	padding-left: 18%;
+}
+#right{
+	right: 0;
+	padding-right: 18%;
+}
+
+footer{
+	position: fixed;
+	bottom: 0;
+	width: 70%;
+	font-size: .8em;
+	color: #EECC99;
+	text-align: center;
+}
diff --git a/portfolio/index.html b/portfolio/index.html
new file mode 100644
index 0000000..d882d22
--- /dev/null
+++ b/portfolio/index.html
@@ -0,0 +1,61 @@
+<!doctype html>
+<html lang="en"><head><meta charset="utf-8">
+<link rel="stylesheet" href="css/main.css">
+<title>Name's Portfolio: Home</title></head><body>
+
+<header>
+	<h1>Name's Portfolio
+	<i>All the info is here!</i></h1>
+</header>
+
+<nav>
+	<hr>
+	<a href="">Home</a> |
+	<a href="intro">Intro</a> |
+	<a href="i/wireframe.png">Wireframe</a> |
+	<a href="template">Template</a> |
+	<a href="http://github.com/4stc/portfolio">Source</a>
+	<i>Portfolio / Home</i>
+	<hr>
+</nav>
+
+<main>
+	<div class="col" id="left">
+		<img src="i/me.png" alt="a picture of me">
+		<p>Hey! My name is Name, I just graduated from high school
+		last spring and am now majoring in Computer Programming at
+		Southeast Tech. I live in Sioux Falls and have 4 siblings.
+		The lists on the right show a few of my interests, as well
+		as some of my technical skills.</p>
+	</div>
+	<div class="col" id="right">
+		<h2>I Enjoy</h2>
+		<ul>
+			<li>Traveling</li>
+			<li>Programming</li>
+			<li>Coffee & Tea</li>
+			<li>Bicycling</li>
+			<li>Electric Scootering</li>
+			<li>Learning</li>
+			<li>Hiking</li>
+		</ul>
+		<h2>Tech Skills</h2>
+		<ul>
+			<li>C#</li>
+			<li>HTML / CSS</li>
+			<li>SQL</li>
+			<li>Visual Studio</li>
+			<li>Oracle</li>
+			<li>Cloud Computing</li>
+			<li>Linux</li>
+			<li>Git</li>
+			<li>WordPress</li>
+		</ul>
+	</div>
+</main>
+
+<footer>
+	<p>Made by Name Surname</p>
+</footer>
+
+</body></html>
diff --git a/portfolio/intro/index.html b/portfolio/intro/index.html
new file mode 100644
index 0000000..ceeaa37
--- /dev/null
+++ b/portfolio/intro/index.html
@@ -0,0 +1,44 @@
+<!doctype html><html lang="en"><head>
+<title>Portfolio: Name's Intro</title></head>
+
+<body bgcolor="#000000" text="#EEBB99"
+ link="#EE9977" vlink="#EE9977"><div align="center">
+
+<h3><a href="..">Homepage</a></h3>
+
+<h1>Name Surname</h1>
+<h1>Favorite culture other than my own:</h1>
+<p>Himalayan</p>
+<img src="../i/himalayan.png" width="45%">
+
+<h1>Historical figures I admire and wish to be like:</h1>
+<p>Nikola Tesla</p>
+<img src="../i/nikola.png" width="30%">
+<p>Ada Lovelace</p>
+<img src="../i/ada.png" width="30%">
+<p>Johann Bach</p>
+<img src="../i/bach.png" width="30%">
+
+<h1>Bouquet of meaningful flowers:</h1>
+<p>Chrysanthemum (Truth)</p>
+<img src="../i/chrysanthemum.png" width="32%">
+<p>Iberis (Indifference)</p>
+<img src="../i/iberis.png" width="28%">
+<p>Edelweiss (Devotion)</p>
+<img src="../i/edelweiss.png" width="32%">
+
+<h1>A meal that represents me is:</h1>
+<p>Oatmeal cookies and milk</p>
+<img src="../i/food.png" width="28%">
+
+<h1>I feel most creative when I:</h1>
+<p>Am somewhere peaceful and still</p>
+<img src="../i/lighthouse.png" width="35%">
+
+<h1>If I could only speak about 1 topic from now on it would be:</h1>
+<p>Inventions</p>
+<img src="../i/light.png" width="35%">
+
+<h3><a href="..">Homepage</a></h3>
+
+</div></body></html>
diff --git a/portfolio/template/index.html b/portfolio/template/index.html
new file mode 100644
index 0000000..d0bb59b
--- /dev/null
+++ b/portfolio/template/index.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<html lang="en"><head><meta charset="utf-8">
+<link rel="stylesheet" href="../css/main.css">
+<title>Name's Portfolio: Template</title></head><body>
+
+<header>
+	<h1>Name's Portfolio
+	<i>All the info is here!</i></h1>
+</header>
+
+<nav>
+	<hr>
+	<a href="..">Home</a> |
+	<a href="../intro">Intro</a> |
+	<a href="../i/wireframe.png">Wireframe</a> |
+	<a href="">Template</a> |
+	<a href="http://github.com/4stc/portfolio">Source</a>
+	<i>Portfolio / Template</i>
+	<hr>
+</nav>
+
+<main>
+	<div class="col" id="left">
+		<img src="../i/me.png" alt="a picture of me">
+		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
+		sed do eiusmod tempor incididunt ut labore et dolore magna
+		aliqua. Ut enim ad minim veniam, quis nostrud exercitation
+		ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
+		aute irure dolor in reprehenderit in voluptate velit esse
+		cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
+		cupidatat non proident, sunt in culpa qui officia deserunt
+		mollit anim id est laborum.</p>
+	</div>
+	<div class="col" id="right">
+		<h2>Example List</h2>
+		<ul>
+			<li>example one</li>
+			<li>example two</li>
+			<li>example three</li>
+			<li>example four</li>
+			<li>example five</li>
+			<li>example six</li>
+			<li>example seven</li>
+			<li>example eight</li>
+		</ul>
+	</div>
+</main>
+
+<footer>
+	<p>Made by Name Surname</p>
+</footer>
+
+</body></html>