Skip to content

Commit

Permalink
adds icons
Browse files Browse the repository at this point in the history
  • Loading branch information
Marcel Weeske committed Oct 5, 2023
1 parent 142a1da commit 78ca01b
Show file tree
Hide file tree
Showing 1,057 changed files with 29,196 additions and 75 deletions.
52 changes: 49 additions & 3 deletions assets/css/main.css
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,600,600italic,700");
@import url("https://fonts.googleapis.com/css2?family=Exo+2:wght@300&display=swap");
@import url("fontawesome-all.min.css");


/*
Miniport by HTML5 UP
html5up.net | @ajlkn
Expand Down Expand Up @@ -98,7 +99,7 @@ input, select, textarea {
}

body, input, textarea, select {
font-family: 'Open Sans', sans-serif;
font-family: 'Exo 2', sans-serif;
line-height: 1.85em;
color: #888;
font-weight: 300;
Expand Down Expand Up @@ -222,6 +223,15 @@ input, select, textarea {
}

/* Container */
.highlighted-text {
color: #61be87!important /* Text color for highlighting */
}

.underlined-text {
display: inline-block; /* Makes the element inline and allows for centering */
border-bottom: 2px solid #61be87; /* Create a solid bottom border with the desired color and thickness */
padding-bottom: 2px; /* Add some padding to separate the text from the line */
}

.container {
margin: 0 auto;
Expand Down Expand Up @@ -282,6 +292,40 @@ input, select, textarea {

}

/* Devicon Icons */

/* Style the container for each icon and description */
.icon-container {
text-align: center;
margin: 10px;
}

/* Style the icon */
.icon-container i.devicon {
font-size: 24px;
}

/* Style the description text */
.icon-container p {
margin: 5px 0;
font-weight: bold;
}

/* Arrange the first row of icons horizontally */
.icons-row {
display: flex;
justify-content: center; /* Center icons horizontally */
flex-wrap: wrap; /* Wrap to the next line if there's not enough space */
}

/* Limit the width of each row to control the number of icons per row */
.icons-row:nth-child(1) {
max-width: 800px; /* Adjust the value as needed */
}




/* Row */

.row {
Expand Down Expand Up @@ -1891,6 +1935,7 @@ input, select, textarea {
background-color: transparent;
}


/* Actions */

ul.actions {
Expand All @@ -1911,7 +1956,7 @@ input, select, textarea {
/* Box */

.box {
background: #fff;
background: #303030;
box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.15), 0px 2px 3px 0px rgba(0, 0, 0, 0.1);
text-align: center;
padding: 2em;
Expand Down Expand Up @@ -1983,6 +2028,7 @@ input, select, textarea {
.icon.featured:before {
font-size: 6em;
}


/* Wrappers */

Expand Down
148 changes: 76 additions & 72 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,15 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="node_modules/devicon/devicon.min.css">
</head>
<body class="is-preload">

<!-- Nav -->
<nav id="nav">
<ul class="container">
<li><a href="#top">Top</a></li>
<li><a href="#work">Work</a></li>
<li><a href="#top">About me</a></li>
<li><a href="#work">My Work</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
Expand All @@ -28,48 +29,97 @@
</div>
<div class="col-8 col-7-large col-12-medium">
<header>
<h1>Hi. I'm <strong>Marcel Weeske</strong>.</h1>
<h1>Hi. I'm <strong><mark class="highlighted-text">Marcel</mark></strong>.</h1>
</header>
<p>And this is <strong>Miniport</strong>, a free, fully responsive HTML5 site template designed by <a href="http://twitter.com/ajlkn">AJ</a> for <a href="http://html5up.net">HTML5 UP</a> &amp; released under the <a href="http://html5up.net/license">CCA license</a>.</p>
<a href="#work" class="button large scrolly">Learn about what I do</a>
</div>
</div>
</div>
</article>

<!-- Work -->
<article id="work" class="wrapper style2">
<article id="work" class="wrapper style4">
<div class="container">
<header>
<h2>This is my work</h2>
<p>Odio turpis amet sed consequat eget posuere consequat.</p>
<h2 >This is my work</h2>
</header>
<div class="row aln-center">
<div class="col-4 col-6-medium col-12-small">
<section class="box style1">
<span class="icon featured fa-comments"></span>
<h3>Consequat lorem</h3>
<p>Ornare nulla proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore.</p>
<section class="box style1">
<h3 class="underlined-text">Data-Engineering</h3>
</section>
</div>
<div class="col-4 col-6-medium col-12-small">
<section class="box style1">
<span class="icon solid featured fa-camera-retro"></span>
<h3>Lorem dolor tempus</h3>
<p>Ornare nulla proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore.</p>
<section class="box style1">
<h3 class="underlined-text">Backend-Engineering</h3>
</section>
</div>
<div class="col-4 col-6-medium col-12-small">
<section class="box style1">
<span class="icon featured fa-thumbs-up"></span>
<h3>Feugiat posuere</h3>
<p>Ornare nulla proin odio consequat sapien vestibulum ipsum primis sed amet consequat lorem dolore.</p>
<h3 class="underlined-text">Algorithm Development</h3>
</section>
</div>
</div>
<div>
<section>
<h2>TechStack</h2>


<div class="icons-row">
<!-- First Row of Icons -->
<div class="icon-container">
<i class="devicon devicon-javascript-plain colored"></i>
<p>JavaScript</p>
</div>
<div class="icon-container">
<i class="devicon devicon-typescript-plain colored"></i>
<p>TypeScript</p>
</div>
<div class="icon-container">
<i class="devicon devicon-python-plain colored"></i>
<p>Python</p>
</div>
<div class="icon-container">
<i class="devicon devicon-csharp-plain colored"></i>
<p>C#</p>
</div>
<div class="icon-container">
<i class="devicon devicon-labview-plain colored"></i>
<p>LabVIEW</p>
</div>
</div>

<div class="icons-row">
<!-- Second Row of Icons -->
<div class="icon-container">
<i class="devicon devicon-matlab-plain colored"></i>
<p>Matlab</p>
</div>
<div class="icon-container">
<i class="devicon devicon-graphql-plain colored"></i>
<p>GraphQL</p>
</div>
<div class="icon-container">
<i class="devicon devicon-nodejs-plain colored"></i>
<p>Node.js</p>
</div>
<div class="icon-container">
<i class="devicon devicon-kubernetes-plain colored"></i>
<p>Kubernetes</p>
</div>
<div class="icon-container">
<i class="devicon devicon-jest-plain colored"></i>
<p>Jest</p>
</div>
</div>
</section>
</div>




<footer>
<p>Lorem ipsum dolor sit sapien vestibulum ipsum primis?</p>
<a href="#portfolio" class="button large scrolly">See some of my recent work</a>

</footer>
</div>
</article>
Expand All @@ -78,56 +128,10 @@ <h3>Feugiat posuere</h3>
<article id="portfolio" class="wrapper style3">
<div class="container">
<header>
<h2>Here’s some stuff I made recently.</h2>
<p>Proin odio consequat sapien vestibulum consequat lorem dolore feugiat.</p>
<h2>Here’s some of my work.</h2>
</header>
<div class="row">
<div class="col-4 col-6-medium col-12-small">
<article class="box style2">
<a href="#" class="image featured"><img src="images/pic01.jpg" alt="" /></a>
<h3><a href="#">Magna feugiat</a></h3>
<p>Ornare nulla proin odio consequat.</p>
</article>
</div>
<div class="col-4 col-6-medium col-12-small">
<article class="box style2">
<a href="#" class="image featured"><img src="images/pic02.jpg" alt="" /></a>
<h3><a href="#">Veroeros primis</a></h3>
<p>Ornare nulla proin odio consequat.</p>
</article>
</div>
<div class="col-4 col-6-medium col-12-small">
<article class="box style2">
<a href="#" class="image featured"><img src="images/pic03.jpg" alt="" /></a>
<h3><a href="#">Lorem ipsum</a></h3>
<p>Ornare nulla proin odio consequat.</p>
</article>
</div>
<div class="col-4 col-6-medium col-12-small">
<article class="box style2">
<a href="#" class="image featured"><img src="images/pic04.jpg" alt="" /></a>
<h3><a href="#">Tempus dolore</a></h3>
<p>Ornare nulla proin odio consequat.</p>
</article>
</div>
<div class="col-4 col-6-medium col-12-small">
<article class="box style2">
<a href="#" class="image featured"><img src="images/pic05.jpg" alt="" /></a>
<h3><a href="#">Feugiat aliquam</a></h3>
<p>Ornare nulla proin odio consequat.</p>
</article>
</div>
<div class="col-4 col-6-medium col-12-small">
<article class="box style2">
<a href="#" class="image featured"><img src="images/pic06.jpg" alt="" /></a>
<h3><a href="#">Sed amet ornare</a></h3>
<p>Ornare nulla proin odio consequat.</p>
</article>
</div>
</div>
<footer>
<p>Lorem ipsum dolor sit sapien vestibulum ipsum primis?</p>
<a href="#contact" class="button large scrolly">Get in touch with me</a>
</footer>
</div>
</article>
Expand All @@ -137,7 +141,6 @@ <h3><a href="#">Sed amet ornare</a></h3>
<div class="container medium">
<header>
<h2>Have me make stuff for you.</h2>
<p>Ornare nulla proin odio consequat sapien vestibulum ipsum.</p>
</header>
<div class="row">
<div class="col-12">
Expand Down Expand Up @@ -167,7 +170,7 @@ <h2>Have me make stuff for you.</h2>
<div class="col-12">
<hr />
<h3>Find me on ...</h3>
<ul class="social">
<ul class="social">
<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon brands fa-dribbble"><span class="label">Dribbble</span></a></li>
Expand All @@ -185,15 +188,16 @@ <h3>Find me on ...</h3>
<li><a href="#" class="icon brands fa-blogger"><span>Blogger</span></a></li>
<li><a href="#" class="icon brands fa-flickr"><span>Flickr</span></a></li>
<li><a href="#" class="icon brands fa-vimeo"><span>Vimeo</span></a></li>
<li><a href="#" class="icon brands fa-instagram"><span>Instagram</span></a></li>
-->
</ul>
<hr />
</div>
</div>
<footer>
<ul id="copyright">
<li>&copy; Untitled. All rights reserved.</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</footer>
</div>
</article>
Expand Down
12 changes: 12 additions & 0 deletions node_modules/.package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

37 changes: 37 additions & 0 deletions node_modules/devicon/.github/ISSUE_TEMPLATE/bug_report.yml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions node_modules/devicon/.github/ISSUE_TEMPLATE/config.yml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 78ca01b

Please sign in to comment.