Added basic structure of the html template
This commit is contained in:
parent
f00704fc99
commit
16009fe39e
3 changed files with 102 additions and 3 deletions
|
@ -1,3 +1,86 @@
|
||||||
@import 'tailwindcss/base';
|
@font-face {
|
||||||
@import 'tailwindcss/components';
|
font-family: 'Custom';
|
||||||
@import 'tailwindcss/utilities';
|
src: url("JetBrainsMono[wght].ttf");
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
font-family: 'Custom', monospace;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
border-bottom: thin solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
header h1 {
|
||||||
|
max-width: 950px;
|
||||||
|
font-weight: 650;
|
||||||
|
padding: 1rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
overflow-x: auto;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul {
|
||||||
|
list-style-type: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 950px;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul li {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul li a {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul li[aria-current] a {
|
||||||
|
padding-bottom: .8rem;
|
||||||
|
border-bottom: .2rem solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
max-width: 950px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
article section {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: flex-end;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
article section h2 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
article section:first-of-type {
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
article section p {
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
main hr {
|
||||||
|
width: 75%;
|
||||||
|
}
|
||||||
|
|
||||||
|
main hr:last-of-type {
|
||||||
|
display: none;
|
||||||
|
}
|
|
@ -5,10 +5,26 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="canonical" href="{{ $page->getUrl() }}">
|
<link rel="canonical" href="{{ $page->getUrl() }}">
|
||||||
<meta name="description" content="{{ $page->description }}">
|
<meta name="description" content="{{ $page->description }}">
|
||||||
|
<meta name="color-scheme" content="dark light">
|
||||||
<title>{{ $page->title }}</title>
|
<title>{{ $page->title }}</title>
|
||||||
<link rel="stylesheet" href="{{ mix('css/main.css', 'assets/build') }}">
|
<link rel="stylesheet" href="{{ mix('css/main.css', 'assets/build') }}">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Nikus Blog</h1>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li aria-current="page"><a href="#">Home</a></li>
|
||||||
|
<li><a href="#">Projects</a></li>
|
||||||
|
<li><a href="#">About</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main>
|
||||||
@yield('body')
|
@yield('body')
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<p>Hello World</p>
|
||||||
|
</footer>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
BIN
source/assets/fonts/JetBrainsMono[wght].ttf
Normal file
BIN
source/assets/fonts/JetBrainsMono[wght].ttf
Normal file
Binary file not shown.
Loading…
Reference in a new issue