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:
Aaron Qian 2023-01-27 08:56:34 -08:00 committed by GitHub
parent cef76eb748
commit d9eccf58f4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
670 changed files with 4108 additions and 12000 deletions

View file

@ -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 }}

View file

@ -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 }}

View file

@ -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 }}

View file

@ -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 }}

View file

@ -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 }}

View file

@ -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 }}

View file

@ -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" . -}}

View file

@ -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 }}

View file

@ -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 }}

View file

@ -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 */}}

View file

@ -0,0 +1,5 @@
{{ return (dict
"outputStyle" "compressed"
"enableSourceMap" (not hugo.IsProduction)
"includePaths" "node_modules"
) }}

View 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 }}" />

View file

@ -1 +0,0 @@
<link rel="stylesheet" href="{{ "/katex/katex.min.css" | relURL }}">

View file

@ -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>

View file

@ -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 }}