diff options
| author | Doge <[email protected]> | 2021-05-08 16:36:20 +0800 |
|---|---|---|
| committer | Doge <[email protected]> | 2021-05-08 16:36:20 +0800 |
| commit | 0b552cbbf605b897c96e5a09e3a339f8a0955dc3 (patch) | |
| tree | 96c63db1c60c3c57201a8f9f2d19b425a9a8306e /layout | |
| parent | 569f72f60f6a8e6227c2eac081ec1a91398c07d6 (diff) | |
| download | chromate-0b552cbbf605b897c96e5a09e3a339f8a0955dc3.tar.gz chromate-0b552cbbf605b897c96e5a09e3a339f8a0955dc3.tar.bz2 chromate-0b552cbbf605b897c96e5a09e3a339f8a0955dc3.zip | |
Draw header page
Diffstat (limited to 'layout')
| -rw-r--r-- | layout/_partial/head.ejs | 2 | ||||
| -rw-r--r-- | layout/_partial/header.ejs | 87 |
2 files changed, 57 insertions, 32 deletions
diff --git a/layout/_partial/head.ejs b/layout/_partial/head.ejs index 3d4ee79..d20850c 100644 --- a/layout/_partial/head.ejs +++ b/layout/_partial/head.ejs @@ -21,6 +21,6 @@ <!-- Scripts and styles --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma/css/bulma.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/font-awesome.min.css"> - <link rel="stylesheet" type="text/css" href="https://unpkg.com/bulma-prefers-dark" /> + <link rel="stylesheet" href="https://unpkg.com/[email protected]/css/bulma-prefers-dark.min.css" /> <%- css("css/style.css") %> </head>
\ No newline at end of file diff --git a/layout/_partial/header.ejs b/layout/_partial/header.ejs index 32d2d2a..f7fef30 100644 --- a/layout/_partial/header.ejs +++ b/layout/_partial/header.ejs @@ -1,33 +1,58 @@ -<header class="header"> - <div class="header-topbar"> - <div class="header-title"> - <%= config.title %> - </div> - <div class="header-menu"> - <% for (let item of theme.menubar) { %> - <a href="<%= item[0] %>"><%= item[1] %></a> - <% } %> - </div> +<section id="header-page" class="hero is-light is-fullheight"> + <div class="hero-head"> + <header class="navbar" aria-label="main navigation"> + <div class="container"> + <div class="navbar-brand header-title"> + <a class="navbar-item is-uppercase has-text-weight-semibold" href="<%= url_for('/') %>"> + <%= config.title %> + </a> + <a role="button" class="navbar-burger" data-target="header-menu" aria-label="menu" aria-expanded="false"> + <span aria-hidden="true"></span> + <span aria-hidden="true"></span> + <span aria-hidden="true"></span> + </a> + </div> + <div class="navbar-menu" id="header-menu"> + <div class="navbar-end"> + <% for (let item of theme.menubar) { %> + <a class="navbar-item is-uppercase" href="<%= item[0] %>"> + <%= item[1] %> + </a> + <% } %> + </div> + </div> + </div> + </header> </div> - <% if (theme.logo) { %> - <div class="header-logo" style="background-image: url('<%= theme.logo %>');"></div> - <% } %> - <div class="header-desc"> - <%= config.description %> + + <div class="hero-body"> + <div class="container has-text-centered"> + <p class="title"> + <% if (theme.logo) { %> + <span class="header-logo" style="background-image: url('<%= theme.logo %>');"> + </span> + <% } else { %> + <span class="header-title is-size-2 is-family-monospace is-uppercase"> + <%= config.title %> + </span> + <% } %> + </p> + <p class="subtitle is-size-6"> + <%- config.description %> + <ul class="header-navbar"> + <% for (let index in theme.navbar) { %> + <% + const mapping = theme.navbar[index]; + const link = mapping[0]; + const favicon = mapping[1]; + let outter = link.startsWith("https://") ? true : false; + %> + <a class="icon" href="<%= link %>" target="<%= outter ? '_blank' : '_self' %>"> + <i class="<%= favicon %>"></i> + </a> + <% } %> + </ul> + </p> + </div> </div> - <nav class="header-navbar"> - <ul class="header-menu"> - <% for (let index in theme.navbar) { %> - <% - const mapping = theme.navbar[index]; - const link = mapping[0]; - const favicon = mapping[1]; - let outter = link.startsWith("https://") ? true : false; - %> - <a href="<%= link %>" target="<%= outter ? '_blank' : '_self' %>"> - <i class="<%= favicon %>"></i> - </a> - <% } %> - </ul> - </nav> -</header>
\ No newline at end of file +</section>
\ No newline at end of file |