dan/links
dan/links
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

➕ add bootstrap and line icons

Browse source
This commit is contained in:
Dan Jones 2022-12-21 21:12:31 -06:00
commit a1d9d86c23
5 changed files with 50 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
Makefile
View file

@ -1,5 +1,11 @@
build/index.html: build/style.css index.html config.toml compile.js build/index.html: build/style.css index.html config.toml compile.js
node compile.js node compile.js
build/style.css: scss/style.scss build/style.css: scss/style.scss node_modules/bootstrap/scss/_root.scss
npx sass $< $@ npx sass $< $@
node_modules/bootstrap/scss/_root.scss: package-lock.json
npm ci
package-lock.json: package.json
npm install

1
config.toml
View file

@ -1 +1,2 @@
title = "Dan Jones's Links" title = "Dan Jones's Links"
name = "Dan Jones"

14
index.html
View file

@ -2,7 +2,19 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{{title}}</title> <title>{{title}}</title>
<link rel="stylesheet" href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css"/>
<link rel="stylesheet" href="style.css"/>
</head> </head>
<body></body> <body>
<header class="py-3 mb-4 border-bottom">
<div class="container d-flex flex-wrap justify-content-center">
<h1 class="d-flex align-items-center mb-3 mb-lg-0 me-lg-auto text-dark">
{{name}}
</h1>
</div>
</header>
</body>
</html> </html>

1
package.json
View file

@ -17,6 +17,7 @@
"license": "AGPL-3.0-or-later", "license": "AGPL-3.0-or-later",
"dependencies": { "dependencies": {
"@ltd/j-toml": "^1.36.0", "@ltd/j-toml": "^1.36.0",
"bootstrap": "^5.2.3",
"mustache": "^4.2.0", "mustache": "^4.2.0",
"sass": "^1.57.1" "sass": "^1.57.1"
} }

28
scss/style.scss
View file

@ -0,0 +1,28 @@
// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@import "../node_modules/bootstrap/scss/functions";
// 2. Include any default variable overrides here
// 3. Include remainder of required Bootstrap stylesheets
@import "../node_modules/bootstrap/scss/variables";
// 4. Include any default map overrides here
// 5. Include remainder of required parts
@import "../node_modules/bootstrap/scss/maps";
@import "../node_modules/bootstrap/scss/mixins";
@import "../node_modules/bootstrap/scss/root";
// 6. Optionally include any other parts as needed
@import "../node_modules/bootstrap/scss/utilities";
@import "../node_modules/bootstrap/scss/reboot";
// @import "../node_modules/bootstrap/scss/type";
// @import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/containers";
@import "../node_modules/bootstrap/scss/grid";
@import "../node_modules/bootstrap/scss/helpers";
// 7. Optionally include utilities API last to generate classes based on the Sass map in `_utilities.scss`
@import "../node_modules/bootstrap/scss/utilities/api";
// 8. Add additional custom code here