Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
216 changes: 215 additions & 1 deletion css/index.css
Original file line number Diff line number Diff line change
@@ -1 +1,215 @@
/* Compile your LESS file! */
@font-face {
font-family: 'Anton';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Anton Regular'), local('Anton-Regular'), url(https://fonts.gstatic.com/s/anton/v11/1Ptgg87LROyAm0K0.ttf) format('truetype');
}
@font-face {
font-family: 'Chelsea Market';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Chelsea Market'), local('ChelseaMarket-Regular'), url(https://fonts.gstatic.com/s/chelseamarket/v7/BCawqZsHqfr89WNP_IApC8tzKBhl.ttf) format('truetype');
}
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
font-family: 'Anton', sans-serif;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* Set every element's box-sizing to border-box */
* {
box-sizing: border-box;
}
html,
body {
height: 100%;
background-color: #994a4a;
}
ul.header-nav li {
float: none;
display: inline-block;
text-align: center;
list-style: none;
text-decoration: none;
padding: 10px;
border: 1px solid black;
color: skyblue;
}
ul.header-nav {
display: flex;
justify-content: center;
color: skyblue;
}
div.header li a {
color: black;
text-decoration: none;
}
div.header li a:hover {
background-color: blue;
}
h1 {
font-size: xxx-large;
display: flex;
justify-content: center;
margin-top: 2rem;
margin-bottom: 2rem;
}
:hover {
font-size: x-large;
}
h2 {
font-size: x-large;
display: flex;
justify-content: center;
margin-bottom: 2rem;
}
h2:hover {
color: skyblue;
}
.twolists {
display: flex;
flex-direction: row;
justify-content: center;
}
@media (max-width: 500px) {
display: flex;
flex-direction: column;
}
.ulspace {
margin-left: 2rem;
margin-right: 2rem;
}
.footer {
display: flex;
justify-content: center;
margin-top: 3rem;
font-size: medium;
}
.footer:hover {
color: skyblue;
}
41 changes: 40 additions & 1 deletion index.html
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@

<!doctype html>

<html lang="en">
Expand All @@ -14,6 +15,44 @@
</head>

<body>
<h1>My Resume</h1>
<Header>

<div class="header">
<ul class="header-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="content.html">Content</a></li>
<li><a href="projects.html">Projects</a></li>
</ul>

</div>

</Header>
<h1>Welcome to my Portfolio feel free to browse</h1>
<br>
<br>
<h2>Seasoned technology professional and recent Lambda Coding Academy Graduate</h2>
<div class="twolists">
<ul class="ulspace">
<li>Boxer</li>
<li>Wrestler</li>
<li>Dog Trainer</li>
<li>Streamer</li>
<li>Good Listener</li>
</ul>

<ul class="ulspace">
<li>IBM</li>
<li>Wang Global Government</li>
<li>Clear Technology</li>
<li>Versatile Software</li>
<li>Technology Firm</li>
</ul>
</div>
<div>
<footer class="footer">
Contact Michael 720 696 2698
</footer>
</div>
</body>
</html>
101 changes: 100 additions & 1 deletion less/index.less
Original file line number Diff line number Diff line change
@@ -1,8 +1,32 @@
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Chelsea+Market&display=swap');

// Is this working?
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
@main-font: 'Anton', sans-serif;
@main-color: skyblue;

.centerbottom()
{
display: flex;
justify-content: center;
margin-top: 3rem;
font-size: medium;
&:hover{
color:@main-color;
}
}

.flexcenter()
{display: flex;
flex-direction: row;
justify-content: center;}





html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
Expand All @@ -23,6 +47,7 @@ time, mark, audio, video {
font-size: 100%;
font: inherit;
vertical-align: baseline;
font-family: @main-font;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
Expand Down Expand Up @@ -54,6 +79,80 @@ table {
}

html, body {
height: 100%;
height: 100%;
background-color: rgb(153, 74, 74);

}
ul.header-nav li {
float: none;
display: inline-block;
text-align: center;
list-style: none;
text-decoration: none;
padding: 10px;
border: 1px solid black;
color:@main-color;

}

ul.header-nav {
display: flex;
justify-content: center;
color:@main-color;
}

div.header li a {
color: black;
text-decoration: none;
}
div.header li a:hover {
background-color: blue;
}

h1
{
font-size: xxx-large;
display: flex;
justify-content: center;
margin-top: 2rem;
margin-bottom: 2rem;
}
&:hover
{

font-size: x-large;
}



h2
{
font-size: x-large;
display: flex;
justify-content: center;
margin-bottom: 2rem;
&:hover{
color:@main-color;
}
}

.twolists
{
.flexcenter()
}
@media (max-width: 500px)
{
display: flex;
flex-direction: column;
}


.ulspace
{
margin-left: 2rem;
margin-right: 2rem;
}
.footer
{.centerbottom()}