Skip to content

Commit

Permalink
minor fix site
Browse files Browse the repository at this point in the history
  • Loading branch information
@zhengchun
zhengchun committed Nov 1, 2023
1 parent 02fef8c commit 91c6f44
Show file tree
Hide file tree
Showing 7 changed files with 250 additions and 164 deletions.
76 changes: 59 additions & 17 deletions site/assets/scss/_docs.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,20 +6,62 @@ code {
overflow-wrap: break-word;
}

.doc-intro {
max-width: 640px;
.bd-layout {
display: flex;
flex-direction: column;

@include media-breakpoint-up(lg) {
display: grid;
grid-template-areas: "sidebar main";
grid-template-columns: min-content 1fr;
gap: 0;
}
}

.doc-content {
@include media-breakpoint-up(lg) {
max-width: 760px;
.bd-sidebar {
grid-area: sidebar;
}

.bd-main {
grid-area: main;
display: grid;
grid-template-areas:
"intro"
"content"
"footer";
grid-template-rows: auto 1fr;

.tab-content {
grid-area: content;
}
}

.bd-intro {
grid-area: intro;
}

.bd-main-content {
display: grid;
grid-area: content;
grid-template-areas: "content toc";
grid-template-columns: 1fr min-content;
}

.bd-toc {
grid-area: toc;
width: 220px;
}

.bd-content {
min-width: 1px;
grid-area: content;
position: relative;

& > h2,
& > h3,
& > h4,
& > h5,
& > h6 {
> h2,
> h3,
> h4,
> h5,
> h6 {
margin-top: 8px;
margin-bottom: 16px;

Expand All @@ -33,7 +75,7 @@ code {
}
}

& > p {
> p {
margin-bottom: 16px;
word-break: break-word;
line-height: 1.6;
Expand All @@ -47,27 +89,27 @@ code {
}
}

& > h2 {
> h2 {
font-size: 24px;
}

& > h3 {
> h3 {
font-size: 20px;
}

& > h4 {
> h4 {
font-size: 18px;
}

& > h5 {
> h5 {
font-size: 16px;
}

& > h6 {
> h6 {
font-size: 14px;
}

& > ul > li {
> ul > li {
margin-bottom: 4px;

&:last-child {
Expand Down
2 changes: 1 addition & 1 deletion site/content/get-started/installation/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
layout: docs
title: Installation
description: "FastBootstrap installation guide."
toc: false
toc: true
menu:
get-started:
weight: 1
Expand Down
89 changes: 44 additions & 45 deletions site/layouts/_default/docs.html
View file
Original file line number Diff line number Diff line change
@@ -1,62 +1,61 @@
{{ define "main" }}
<div class="d-flex flex-column flex-lg-row">
<div class="sidebar border-end">
<div class="d-flex d-lg-none align-items-center">
<div class="container">
<div class="d-flex justify-content-between align-items-center py-3">
<nav aria-label="breadcrumb">
<ol class="breadcrumb mb-0">
<li class="breadcrumb-item"><a href="/">Home</a></li>
{{ if and .Parent (ne .Parent.IsHome true) }}
<li class="breadcrumb-item"><a href="{{ .Parent.RelPermalink }}">{{ .Parent.Title }}</a></li>
{{ end }}
<li class="breadcrumb-item active" aria-current="page">{{ .Title }}</li>
</ol>
</nav>
<button class="btn btn-sm p-0 border-0" data-bs-toggle="collapse" href="#sidebar-nav" aria-expanded="false"><i class="fas fa-chevron-down"></i></button>
<div class="bd-layout">
<aside class="bd-sidebar border-end">
<div class="sidebar">
<div class="d-flex d-lg-none align-items-center">
<div class="container">
<div class="d-flex justify-content-between align-items-center py-3">
<nav aria-label="breadcrumb">
<ol class="breadcrumb mb-0">
<li class="breadcrumb-item"><a href="/">Home</a></li>
{{ if and .Parent (ne .Parent.IsHome true) }}
<li class="breadcrumb-item"><a href="{{ .Parent.RelPermalink }}">{{ .Parent.Title }}</a></li>
{{ end }}
<li class="breadcrumb-item active" aria-current="page">{{ .Title }}</li>
</ol>
</nav>
<button class="btn btn-sm p-0 border-0" data-bs-toggle="collapse" href="#sidebar-nav" aria-expanded="false"><i class="fas fa-chevron-down"></i></button>
</div>
</div>
</div>
<div class="collapse d-lg-block py-3 py-lg-4" id="sidebar-nav">
{{ partial "sidebar.html" (dict "page" . "active_menu" $.CurrentSection.Params.sidebar_menu) }}
</div>
</div>
<div class="collapse d-lg-block py-3 py-lg-4" id="sidebar-nav">
{{ partial "sidebar.html" (dict "page" . "active_menu" $.CurrentSection.Params.sidebar_menu) }}
</div>
</div>

<main class="doc-main d-flex flex-grow-1 flex-column">
<div class="bd-bg-light px-4 px-md-6 px-lg-10 px-xl-20">
<div class="py-4 py-md-6 py-lg-10 py-xl-20">
<div class="d-flex align-items-center gap-2">
<h1 class="fw-semibold fs-2">{{ .Title | markdownify }}</h1>
{{ with .Params.status }}<span class="lozenge {{ . }} fw-normal">{{ . }}</span>{{ end }}
</div>
<p class="mt-3 text-body-secondary">{{ .Page.Params.Description | markdownify }}</p>
</div>
</div>

</aside>
<main class="bd-main">
{{ with .Params.tabs }}
{{ $.Content }}
{{ else }}
<div class="px-4 px-md-6 px-lg-10 px-xl-20">
<div class="pt-5 pb-5 pb-lg-6">
<div class="d-flex flex-column flex-lg-row-reverse justify-content-lg-end gap-xl-6">
{{ if (eq .Page.Params.toc true) }}
<div class="doc-nav align-self-start d-none d-xl-flex flex-column fs-sm">
<span class="fw-semibold fs-xs text-uppercase">Contents</span>
<div class="doc-nav-content position-relative mt-2">
{{ .TableOfContents }}
</div>
</div>
{{ end }}
<div class="doc-content d-flex flex-grow-1 flex-column" data-bs-spy="scroll" data-bs-target=".doc-nav-content" data-bs-smooth-scroll="true" tabindex="0">
{{ .Content }}
<div class="bd-intro">
<div class="bd-bg-light px-4 px-md-6 px-lg-10 px-xl-20">
<div class="py-4 py-md-6 py-lg-10 py-xl-20">
<div class="d-flex align-items-center gap-2">
<h1 class="fw-semibold fs-2">{{ .Title | markdownify }}</h1>
{{ with .Params.status }}<span class="lozenge {{ . }} fw-normal">{{ . }}</span>{{ end }}
</div>
<p class="mt-3 text-body-secondary">{{ .Params.Description | markdownify }}</p>
</div>
</div>
</div>
<div class="bd-main-content">
<div class="bd-toc d-none d-xl-block py-8">
{{ if (eq .Page.Params.toc true) }}
<div class="doc-nav fs-sm pe-3">
<span class="fw-semibold fs-xs text-uppercase">Contents</span>
<div class="doc-nav-content position-relative mt-2">
{{ .TableOfContents }}
</div>
</div>
{{ end }}
</div>
<div class="bd-content px-4 px-md-6 px-lg-10 px-xl-20 py-8" data-bs-spy="scroll" id="doc-content" data-bs-target=".doc-nav-content" data-bs-smooth-scroll="true" tabindex="0">
{{ .Content }}
</div>
</div>
{{ end }}
</main>
</div>
{{ end }}
{{ define "footer" }}

{{ end }}
15 changes: 10 additions & 5 deletions site/layouts/_default/list.html
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,16 @@
{{ define "main" }}
<div class="d-flex flex-column flex-lg-row">
<div class="bd-layout">
<aside class="bd-sidebar border-end">
<div class="sidebar d-flex flex-column border-end flex-shrink-0">
<div class="collapse d-lg-block" id="sidebar-nav">
<div class="sidebar__inner py-3 py-lg-4">
{{ partial "sidebar.html" (dict "page" . "active_menu" .Params.sidebar_menu) }}
</div>
</div>
</div>

<main id="main" class="d-flex flex-column flex-grow-1">
</aside>
<main class="bd-main">
<div class="bd-intro">
<div class="bd-bg-light px-4 px-md-6 px-lg-10 px-xl-20">
<div class="row g-0">
<div class="col-12 col-md-8 col-lg-6">
Expand All @@ -24,11 +26,14 @@ <h1 class="mb-0">{{ .Title | markdownify }}</h1>
{{- end -}}
</div>
</div>
</div>
<div class="bd-main-content">
<div class="max-w-screen-lg">
<div class="px-4 px-md-6 px-lg-10 px-xl-20 my-8">
{{ partial "page-list" (dict "pages" .Pages "icon_css" .Params.styles.list_icon_css ) }}
</div>
</div>
</main>
</div>
</div>
</main>
</div>
{{ end }}
16 changes: 10 additions & 6 deletions site/layouts/components/list.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,18 @@
{{ end }}
{{ $pages = merge $pages (dict $name $list) }}
{{ end }}

<div class="d-flex flex-column flex-lg-row">
<div class="bd-layout">
<aside class="bd-sidebar border-end">
<div class="sidebar d-flex flex-column border-end flex-shrink-0">
<div class="collapse d-lg-block" id="sidebar-nav">
<div class="sidebar__inner py-3 py-lg-4">
{{ partial "sidebar.html" (dict "page" . "active_menu" .Params.sidebar_menu) }}
</div>
</div>
</div>

<main id="main" class="d-flex flex-column flex-grow-1">
</aside>
<main class="bd-main">
<div class="bd-intro">
<div class="bd-bg-light px-4 px-md-6 px-lg-10 px-xl-20">
<div class="row g-0">
<div class="col-12 col-md-8 col-lg-6">
Expand All @@ -39,6 +40,8 @@ <h1 class="mb-0">{{ .Title | markdownify }}</h1>
{{- end -}}
</div>
</div>
</div>
<div class="bd-main-content">
<div class="max-w-screen-lg">
<div class="px-4 px-md-6 px-lg-10 px-xl-20 my-8">
{{ range $key := (sort $keys) }}
Expand Down Expand Up @@ -69,6 +72,7 @@ <h2 class="card-title h5 d-flex align-items-center">{{ $title }}
{{ end }}
</div>
</div>
</main>
</div>
</div>
</main>
</div>
{{ end }}
73 changes: 51 additions & 22 deletions site/layouts/docs/list.html
View file
Original file line number Diff line number Diff line change
@@ -1,34 +1,63 @@
{{ define "main" }}
<div class="d-flex flex-column flex-lg-row">
<div class="sidebar d-flex flex-column flex-shrink-0 border-end">
<div class="collapse d-lg-block" id="sidebar-nav">
<div class="sidebar__inner py-3 py-lg-4">
{{ partial "sidebar.html" (dict "page" . "active_menu" .Params.sidebar_menu) }}
{{ $pages := dict }}
{{ $keys := slice }}
{{ range .Pages }}
{{ $page := . }}
{{ $name := .Params.group | default "Misc" }}
{{ $list := slice }}
{{ with index $pages $name }}
{{ $list = . | append $page }}
{{ else }}
{{ $list = slice . }}
{{ $keys = $keys | append $name }}
{{ end }}
{{ $pages = merge $pages (dict $name $list) }}
{{ end }}


<div class="bd-layout">
<aside class="bd-sidebar border-end">
<div class="sidebar d-flex flex-column border-end flex-shrink-0">
<div class="collapse d-lg-block" id="sidebar-nav">
<div class="sidebar__inner py-3 py-lg-4">
{{ partial "sidebar.html" (dict "page" . "active_menu" .Params.sidebar_menu) }}
</div>
</div>
</div>
</div>

<main id="main" class="d-flex flex-column flex-grow-1">
<div class="bd-bg-light px-4 px-md-6 px-lg-10 px-xl-20">
<div class="row g-0">
<div class="col-12 col-md-8 col-lg-6">
<div class="py-4 py-md-6 py-lg-10 py-xl-20">
<h1 class="mb-0">{{ .Title | markdownify }}</h1>
<p class="mt-3 text-body-secondary">{{ .Content | markdownify }}</p>
</aside>
<main class="bd-main">
<div class="bd-intro">
<div class="bd-bg-light px-4 px-md-6 px-lg-10 px-xl-20">
<div class="row g-0">
<div class="col-12 col-md-8 col-lg-6">
<div class="py-4 py-md-6 py-lg-10 py-xl-20">
<h1 class="mb-0">{{ .Title | markdownify }}</h1>
<p class="mt-3 text-body-secondary">{{ .Content | markdownify }}</p>
</div>
</div>
{{- with .Param "image" -}}
<div class="d-none d-md-block col-md-4 col-lg-6">
<img class="w-100 h-auto max-w-sm" src="{{ . }}" />
</div>
{{- end -}}
</div>
{{- with .Param "image" -}}
<div class="d-none d-md-block col-md-4 col-lg-6">
<img class="w-100 h-auto max-w-sm" src="{{ . }}" />
</div>
{{- end -}}
</div>
</div>
<div class="max-w-screen-lg">
<div class="bd-main-content">
<div class="px-4 px-md-6 px-lg-10 px-xl-20 my-8">

<h2 class="fs-4"><i class="fa-solid fa-book fa-lg"></i> Utility Classes Quick Reference</h2>
{{ range $key := (sort $keys) }}
<h3 class="fs-5 mt-6 mb-4">{{ $key | strings.FirstUpper }}</h3>
<div class="row g-3">
{{ range index $pages $key }}
<div class="col-6 col-lg-4 col-xl-3">
<a href="{{ .RelPermalink }}">{{ .Title }}</a>
</div>
{{ end }}
</div>
{{ end }}
</div>
</div>
</main>
</div>
{{ end }}
{{ end }}

0 comments on commit 91c6f44

Please sign in to comment.