update main page to use hbs for portfolio
This commit is contained in:
Nikola Petrov
parent
4c6290a599
commit
07cd4bff3a
1
.gitignore
vendored
1
.gitignore
vendored
@ -65,3 +65,4 @@ archive/
|
||||
public/assets/build/
|
||||
.vscode/
|
||||
package-lock.json
|
||||
bun.lockb
|
||||
@ -3,7 +3,34 @@ var router = express.Router();
|
||||
|
||||
/* GET home page. */
|
||||
router.get('/', function (req, res, next) {
|
||||
res.render('main/2_0', { title: 'Nikola Petrov', disableBootStrap: true });
|
||||
|
||||
const categorys = ["web development", "applications", "web design"];
|
||||
|
||||
const entry = [
|
||||
{
|
||||
category: categorys[0],
|
||||
img: "/images/logo.png",
|
||||
title: "Title 0",
|
||||
des: "desc",
|
||||
link: "#"
|
||||
},
|
||||
{
|
||||
category: categorys[1],
|
||||
img: "/images/logo.png",
|
||||
title: "Title 1",
|
||||
des: "desc",
|
||||
link: "#"
|
||||
},
|
||||
{
|
||||
category: categorys[2],
|
||||
img: "/images/logo.png",
|
||||
title: "Title 2",
|
||||
des: "desc",
|
||||
link: "#"
|
||||
}
|
||||
];
|
||||
|
||||
res.render('main/2_0', { title: 'Nikola Petrov', disableBootStrap: true, categorys, entry });
|
||||
});
|
||||
|
||||
router.get('/old', function (req, res, next) {
|
||||
|
||||
@ -139,7 +139,7 @@
|
||||
<ul class="navbar-list">
|
||||
|
||||
<li class="navbar-item">
|
||||
<button class="navbar-link active" data-nav-link>About</button>
|
||||
<button class="navbar-link active" data-nav-link>About</button>
|
||||
</li>
|
||||
|
||||
<li class="navbar-item">
|
||||
@ -147,9 +147,9 @@
|
||||
</li>
|
||||
|
||||
|
||||
{{!-- <li class="navbar-item">
|
||||
<li class="navbar-item">
|
||||
<button class="navbar-link" data-nav-link>Portfolio</button>
|
||||
</li> --}}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</nav>
|
||||
@ -158,7 +158,7 @@
|
||||
- #ABOUT
|
||||
-->
|
||||
|
||||
<article class="about active" data-page="about">
|
||||
<article class="about active" data-page="about">
|
||||
|
||||
<header>
|
||||
<h2 class="h2 article-title">About me</h2>
|
||||
@ -371,17 +371,11 @@
|
||||
<button class="active" data-filter-btn>All</button>
|
||||
</li>
|
||||
|
||||
{{#each categorys}}
|
||||
<li class="filter-item">
|
||||
<button data-filter-btn>Web design</button>
|
||||
</li>
|
||||
|
||||
<li class="filter-item">
|
||||
<button data-filter-btn>Applications</button>
|
||||
</li>
|
||||
|
||||
<li class="filter-item">
|
||||
<button data-filter-btn>Web development</button>
|
||||
<button data-filter-btn>{{this}}</button>
|
||||
</li>
|
||||
{{/each}}
|
||||
|
||||
</ul>
|
||||
|
||||
@ -402,187 +396,36 @@
|
||||
<li class="select-item">
|
||||
<button data-select-item>All</button>
|
||||
</li>
|
||||
|
||||
{{#each categorys}}
|
||||
<li class="select-item">
|
||||
<button data-select-item>Web design</button>
|
||||
<button data-select-item>{{this}}</button>
|
||||
</li>
|
||||
|
||||
<li class="select-item">
|
||||
<button data-select-item>Applications</button>
|
||||
</li>
|
||||
|
||||
<li class="select-item">
|
||||
<button data-select-item>Web development</button>
|
||||
</li>
|
||||
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<ul class="project-list">
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web development">
|
||||
<a href="#">
|
||||
{{#each entry}}
|
||||
<li class="project-item active" data-filter-item data-category="{{category}}">
|
||||
<a href="{{link}}">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="finance" loading="lazy">
|
||||
<img src="{{img}}" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Finance</h3>
|
||||
<h3 class="project-title">{{title}}</h3>
|
||||
|
||||
<p class="project-category">Web development</p>
|
||||
<p class="project-category">{{des}}</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web development">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="orion" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Orion</h3>
|
||||
|
||||
<p class="project-category">Web development</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web design">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="fundo" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Fundo</h3>
|
||||
|
||||
<p class="project-category">Web design</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="applications">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="brawlhalla" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Brawlhalla</h3>
|
||||
|
||||
<p class="project-category">Applications</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web design">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="dsm." loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">DSM.</h3>
|
||||
|
||||
<p class="project-category">Web design</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web design">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="MetaSpark" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">MetaSpark</h3>
|
||||
|
||||
<p class="project-category">Web design</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web development">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="summary" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Summary</h3>
|
||||
|
||||
<p class="project-category">Web development</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="applications">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="task manager" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Task Manager</h3>
|
||||
|
||||
<p class="project-category">Applications</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="project-item active" data-filter-item data-category="web development">
|
||||
<a href="#">
|
||||
|
||||
<figure class="project-img">
|
||||
<div class="project-item-icon-box">
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</div>
|
||||
|
||||
<img src="/images/logo.png" alt="arrival" loading="lazy">
|
||||
</figure>
|
||||
|
||||
<h3 class="project-title">Arrival</h3>
|
||||
|
||||
<p class="project-category">Web development</p>
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
</section>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user