bp/SamPerryWebsite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Moved profile pic to be inline with text

Browse Source
This commit is contained in:
Pezz89
2015-06-04 22:12:11 +02:00
parent aaa837ea26
commit c3afe09197
3 changed files with 96 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Session.vim
+8 -8
View File
@@ -8,22 +8,22 @@ if expand('%') == '' && !&modified && line('$') <= 1 && getline(1) == ''
let s:wipebuf = bufnr('%')
endif
set shortmess=aoO
badd +166 index.htm
badd +7 JQFuncs.js
badd +128 style.css
badd +40 index.htm
badd +1 JQFuncs.js
badd +97 style.css
argglobal
silent! argdel *
argadd index.htm
argadd JQFuncs.js
argadd style.css
edit JQFuncs.js
edit style.css
set splitbelow splitright
set nosplitbelow
set nosplitright
wincmd t
set winheight=1 winwidth=1
argglobal
edit JQFuncs.js
edit style.css
setlocal fdm=manual
setlocal fde=0
setlocal fmr={{{,}}}
@@ -33,12 +33,12 @@ setlocal fml=1
setlocal fdn=20
setlocal fen
silent! normal! zE
let s:l = 68 - ((27 * winheight(0) + 23) / 46)
let s:l = 1 - ((0 * winheight(0) + 23) / 46)
if s:l < 1 | let s:l = 1 | endif
exe s:l
normal! zt
68
normal! 040|
1
normal! 0
tabnext 1
if exists('s:wipebuf')
silent exe 'bwipe ' . s:wipebuf
index.htm
+72 -20
View File
@@ -12,9 +12,6 @@
<body>
<!--Sidebar-->
<nav class="nav">
<div id="imgDiv">
<img id="profilePic" class="circular" src="resources/ProfilePic.jpg" alt="Profile Picture">
</div>
<ul id="navLinks">
<li class="active">
<a id="link1" href="#aboutMe" class="nav-aboutMe">About Me</a>
@@ -25,23 +22,31 @@
<li>
<a id="link3" href="#portfolio" class="nav-portfolio">Portfolio</a>
</li>
<li>
<a id="link4" href="#contactMe" class="nav-contactMe">Contact Me</a>
</li>
</ul>
</nav>
<div id="maincontent">
<header>
<h1>Sam Perry</h1>
</header>
<header>
<h1>Sam Perry</h1>
</header>
<div id="maincontent">
<article id="aboutMe" >
<h2 class="anchor">About Me</h2>
<p>
Hi! I'm Sam. An aspiring programmer/DSP engineer. I made this website to show some of the projects that
I've completed or am currently working on and as a place to document some of my key skills and interests.
I hope to expand the website as I gain experience in my field but for now I have put together a selection
of some of the work I have created over the past few years whilst at University and working at my
placement in Paris. Enjoy!
</p>
<div id="summary">
<h2 class="anchor">About Me</h2>
<p>
<span id="imgDiv">
<img id="profilePic" class="circular" src="resources/ProfilePic.jpg" alt="Profile Picture">
</span>
Hi! I'm Sam. An aspiring programmer/DSP engineer. I made this website to show some of the projects that
I've completed or am currently working on and as a place to document some of my key skills and interests.
I hope to expand the website as I gain experience in my field but for now I have put together a selection
of some of the work I have created over the past few years whilst at University and working at my
placement in Paris. Enjoy!
</p>
</div>
<div id="interests">
<h3>Interests</h3>
@@ -165,15 +170,62 @@
<h2>Portfolio</h2>
<p>Summary of portfolio</p>
<h4>Audio descriptor framework</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat,
vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil
imperdiet doming id quod mazim placerat facer possim assum.
</p>
<h4>Python/matlab filter module</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat,
vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil
imperdiet doming id quod mazim placerat facer possim assum.
</p>
<h4>VSTi Synth</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat,
vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil
imperdiet doming id quod mazim placerat facer possim assum.
</p>
<h4>VST Delay effect</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat,
vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil
imperdiet doming id quod mazim placerat facer possim assum.
</p>
<h4>This Website</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat,
vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil
imperdiet doming id quod mazim placerat facer possim assum.
</p>
</article>
<article id="contactMe" class="anchor">
<h2>Contact Me</h2>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat,
vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil
imperdiet doming id quod mazim placerat facer possim assum.
</p>
</article>
<footer>
style.css
+16 -8
View File
@@ -7,6 +7,12 @@ h5 {
margin: 0;
padding: 1.67em 0 1.67em 2em;
background-color: LightGray;
border: 1px solid DarkGray;
}
div#coding > div > div {
background-color: #E8E8E8;
padding: 1.67em;
}
article {
@@ -16,9 +22,10 @@ article {
header {
height: 30em;
width: 100%;
width: 80%;
background-color: gray;
top: 0
top: 0;
z-index: -100;
}
header > h1 {
@@ -46,6 +53,7 @@ nav {
background-color: #6f5499;
margin: 0;
padding: 0;
z-index: 0;
}
nav > ul {
@@ -66,7 +74,8 @@ div#maincontent {
position: relative;
width: 80%;
margin: 0;
padding: 0
padding: 0;
z-index: 0;
}
/*A bit of a hack to fix the jquery slide toggle*/
div#panel {
@@ -81,13 +90,12 @@ img#profilePic {
margin-left: auto;
margin-right: auto;
display: block;
margin-top: 1em;
max-width: 150px;
max-height: 150px;
}
nav > div#imgDiv {
padding: 0 1em 0 1em
span#imgDiv {
padding: 0 1em 0 1em;
float: right;
}
.circular {
@@ -101,7 +109,7 @@ nav > div#imgDiv {
/* unvisited link */
a:link {
color: #FF0000;
color: #ffffff;
text-decoration: none;
}