Continued improving the UI
This commit is contained in:
+20
-3
@@ -83,19 +83,36 @@ function scrollNav() {
|
||||
});
|
||||
}
|
||||
|
||||
//Toggle plus/minus icon
|
||||
function iconToggle(showhideDiv) {
|
||||
event.preventDefault();
|
||||
showhideDiv.toggleClass("open");
|
||||
var icon = showhideDiv.find(".plusminus");
|
||||
if (showhideDiv.hasClass("open")) {
|
||||
icon.html("<i class='fa fa-minus'></i>");
|
||||
}
|
||||
else {
|
||||
icon.html("<i class='fa fa-plus'></i>");
|
||||
}
|
||||
}
|
||||
|
||||
//Toggle smoothly revealing/hiding divs
|
||||
function showHide() {
|
||||
$(".showhide").click(function(){
|
||||
var parentDiv = $(this).parent("div");
|
||||
parentDiv.find(".panel").slideToggle("slow");
|
||||
$(this).find(".panel").slideToggle("slow");
|
||||
iconToggle($(this));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function highlightDiv() {
|
||||
function hideByDefault() {
|
||||
/*Hide all collapsable panels by default*/
|
||||
$(".panel").css("display", "none");
|
||||
}
|
||||
|
||||
//Make sure document is ready before executing javascript
|
||||
$(document).ready(function() {
|
||||
scrollNav();
|
||||
showHide();
|
||||
hideByDefault();
|
||||
});
|
||||
|
||||
+14
-9
@@ -1,5 +1,4 @@
|
||||
let SessionLoad = 1
|
||||
if &cp | set nocp | endif
|
||||
let s:so_save = &so | let s:siso_save = &siso | set so=0 siso=0
|
||||
let v:this_session=expand("<sfile>:p")
|
||||
silent only
|
||||
@@ -8,9 +7,9 @@ if expand('%') == '' && !&modified && line('$') <= 1 && getline(1) == ''
|
||||
let s:wipebuf = bufnr('%')
|
||||
endif
|
||||
set shortmess=aoO
|
||||
badd +40 index.htm
|
||||
badd +1 JQFuncs.js
|
||||
badd +97 style.css
|
||||
badd +55 index.htm
|
||||
badd +92 JQFuncs.js
|
||||
badd +11 style.css
|
||||
argglobal
|
||||
silent! argdel *
|
||||
argadd index.htm
|
||||
@@ -33,14 +32,20 @@ setlocal fml=1
|
||||
setlocal fdn=20
|
||||
setlocal fen
|
||||
silent! normal! zE
|
||||
let s:l = 1 - ((0 * winheight(0) + 23) / 46)
|
||||
let s:l = 12 - ((11 * winheight(0) + 23) / 46)
|
||||
if s:l < 1 | let s:l = 1 | endif
|
||||
exe s:l
|
||||
normal! zt
|
||||
1
|
||||
normal! 0
|
||||
tabnext 1
|
||||
if exists('s:wipebuf')
|
||||
12
|
||||
normal! 027|
|
||||
tabnew
|
||||
set splitbelow splitright
|
||||
set nosplitbelow
|
||||
set nosplitright
|
||||
wincmd t
|
||||
set winheight=1 winwidth=1
|
||||
tabnext 2
|
||||
if exists('s:wipebuf') && getbufvar(s:wipebuf, '&buftype') isnot# 'terminal'
|
||||
silent exe 'bwipe ' . s:wipebuf
|
||||
endif
|
||||
unlet! s:wipebuf
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
<link href="style.css" rel="stylesheet">
|
||||
<script src="jquery-1.11.3.js" type="text/javascript"></script>
|
||||
<script src="JQFuncs.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="font-awesome-4.3.0/css/font-awesome.min.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -51,11 +52,24 @@
|
||||
<div id="interests">
|
||||
<h3>Interests</h3>
|
||||
|
||||
<div id="coding">
|
||||
<div id="coding" class="infoBox">
|
||||
<h4>Coding</h4>
|
||||
<div>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div id="python">
|
||||
<h5 class="showhide">Python</h5>
|
||||
<div id="python" class="showhide">
|
||||
<div class="heading">
|
||||
<h5>Python</h5>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<p>
|
||||
I have around a year's experience working in python and find it's simple syntax perfect for
|
||||
@@ -69,8 +83,11 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="unix">
|
||||
<h5 class="showhide">Unix</h5>
|
||||
<div id="unix" class="showhide">
|
||||
<div class="heading">
|
||||
<h5>Unix</h5>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<p>
|
||||
Having worked almost exclusively on Mac and Linux for a number of years I am very familiar with
|
||||
@@ -82,36 +99,45 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="cplusplus">
|
||||
<h5 class="showhide">C++</h5>
|
||||
<div class="panel">
|
||||
<p>
|
||||
I have used C++ to create audio effects using the Steinberg VST framework as part of coursework
|
||||
for my degree. I have also experimented with creating simple standalone command line tools.
|
||||
I like the language for it's high performance when compared to python (due to the compiled nature
|
||||
of the language) though I currently tend to work less in this language as I find it less flexible
|
||||
for quickly prototyping my ideas. I plan on improving my skills in this language when I feel that
|
||||
one of my projects has reached a point where it would benefit from being converted to a compiled
|
||||
language.
|
||||
</p>
|
||||
</div>
|
||||
<div id="cplusplus" class="showhide">
|
||||
<div class="heading">
|
||||
<h5>C++</h5>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<p>
|
||||
I have used C++ to create audio effects using the Steinberg VST framework as part of coursework
|
||||
for my degree. I have also experimented with creating simple standalone command line tools.
|
||||
I like the language for it's high performance when compared to python (due to the compiled nature
|
||||
of the language) though I currently tend to work less in this language as I find it less flexible
|
||||
for quickly prototyping my ideas. I plan on improving my skills in this language when I feel that
|
||||
one of my projects has reached a point where it would benefit from being converted to a compiled
|
||||
language.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="vim">
|
||||
<h5 class="showhide">Vim</h5>
|
||||
<div class="panel">
|
||||
<p>
|
||||
My editor of choice is Vim and have been using it for around a year. I feel the main advantage is
|
||||
that it is a widely available editor due to it's age and its exceptional ability to be adaptable
|
||||
to all different languages through customization. This allows me to develop in the same environment
|
||||
with modifications to create an IDE style workspace tailored to each task.If you are interested my
|
||||
Vim configurations can be found here.
|
||||
</p>
|
||||
</div>
|
||||
<div id="vim" class="showhide">
|
||||
<div class="heading">
|
||||
<h5>Vim</h5>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<p>
|
||||
My editor of choice is Vim and have been using it for around a year. I feel the main advantage is
|
||||
that it is a widely available editor due to it's age and its exceptional ability to be adaptable
|
||||
to all different languages through customization. This allows me to develop in the same environment
|
||||
with modifications to create an IDE style workspace tailored to each task.If you are interested my
|
||||
Vim configurations can be found here.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="webdesign">
|
||||
<h5 class="showhide">Web Design</h5>
|
||||
<div id="webdesign" class="showhide">
|
||||
<div class="heading">
|
||||
<h5>Web Design - HTML5, CSS and JavaScript</h5>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<p>
|
||||
I recently became interested in coding a website as a side project to improve my skills in an area
|
||||
@@ -124,9 +150,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="music">
|
||||
<h4 class="showhide">Music</h4>
|
||||
<div class="panel">
|
||||
<br>
|
||||
<div id="music" class="infoBox">
|
||||
<h4>Music</h4>
|
||||
<div>
|
||||
<p>
|
||||
I have always enjoyed writing and playing music. As a child I was taught the Piano and continue to
|
||||
practice as a hobby in my spare time. Through studying Music Technology at university I have had the
|
||||
@@ -139,18 +166,31 @@
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="motorbikes">
|
||||
<br>
|
||||
<div id="motorbikes" class="infoBox">
|
||||
<h4>Motorbikes</h4>
|
||||
<div>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article id="profExper" class="anchor">
|
||||
<h2>Professional Experience</h2>
|
||||
<div class="heading">
|
||||
<h2>Professional Experience</h2>
|
||||
</div>
|
||||
<p>Summary of professional experience </p>
|
||||
<div id="ircam">
|
||||
<h4 class="showhide">IRCAM</h4>
|
||||
<div class="panel">
|
||||
<div id="ircam" class="infoBox">
|
||||
<h4>IRCAM</h4>
|
||||
<div>
|
||||
<p>
|
||||
IRCAM has has been my first experience in a professional working environment. During my time there I gained an
|
||||
understanding of how teams work togeather to produce professional products and participated in the development
|
||||
@@ -169,63 +209,120 @@
|
||||
<article id="portfolio" class="anchor">
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<div class="infoBox showhide">
|
||||
<div class="heading">
|
||||
<h4>Audio descriptor framework (3rd Year University Project)</h4>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBox showhide">
|
||||
<div class="heading">
|
||||
<h4>iTunes Rating App (Personal Project)</h4>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBox showhide">
|
||||
<div class="heading">
|
||||
<h4>Python/matlab filter module (3rd Year University Project)</h4>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBox showhide">
|
||||
<div class="heading">
|
||||
<h4>VSTi Synth (2nd Year University Project)</h4>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBox showhide">
|
||||
<div class="heading">
|
||||
<h4>VST Delay effect (2nd Year University Project)</h4>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="infoBox showhide">
|
||||
<div class="heading">
|
||||
<h4>This Website</h4>
|
||||
<span class="plusminus"><i class='fa fa-plus'></i></span>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</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>
|
||||
<div class="infoBox">
|
||||
<div class="heading">
|
||||
<h2>Contact Me</h2>
|
||||
</div>
|
||||
<div>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<footer>
|
||||
|
||||
@@ -5,14 +5,21 @@ html, body {
|
||||
|
||||
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;
|
||||
.infoBox > h4 {
|
||||
padding: 1em 0 1em 1.67em;
|
||||
}
|
||||
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
article {
|
||||
@@ -28,11 +35,6 @@ header {
|
||||
z-index: -100;
|
||||
}
|
||||
|
||||
header > h1 {
|
||||
margin: 0;
|
||||
padding: 1em
|
||||
}
|
||||
|
||||
article {
|
||||
padding: 1em;
|
||||
margin: 0 auto;
|
||||
@@ -56,6 +58,11 @@ nav {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
header > h1 {
|
||||
margin: 0;
|
||||
padding: 1em
|
||||
}
|
||||
|
||||
nav > ul {
|
||||
padding: 2em 0em 2em 0;
|
||||
margin: 0
|
||||
@@ -77,15 +84,12 @@ div#maincontent {
|
||||
padding: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
/*A bit of a hack to fix the jquery slide toggle*/
|
||||
div#panel {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0
|
||||
}
|
||||
|
||||
img#profilePic {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
@@ -98,37 +102,62 @@ span#imgDiv {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.circular {
|
||||
border-radius: 150px;
|
||||
-webkit-border-radius: 150px;
|
||||
-moz-border-radius: 150px;
|
||||
box-shadow: 0 0 8px rgba(0, 0, 0, .8);
|
||||
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
|
||||
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
|
||||
.infoBox > h4 {
|
||||
background-color: LightGray;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* unvisited link */
|
||||
a:link {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
div.infoBox > div > p{
|
||||
background-color: #E8E8E8;
|
||||
padding: 1.67em;
|
||||
}
|
||||
|
||||
/* visited link */
|
||||
a:visited {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
.showhide > div.heading {
|
||||
background-color: LightGray;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* mouse over link */
|
||||
a:hover {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
.showhide > div.heading > h4, h5 {
|
||||
display: inline-block;
|
||||
padding: 1em 0 1em 2em;
|
||||
margin-top: auto;
|
||||
margin-bottom: auto;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* selected link */
|
||||
a:active {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
.plusminus {
|
||||
float: right;
|
||||
display: inline-block;
|
||||
padding: 0em 1em 0em 0em;
|
||||
font-size: 1.66em;
|
||||
}
|
||||
|
||||
.plusminus > i {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.fa-plus {
|
||||
color: white;
|
||||
text-shadow:
|
||||
-1px -1px 0 DarkGray,
|
||||
1px -1px 0 DarkGray,
|
||||
-1px 1px 0 DarkGray,
|
||||
1px 1px 0 DarkGray;
|
||||
}
|
||||
.fa-minus {
|
||||
color: white;
|
||||
text-shadow:
|
||||
-1px -1px 0 DarkGray,
|
||||
1px -1px 0 DarkGray,
|
||||
-1px 1px 0 DarkGray,
|
||||
1px 1px 0 DarkGray;
|
||||
}
|
||||
|
||||
div.infoBox > div > div > p {
|
||||
background-color: #E8E8E8;
|
||||
padding: 1.67em;
|
||||
}
|
||||
|
||||
#magic-line {
|
||||
@@ -138,3 +167,11 @@ a:active {
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.circular {
|
||||
border-radius: 150px;
|
||||
-webkit-border-radius: 150px;
|
||||
-moz-border-radius: 150px;
|
||||
box-shadow: 0 0 8px rgba(0, 0, 0, .8);
|
||||
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
|
||||
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user