single page
This commit is contained in:
gurusabarish
@@ -1 +1,55 @@
|
||||
# Hugo Profile
|
||||
# Hugo Profile
|
||||
|
||||
# Navy Variant
|
||||
#### Demo: [here](./docs/demos/navyVariant/gif.gif)
|
||||
```yaml
|
||||
color:
|
||||
textColor: "#F5F5F5"
|
||||
secondaryTextColor: "#F5F5F5"
|
||||
backgroundColor: "#313552"
|
||||
primaryColor: "#F1E0AC"
|
||||
secondaryColor: "#30475E"
|
||||
```
|
||||
|
||||
# Blue Variant
|
||||
#### Demo: [here](./docs/demos/blueVariant/gif.gif)
|
||||
```yaml
|
||||
color:
|
||||
textColor: "#2C3333"
|
||||
secondaryTextColor: "#F5F5F5"
|
||||
backgroundColor: "#54BAB9"
|
||||
primaryColor: "#F0F0F0"
|
||||
secondaryColor: "#78C2C3"
|
||||
```
|
||||
|
||||
# Red Variant
|
||||
#### Demo: [here](./docs/demos/redVariant/gif.gif)
|
||||
```yaml
|
||||
color:
|
||||
textColor: "#121212"
|
||||
secondaryTextColor: "#311D3F"
|
||||
backgroundColor: "#FF6363"
|
||||
primaryColor: "#30475E"
|
||||
secondaryColor: "#F05454"
|
||||
```
|
||||
|
||||
# Green Variant
|
||||
#### Demo: [here](./docs/demos/greenVariant/gif.gif)
|
||||
```yaml
|
||||
color:
|
||||
textColor: "#161616"
|
||||
secondaryTextColor: "#311D3F"
|
||||
backgroundColor: "#34BE82"
|
||||
primaryColor: "#194350"
|
||||
secondaryColor: "#2FDD92"
|
||||
```
|
||||
# Pink Variant
|
||||
#### Demo: [here](./docs/demos/pinkVariant/gif.gif)
|
||||
```yaml
|
||||
color:
|
||||
textColor: "#D1D1D1"
|
||||
secondaryTextColor: "#C1A3A3"
|
||||
backgroundColor: "#470D21"
|
||||
primaryColor: "#F3F0D7"
|
||||
secondaryColor: "#781D42"
|
||||
```
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 977 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 755 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 911 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 773 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 766 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 749 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 738 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 762 KiB |
+21
-18
@@ -4,6 +4,11 @@ title: "Hugo Profile"
|
||||
|
||||
Paginate: 3
|
||||
|
||||
markup:
|
||||
goldmark:
|
||||
renderer:
|
||||
unsafe: true
|
||||
|
||||
Menus:
|
||||
main:
|
||||
- identifier: blog
|
||||
@@ -47,11 +52,11 @@ params:
|
||||
# color preference
|
||||
# color:
|
||||
# textColor:
|
||||
# secondaryTextColor:
|
||||
# backgroundColor:
|
||||
# secondaryBackgroundColor:
|
||||
# primaryColor:
|
||||
# secondaryColor:
|
||||
# secondaryTextColor:
|
||||
# backgroundColor:
|
||||
# secondaryBackgroundColor:
|
||||
# primaryColor:
|
||||
# secondaryColor:
|
||||
|
||||
# darkmode:
|
||||
# textColor:
|
||||
@@ -251,10 +256,10 @@ params:
|
||||
featured:
|
||||
name: Demo
|
||||
link: https://hugo-profile.netlify.app
|
||||
badges:
|
||||
- "Hugo"
|
||||
- "Bootstrap"
|
||||
- "Javascript"
|
||||
# badges:
|
||||
# - "Hugo"
|
||||
# - "Bootstrap"
|
||||
# - "Javascript"
|
||||
links:
|
||||
- icon: fa fa-envelope
|
||||
url: mailto:?subject=Hugo%20Profile%20Template&body=Check%20it%20out:%20https%3a%2f%2fhugo-profile.netlify.app%2fblog%2fmarkdown-syntax%2f
|
||||
@@ -269,9 +274,9 @@ params:
|
||||
featured:
|
||||
name: Demo
|
||||
link: https://django-converter.herokuapp.com
|
||||
badges:
|
||||
- "Django"
|
||||
- "Bootstrap"
|
||||
# badges:
|
||||
# - "Django"
|
||||
# - "Bootstrap"
|
||||
links:
|
||||
- icon: fab fa-github
|
||||
url: https://github.com/gurusabarish/converter
|
||||
@@ -282,10 +287,10 @@ params:
|
||||
featured:
|
||||
name: Demo V2
|
||||
link: https://hugo-profile-2.netlify.app
|
||||
badges:
|
||||
- "Hugo"
|
||||
- "Bootstrap"
|
||||
- "Javascript"
|
||||
# badges:
|
||||
# - "Hugo"
|
||||
# - "Bootstrap"
|
||||
# - "Javascript"
|
||||
links:
|
||||
- icon: fab fa-github
|
||||
url: https://github.com/gurusabarish/HugoProfileV2
|
||||
@@ -305,5 +310,3 @@ params:
|
||||
twitter: https://twitter.com
|
||||
instagram: https://instagram.com
|
||||
facebook: https://facebook.com
|
||||
|
||||
|
||||
|
||||
@@ -6,12 +6,14 @@ github_link: "https://github.com/gurusabarish/hugo-profile"
|
||||
author: "Gurusabarish"
|
||||
tags:
|
||||
- Emoji support
|
||||
bg_image: ""
|
||||
- Sample
|
||||
- example
|
||||
image: /images/post.jpg
|
||||
description: ""
|
||||
toc:
|
||||
---
|
||||
|
||||
Emoji can be enabled in a Hugo project in a number of ways.
|
||||
Emoji can be enabled in a Hugo project in a number of ways. :zap:
|
||||
|
||||
The [emojify](https://gohugo.io/functions/emojify/) function can be called directly in templates or [Inline Shortcodes](https://gohugo.io/templates/shortcode-templates/#inline-shortcodes).
|
||||
|
||||
@@ -27,8 +29,4 @@ The [Emoji cheat sheet](http://www.emoji-cheat-sheet.com/) is a useful reference
|
||||
.emoji {
|
||||
font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
|
||||
}
|
||||
```
|
||||
|
||||
<br>
|
||||
|
||||
[Markdown format for emoji](https://gist.github.com/rxaviers/7360908)
|
||||
```
|
||||
@@ -6,7 +6,9 @@ github_link: "https://github.com/gurusabarish/hugo-profile"
|
||||
author: "Gurusabarish"
|
||||
tags:
|
||||
- Markdown syntax
|
||||
bg_image: ""
|
||||
- Sample
|
||||
- example
|
||||
image: /images/post.jpg
|
||||
description: ""
|
||||
toc:
|
||||
---
|
||||
@@ -14,17 +16,6 @@ toc:
|
||||
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
|
||||
<!--more-->
|
||||
|
||||
## Headings
|
||||
|
||||
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.
|
||||
|
||||
# H1
|
||||
## H2
|
||||
### H3
|
||||
#### H4
|
||||
##### H5
|
||||
###### H6
|
||||
|
||||
## Paragraph
|
||||
|
||||
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
|
||||
@@ -36,14 +27,14 @@ Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sap
|
||||
|
||||
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
|
||||
|
||||
#### Blockquote without attribution
|
||||
### Blockquote without attribution
|
||||
|
||||
|
||||
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
|
||||
> **Note** that you can use *Markdown syntax* within a blockquote.
|
||||
|
||||
|
||||
#### Blockquote with attribution
|
||||
### Blockquote with attribution
|
||||
|
||||
|
||||
> Don't communicate by sharing memory, share memory by communicating.</p>
|
||||
@@ -61,7 +52,7 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou
|
||||
| Bob | 27 |
|
||||
| Alice | 23 |
|
||||
|
||||
#### Inline Markdown within tables
|
||||
### Inline Markdown within tables
|
||||
|
||||
| Inline | Markdown | In | Table |
|
||||
| ------------------------ | -------------------------- | ----------------------------------- | ------ |
|
||||
@@ -69,7 +60,7 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou
|
||||
|
||||
## Code Blocks
|
||||
|
||||
#### Code block with backticks
|
||||
### Code block with backticks
|
||||
|
||||
``` html
|
||||
<!DOCTYPE html>
|
||||
@@ -83,7 +74,7 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
#### Code block indented with four spaces
|
||||
### Code block indented with four spaces
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
@@ -96,7 +87,7 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou
|
||||
</body>
|
||||
</html>
|
||||
|
||||
#### Code block with Hugo's internal highlight shortcode
|
||||
### Code block with Hugo's internal highlight shortcode
|
||||
{{< highlight html >}}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
@@ -112,23 +103,34 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou
|
||||
|
||||
## List Types
|
||||
|
||||
#### Ordered List
|
||||
### Ordered List
|
||||
|
||||
1. First item
|
||||
2. Second item
|
||||
3. Third item
|
||||
|
||||
#### Unordered List
|
||||
### Unordered List
|
||||
|
||||
* List item
|
||||
* Another item
|
||||
* And another item
|
||||
|
||||
#### Nested list
|
||||
### Nested list
|
||||
|
||||
* Item
|
||||
1. First Sub-item
|
||||
2. Second Sub-item
|
||||
1. First Sub-item
|
||||
2. Second Sub-item
|
||||
|
||||
## Headings
|
||||
|
||||
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.
|
||||
|
||||
# H1
|
||||
## H2
|
||||
### H3
|
||||
#### H4
|
||||
##### H5
|
||||
###### H6
|
||||
|
||||
## Other Elements — abbr, sub, sup, kbd, mark
|
||||
|
||||
|
||||
@@ -6,7 +6,9 @@ github_link: "https://github.com/gurusabarish/hugo-profile"
|
||||
author: "Gurusabarish"
|
||||
tags:
|
||||
- Placeholder text
|
||||
bg_image: ""
|
||||
- Sample
|
||||
- example
|
||||
image: /images/post.jpg
|
||||
description: ""
|
||||
toc:
|
||||
---
|
||||
|
||||
@@ -5,7 +5,9 @@ draft: false
|
||||
author: "Gurusabarish"
|
||||
tags:
|
||||
- Rich content
|
||||
bg_image: ""
|
||||
- Sample
|
||||
- example
|
||||
image: /images/post.jpg
|
||||
description: ""
|
||||
toc:
|
||||
---
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
@@ -1,5 +1,9 @@
|
||||
{{ define "head" }}
|
||||
<meta name="description" content="{{ .Title }}">
|
||||
<link rel="stylesheet" href="/css/single.css">
|
||||
|
||||
<!-- fontawesome -->
|
||||
<script defer src="/fontawesome-5/all-5.15.4.js"></script>
|
||||
{{ end }}
|
||||
|
||||
{{ define "title" }}
|
||||
@@ -7,4 +11,80 @@
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
<section id="single">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-sm-12 col-md-12 col-lg-9">
|
||||
<div class="pr-lg-4">
|
||||
<div class="title mb-5">
|
||||
<h1 class="text-center mb-4">{{ .Title }}</h1>
|
||||
<div class="text-center">
|
||||
{{ .Params.author }}
|
||||
<small>|</small>
|
||||
{{ .Date.Format "Jan 2, 2006" }}
|
||||
</div>
|
||||
</div>
|
||||
{{ if .Params.image }}
|
||||
<div class="featured-image">
|
||||
<img class="img-fluid" src="{{ .Params.image }}" alt="{{ .Title }}">
|
||||
</div>
|
||||
{{ end }}
|
||||
<article class="page-content">
|
||||
{{ .Content | emojify }}
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12 col-md-12 col-lg-3">
|
||||
<div class="sticky-sidebar">
|
||||
{{ if .Params.toc | default true}}
|
||||
<aside class="toc">
|
||||
<h5>
|
||||
Table Of Contents
|
||||
</h5>
|
||||
<div class="toc-content">
|
||||
{{.TableOfContents}}
|
||||
</div>
|
||||
</aside>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Params.tags }}
|
||||
<aside class="tags">
|
||||
<h5>Tags</h5>
|
||||
<ul class="tags-ul list-unstyled list-inline">
|
||||
{{range .Params.tags}}
|
||||
<li class="list-inline-item"><a href="{{`tags` | absURL}}/{{.| urlize}}" target="_blank">{{.}}</a></li>
|
||||
{{end}}
|
||||
</ul>
|
||||
</aside>
|
||||
{{end}}
|
||||
|
||||
{{ if .Params.socialShare | default true }}
|
||||
<aside class="social">
|
||||
<h5>Social</h5>
|
||||
<div class="social-content">
|
||||
<ul class="list-inline">
|
||||
<li class="list-inline-item text-center">
|
||||
<a target="_blank" href="https://twitter.com/share?text={{ .Title }}&url={{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="list-inline-item text-center">
|
||||
<a target="_blank" href="https://api.whatsapp.com/send?text={{ .Title }}: {{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
|
||||
<i class="fab fa-whatsapp"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="list-inline-item text-center">
|
||||
<a target="_blank" href="mailto:?subject={{ .Title }}&body=Check out this site {{ .Site.Params.hostName }}{{ .Permalink | absURL }}">
|
||||
<i class="fa fa-envelope"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -1,10 +0,0 @@
|
||||
{{ define "head" }}
|
||||
<meta name="description" content="{{ .Title }}">
|
||||
{{ end }}
|
||||
|
||||
{{ define "title" }}
|
||||
{{.Title }} | {{ .Site.Title }}
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
{{ end }}
|
||||
@@ -1,3 +1,6 @@
|
||||
footer a h5 {
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
footer a {
|
||||
text-decoration: none;
|
||||
@@ -24,14 +27,21 @@ footer .card-text * {
|
||||
background-color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
footer .card-footer {
|
||||
background-color: var(--background-color) !important;
|
||||
padding: .8em .7em;
|
||||
}
|
||||
|
||||
footer .card-footer a {
|
||||
color: var(--text-secondary-color) !important;
|
||||
border-color: var(--primary-color) !important;
|
||||
transition: none;
|
||||
background-color: var(--background-color) !important;
|
||||
}
|
||||
|
||||
footer .card-footer a:hover {
|
||||
color: var(--primary-color) !important;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
footer .card-footer a:focus {
|
||||
|
||||
+21
-1
@@ -1,3 +1,12 @@
|
||||
header .navbar .navbar-nav a {
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
#theme-toggle {
|
||||
background-color: var(--background-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
.navbar-toggler {
|
||||
border: none;
|
||||
outline: none;
|
||||
@@ -22,9 +31,20 @@ header .nav-link{
|
||||
.navbar .nav-link:hover {
|
||||
color: var(--primary-color) !important;
|
||||
}
|
||||
li> .dropdown-toggle:focus{
|
||||
|
||||
li > .dropdown-toggle:focus{
|
||||
color: var(--primary-color) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background-color: var(--background-color) !important;
|
||||
border-color: var(--text-secondary-color) !important;
|
||||
}
|
||||
|
||||
.dropdown-item:hover {
|
||||
background-color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
.dropdown-item:focus, .dropdown-item:active {
|
||||
background-color: var(--secondary-color) !important;
|
||||
}
|
||||
+23
-7
@@ -55,9 +55,9 @@
|
||||
}
|
||||
|
||||
#hero a.btn.social-icon {
|
||||
color: var(--primary-color);
|
||||
color: var(--primary-color) !important;
|
||||
line-height: 0%;
|
||||
border-radius: 50% ;
|
||||
border-radius: 50%;
|
||||
margin-top: 50px;
|
||||
padding: 0.7rem;
|
||||
border: 1px solid var(--primary-color);
|
||||
@@ -76,6 +76,7 @@
|
||||
margin-top: 50px;
|
||||
padding: 0.7rem 1.75rem;
|
||||
border: 1px solid var(--primary-color);
|
||||
color: var(--text-color) !important;
|
||||
border-radius: .75rem;
|
||||
transition: none;
|
||||
}
|
||||
@@ -157,7 +158,8 @@
|
||||
}
|
||||
|
||||
#about .content {
|
||||
opacity: 0.95 !important;
|
||||
font-weight: 500;
|
||||
opacity: 0.9 !important;
|
||||
line-height: 1.7rem !important;
|
||||
}
|
||||
|
||||
@@ -193,7 +195,7 @@
|
||||
}
|
||||
|
||||
#experience .tab-pane > * {
|
||||
opacity: 0.95;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#experience .tab-pane small {
|
||||
@@ -217,12 +219,14 @@
|
||||
}
|
||||
|
||||
#experience .nav-item .nav-link {
|
||||
color: var(--text-color) !important;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-radius: 0%;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
#experience .nav-item .nav-link.active {
|
||||
#experience .nav-item .nav-link.active {
|
||||
color: var(--text-color) !important;
|
||||
border-bottom: 2px solid var(--primary-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
@@ -231,7 +235,7 @@
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
#experience .nav-item .nav-link:hover {
|
||||
#experience .nav-item .nav-link:hover {
|
||||
border-bottom: 2px solid var(--primary-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
@@ -349,6 +353,12 @@
|
||||
border: 2px solid var(--primary-color) !important;
|
||||
}
|
||||
|
||||
#education .card .card-body .education-content a {
|
||||
color: var(--primary-color) !important;
|
||||
text-decoration: none;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#education .card .card-body > a h6 {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
@@ -373,6 +383,7 @@
|
||||
#education .card .card-body a.btn {
|
||||
opacity: 0.9;
|
||||
border: 1px solid var(--primary-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
border-radius: .75rem;
|
||||
box-shadow: none;
|
||||
transition: none;
|
||||
@@ -405,6 +416,11 @@
|
||||
cursor: alias;
|
||||
}
|
||||
|
||||
#achievements .card h5 {
|
||||
color: var(--text-color) !important;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#achievements .card:hover {
|
||||
border: 2px solid var(--text-color);
|
||||
transition: .3s;
|
||||
@@ -425,13 +441,13 @@
|
||||
color: var(--text-secondary-color) !important;
|
||||
}
|
||||
|
||||
|
||||
#contact .btn {
|
||||
transition: none;
|
||||
transition: opacity 0.3s;
|
||||
border-radius: .5rem !important;
|
||||
border-color: var(--primary-color) !important;
|
||||
background-color: var(--secondary-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
#contact .btn:hover {
|
||||
|
||||
+10
-1
@@ -10,6 +10,10 @@
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#list-page .card a h5 {
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
#list-page .card:hover {
|
||||
border: 1px solid var(--secondary-color);
|
||||
transition: all 0.3s ease-out;
|
||||
@@ -23,8 +27,9 @@
|
||||
#list-page .post-footer {
|
||||
padding: .5rem 1rem;
|
||||
background-color: var(--secondary-color) !important;
|
||||
color: var(--text-secondary-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
border-top: 1px solid rgba(15, 80, 100, 0.16);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#list-page .post-footer a {
|
||||
@@ -47,6 +52,8 @@
|
||||
#list-page ul li a {
|
||||
transition: none;
|
||||
border-color: var(--secondary-color);
|
||||
background-color: var(--secondary-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
#list-page ul li a:focus {
|
||||
@@ -55,4 +62,6 @@
|
||||
|
||||
#list-page .page-item.active .page-link {
|
||||
border-color: var(--primary-color);
|
||||
background-color: var(--primary-color) !important;
|
||||
color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
@@ -6,6 +6,13 @@
|
||||
|
||||
#projects a {
|
||||
text-decoration: none;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
#projects .badge {
|
||||
background-color: var(--background-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
margin: 0 1%;
|
||||
}
|
||||
|
||||
#projects .card {
|
||||
@@ -14,6 +21,7 @@
|
||||
min-height: 400px;
|
||||
overflow: hidden;
|
||||
border-radius: 1rem;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
#projects .card:hover {
|
||||
@@ -28,6 +36,7 @@
|
||||
overflow: hidden;
|
||||
border-top-left-radius: 1rem;
|
||||
border-top-right-radius: 1rem;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
#projects .card .card-footer {
|
||||
|
||||
@@ -0,0 +1,260 @@
|
||||
#single {
|
||||
padding: 60px 0;
|
||||
line-height: 1.7em;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
#single .title > h1 {
|
||||
opacity: 0.8;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
#single .title small {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
#single .featured-image {
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#single .featured-image img {
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0px 8px 56px rgba(15, 80, 100, 0.16);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#single .page-content a {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
color: var(--primary-color) !important;
|
||||
}
|
||||
|
||||
#single .page-content a::after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 0px;
|
||||
height: 2px;
|
||||
bottom: 0.37em;
|
||||
background-color: var(--primary-color);
|
||||
transition: all 0.25s cubic-bezier(0.645,0.045,0.355,1);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#single .page-content a:hover::after, #single .page-content a:focus::after, #single .page-content a:active::after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#single .page-content h1, #single .page-content h2, #single .page-content h3, #single .page-content h4, #single .page-content h5, #single .page-content h6 {
|
||||
color: var(--primary-color) !important;
|
||||
margin-bottom: 0.7em;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single .page-content blockquote {
|
||||
padding: 20px 30px;
|
||||
border-left: 6px solid var(--primary-color) !important;
|
||||
color: var(--text-secondary-color) !important;
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
margin: 30px 0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
#single .page-content blockquote, #single .page-content blockquote * {
|
||||
background-color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
/* table */
|
||||
#single .page-content table {
|
||||
width: auto;
|
||||
border-radius: 5px;
|
||||
padding: 0.1rem;
|
||||
margin-bottom: 1.2em;
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
#single .page-content table > tr {
|
||||
height: 40px !important;
|
||||
}
|
||||
|
||||
#single .page-content table > thead > tr > th {
|
||||
padding: 0.5rem !important;
|
||||
background-color: var(--primary-color) !important;
|
||||
color: var(--secondary-color) !important;
|
||||
border: 1px solid var(--secondary-color);
|
||||
opacity: 0.9;
|
||||
}
|
||||
#single .page-content table > tbody > tr > td {
|
||||
padding: 0.5rem !important;
|
||||
border: 1px solid var(--secondary-color);
|
||||
background-color: var(--secondary-color) !important;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single .page-content table > thead > tr {
|
||||
background-color: var(--secondary-color) !important;
|
||||
color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
/* code */
|
||||
|
||||
#single .page-content pre {
|
||||
border-radius: 0.7em !important;
|
||||
margin: 5px;
|
||||
margin-bottom: 2em;
|
||||
padding: 2em;
|
||||
background-color: var(--secondary-color) !important;
|
||||
color: var(--text-secondary-color) !important;
|
||||
max-height: 450px;
|
||||
}
|
||||
|
||||
#single .page-content pre > code {
|
||||
color: var(--text-secondary-color) !important;
|
||||
}
|
||||
|
||||
#single .page-content code {
|
||||
color: var(--primary-color) !important;
|
||||
}
|
||||
|
||||
/* kbd and mark */
|
||||
|
||||
#single .page-content kbd {
|
||||
color: var(--primary-color) !important;
|
||||
background-color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
#single .page-content mark {
|
||||
color: var(--primary-color) !important;
|
||||
background-color: var(--secondary-color) !important;
|
||||
}
|
||||
|
||||
/* list */
|
||||
|
||||
#single .page-content ol, #single .page-content ul {
|
||||
margin-bottom: 1.2em;
|
||||
padding-left: 1.5em;
|
||||
list-style-position: inside;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single .page-content ol li li, #single .page-content ul li li {
|
||||
margin-bottom: 0.5em;
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
|
||||
/* sidebar */
|
||||
|
||||
#single aside {
|
||||
background-color: var(--secondary-color);
|
||||
border-radius: .7rem;
|
||||
padding: .7rem 1rem;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
#single .sticky-sidebar {
|
||||
position: sticky;
|
||||
top: 50px;
|
||||
}
|
||||
|
||||
/* Tags */
|
||||
#single aside.tags h5 {
|
||||
margin: .7em 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
|
||||
#single aside.tags ul.tags-ul li a {
|
||||
padding: 10px 15px;
|
||||
margin-bottom: 2px;
|
||||
border-radius: 8px;
|
||||
background-color: var(--background-color);
|
||||
text-decoration: none;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
#single aside.tags ul.tags-ul li {
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
|
||||
#single aside.tags ul.tags-ul li:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
/*TOC*/
|
||||
#single aside.toc {
|
||||
padding: .7rem 1rem;
|
||||
}
|
||||
|
||||
#single aside.toc h5 {
|
||||
margin: .7em 0;
|
||||
margin-bottom: 1em;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
#single aside.toc .toc-content ol, #single aside.toc .toc-content ul {
|
||||
margin-bottom: 1em;
|
||||
padding-left: .5em;
|
||||
list-style: none;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single aside.toc .toc-content ol li a, #single aside.toc .toc-content ul li a {
|
||||
font-size: 16px;
|
||||
text-decoration: none;
|
||||
color: var(--text-color);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single aside.toc .toc-content ol li a:hover, #single aside.toc .toc-content ul li a:hover {
|
||||
color: var(--primary-color);
|
||||
opacity: 1.2;
|
||||
}
|
||||
|
||||
#single aside.toc .toc-content ol li li, #single aside.toc .toc-content ul li li {
|
||||
padding-left: .7em;
|
||||
}
|
||||
|
||||
/* Social */
|
||||
|
||||
#single aside.social {
|
||||
padding: .7rem 1rem;
|
||||
}
|
||||
|
||||
#single aside.social h5 {
|
||||
margin: .7em 0;
|
||||
margin-bottom: 1em;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
#single aside.social .social-content {
|
||||
margin-bottom: 1em;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single aside.social .social-content ul {
|
||||
margin-bottom: 1em;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
#single aside.social .social-content ul li a {
|
||||
border: 1px solid var(--primary-color);
|
||||
padding: .7rem;
|
||||
color: var(--text-color);
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#single aside.social .social-content ul li {
|
||||
margin: .7rem .5rem;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
#single aside.social .social-content ul li:hover a {
|
||||
opacity: .8;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
/* light mode */
|
||||
.light, *{
|
||||
.light > *{
|
||||
background-color: var(--background-color) !important;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user