Bundle CSS with Hugo's Sass feature (#705)
* migrate bootstrap and flags to bundle * migrated main.css * migrate navbar.css and plyr * migrated mulish font and darkreader * migrated static/css/sections stylesheets * migrated list page and sidebar styles * migrated search.html ( nothing to add ) * migration single page styles * remove duplicated style tags * migrate notes. Deleted unused css in static * migrate 404 css to bundle * migrate katex styles * migrate embedpdf styles * migrated katex css --------- Co-authored-by: Aaron Qian <aaron@yeet.io>
This commit is contained in:
parent
cef76eb748
commit
d9eccf58f4
670 changed files with 4108 additions and 12000 deletions
|
@ -1,7 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link rel="stylesheet" href="{{ "/css/404.css" | relURL }}">
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" (dict "baseURL" site.BaseURL "title" site.Title "hasToggleButton" false) }}
|
||||
{{ end }}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<html lang="{{ .Site.Language.Lang }}">
|
||||
<head>
|
||||
<title>{{ .Page.Title }}</title>
|
||||
<!------ ADD COMMON HEADERS -------->
|
||||
|
@ -14,7 +14,7 @@
|
|||
|
||||
</head>
|
||||
|
||||
<body data-spy="scroll" data-target="#TableOfContents" data-offset="80">
|
||||
<body class="type-{{ .Page.Type }} kind-{{ .Page.Kind }}" data-spy="scroll" data-target="#TableOfContents" data-offset="80">
|
||||
<div class="container-fluid bg-dimmed wrapper">
|
||||
<!----- ADD NAVBAR --------------->
|
||||
{{ block "navbar" . }} {{ end }}
|
||||
|
|
|
@ -1,11 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/list.css" | relURL }}">
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
|
||||
<!--================= custom style overrides =========================-->
|
||||
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}"/>
|
||||
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" . }}
|
||||
{{ end }}
|
||||
|
|
|
@ -1,11 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/list.css" | relURL }}">
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
|
||||
<!--================= custom style overrides =========================-->
|
||||
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}"/>
|
||||
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" . }}
|
||||
{{ end }}
|
||||
|
|
|
@ -1,14 +1,5 @@
|
|||
{{ define "header" }}
|
||||
<meta name="description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Title }}{{ end }}" />
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/styles/atom-one-dark.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/single.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL }}">
|
||||
<!--================= custom style overrides =========================-->
|
||||
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}"/>
|
||||
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
|
@ -190,11 +181,3 @@
|
|||
{{ end }}
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
{{ define "scripts" }}
|
||||
<!-------------- Enable Math support for this page ---------------->
|
||||
{{ if site.Params.features.math.enable }}
|
||||
{{ partial "math.html" . }}
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
|
|
@ -1,11 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/list.css" | relURL }}">
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
|
||||
<!--================= custom style overrides =========================-->
|
||||
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}"/>
|
||||
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" . }}
|
||||
{{ end }}
|
||||
|
|
|
@ -14,21 +14,6 @@
|
|||
<!-- import common headers -->
|
||||
{{- partial "header.html" . -}}
|
||||
{{- partial "opengraph.html" . -}}
|
||||
|
||||
<!-- import index page specific headers -->
|
||||
<link rel="stylesheet" href="{{ "/css/sections/home.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/about.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/skills.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/experiences.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/education.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/projects.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/recent-posts.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/achievements.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/accomplishments.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/sections/publications.css" | relURL }}"/>
|
||||
|
||||
<!--================= custom style overrides =========================-->
|
||||
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}"/>
|
||||
|
||||
<!--================= add analytics if enabled =========================-->
|
||||
{{- partial "analytics.html" . -}}
|
||||
|
|
|
@ -1,12 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/styles/atom-one-dark.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/notes.css" | relURL}}">
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" . }}
|
||||
{{ end }}
|
||||
|
@ -55,9 +46,3 @@
|
|||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
{{ define "scripts" }}
|
||||
{{ if site.Params.features.math.enable }}
|
||||
{{ partial "math.html" . }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
|
@ -1,12 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/styles/atom-one-dark.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/notes.css" | relURL}}">
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" . }}
|
||||
{{ end }}
|
||||
|
@ -45,9 +36,3 @@
|
|||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
{{ define "scripts" }}
|
||||
{{ if site.Params.features.math.enable }}
|
||||
{{ partial "math.html" . }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
|
@ -2,21 +2,7 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||
|
||||
<!-- ============ import common css ========== -->
|
||||
<link rel="stylesheet" href="{{ "/css/bootstrap.min.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/main.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/navbar.css" | relURL }}"/>
|
||||
<link rel="stylesheet" href="{{ "/css/plyr.css" | relURL }}"/>
|
||||
{{ if ne site.Params.features.flags.enable false }}
|
||||
<link rel="stylesheet" href="{{ "/css/flag-icon.min.css" | relURL }}"/>
|
||||
{{ end }}
|
||||
<!--=================== fonts ==============================-->
|
||||
<link rel="stylesheet" href="{{ "/google-fonts/Mulish/mulish.css" | relURL }}"/>
|
||||
|
||||
<!--=================== dark mode ==========================-->
|
||||
{{ if site.Params.features.darkMode.enable }}
|
||||
<link rel="stylesheet" href="{{ "/css/colortheme/colortheme.css" | relURL }}"/>
|
||||
{{ end }}
|
||||
{{ partial "helpers/style-bundle.html" . }}
|
||||
|
||||
<!--================= fab-icon =========================-->
|
||||
{{/* add favicon only if the site author has provided the the favicon */}}
|
||||
|
|
5
layouts/partials/helpers/get-sass-options.html
Normal file
5
layouts/partials/helpers/get-sass-options.html
Normal file
|
@ -0,0 +1,5 @@
|
|||
{{ return (dict
|
||||
"outputStyle" "compressed"
|
||||
"enableSourceMap" (not hugo.IsProduction)
|
||||
"includePaths" "node_modules"
|
||||
) }}
|
11
layouts/partials/helpers/style-bundle.html
Normal file
11
layouts/partials/helpers/style-bundle.html
Normal file
|
@ -0,0 +1,11 @@
|
|||
{{/* setup Sass options */}}
|
||||
{{- $options := partial "helpers/get-sass-options.html" -}}
|
||||
{{- $options = $options | merge (dict "targetPath" "application.css") -}}
|
||||
|
||||
{{/* Compile hugo template `application.template.scss` into `application.scss`. */}}
|
||||
{{- $template := resources.Get "styles/application.template.scss" -}}
|
||||
{{- $scss := $template | resources.ExecuteAsTemplate "styles/application.scss" . -}}
|
||||
|
||||
{{/* Bundle application.scss */}}
|
||||
{{- $bundle := $scss | resources.ToCSS $options | fingerprint -}}
|
||||
<link rel="stylesheet" href="{{ $bundle.RelPermalink }}" integrity="{{ $bundle.Data.Integrity }}" />
|
|
@ -1 +0,0 @@
|
|||
<link rel="stylesheet" href="{{ "/katex/katex.min.css" | relURL }}">
|
|
@ -23,46 +23,3 @@
|
|||
<canvas class="pdf-canvas"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Finally, make the canvas more beautiful -->
|
||||
<style>
|
||||
.pdf-viewer canvas {
|
||||
border: 1px solid black;
|
||||
direction: ltr;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pdf-viewer .paginator {
|
||||
display: none;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.pdf-viewer .loading-wrapper {
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.pdf-viewer .loading {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 3px solid #d2d0d0;;
|
||||
border-radius: 50%;
|
||||
border-top-color: #383838;
|
||||
animation: spin 1s ease-in-out infinite;
|
||||
-webkit-animation: spin 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { -webkit-transform: rotate(360deg); }
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
to { -webkit-transform: rotate(360deg); }
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,11 +1,3 @@
|
|||
{{ define "header" }}
|
||||
<link rel="stylesheet" href="{{ "/css/layouts/list.css" | relURL }}">
|
||||
<link rel="stylesheet" href="{{ "/css/navigators/sidebar.css" | relURL}}">
|
||||
<!--================= custom style overrides =========================-->
|
||||
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}"/>
|
||||
|
||||
{{ end }}
|
||||
|
||||
{{ define "navbar" }}
|
||||
{{ partial "navigators/navbar-2.html" . }}
|
||||
{{ end }}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue