diff --git a/assets/css/style-gemini.css b/assets/css/style_gemini.css similarity index 54% rename from assets/css/style-gemini.css rename to assets/css/style_gemini.css index f5218f0..bab6e6c 100644 --- a/assets/css/style-gemini.css +++ b/assets/css/style_gemini.css @@ -3,7 +3,9 @@ {{- with $P.sidebar -}} {{- $width := (int (math.Max .width 240)) -}} -{{- $pad := (add $width .offset) }} +{{- $offset := (int (math.Max .offset 12)) -}} +{{- $padding := (int (math.Max .padding 18)) -}} +{{- $positPad := (add $width $offset) }} .main { {{ if eq .position "right" }} flex-direction: row-reverse; @@ -13,18 +15,17 @@ width: {{ $width }}px; } .main-inner { - width: calc(100% - {{ $pad }}px); + width: calc(100% - {{ $positPad }}px); } .sidebar { width: {{ $width }}px; visibility: inherit; } .sidebar-inner { - padding: {{ .padding }}px 10px; + padding: {{ $padding }}px 10px; } .footer-inner { - padding-{{ .position }}: {{ $pad }}px; - width: calc(100% - 20px); + padding-{{ .position }}: {{ $positPad }}px; } {{- end }} @@ -37,6 +38,10 @@ {{- end }} } +.site-author-image:hover { + transform: rotateZ(360deg); +} + .site-state-item { border-left: 1px solid #eee; } @@ -57,32 +62,6 @@ border-bottom: none; } -@keyframes wobble-vertical { - 16.65% { - transform: translateX(8px); - } - - 33.3% { - transform: translateX(-6px); - } - - 49.95% { - transform: translateX(4px); - } - - 66.6% { - transform: translateX(-2px); - } - - 83.25% { - transform: translateX(1px); - } - - 100% { - transform: translateX(0); - } -} - .rss-link a:hover { animation-name: wobble-vertical; animation-duration: 2s; @@ -95,6 +74,44 @@ transform: scaleY(-1); } +.links-of-social a { + font-size: 0.8125em; +} +.links-of-social .fa, +.links-of-social .fab, +.links-of-social .far, +.links-of-social .fas { + margin-right: 2px; +} +.links-of-social { + display: flex; + flex-wrap: wrap; + justify-content: center; +} +.links-of-social-item { + margin: 5px 0 0; +{{- if and $P.socialIcons.enable (not $P.socialIcons.iconsOnly) }} + width: 50%; +{{- end }} +} +.links-of-social-item a { + box-sizing: border-box; + display: inline-block; + max-width: 100%; + overflow: hidden; + padding: 0 5px; + text-overflow: ellipsis; + white-space: nowrap; +} +.links-of-social-item a { + border-bottom: 0; + border-radius: 4px; + display: block; +} +.links-of-social-item a:hover { + background: var(--body-bg-color); +} + .cc-license { {{ if eq $P.creativeCommons.size "big" }} margin-top: 10px; diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml index ff9e740..71e2254 100644 --- a/exampleSite/config.yaml +++ b/exampleSite/config.yaml @@ -89,10 +89,10 @@ params: # - remove totally remove sidebar including sidebar toggle. display: post - # Sidebar padding in pixels. - padding: 30 - # Sidebar offset from top menubar in pixels (only for Pisces | Gemini). - offset: 18 + # Sidebar padding in pixels, default 18. + padding: 18 + # Sidebar offset from top menubar in pixels (only for Pisces | Gemini), default 12. + offset: 12 # Sidebar Avatar avatar: @@ -122,6 +122,10 @@ params: # {"Instagram": "https://instagram.com/yourname || fab fa-instagram"}, # {"Skype": "skype:yourname?call|chat || fab fa-skype"} ] + socialIcons: + enable: true + iconsOnly: false + transition: true # Creative Commons 4.0 International License. # See: https://creativecommons.org/about/cclicenses/ diff --git a/layouts/partials/head/css.html b/layouts/partials/head/css.html index ae88c18..13b7258 100644 --- a/layouts/partials/head/css.html +++ b/layouts/partials/head/css.html @@ -1,6 +1,7 @@ - -{{- $style := resources.Get "css/style-gemini.css" | resources.ExecuteAsTemplate "css/style-gemini.css" . }} - \ No newline at end of file + +{{- $style := resources.Get "css/style_gemini.css" | resources.ExecuteAsTemplate "css/style_gemini.css" . }} + + \ No newline at end of file diff --git a/layouts/partials/header/sidebar.html b/layouts/partials/header/sidebar.html index 1d3453c..270e728 100644 --- a/layouts/partials/header/sidebar.html +++ b/layouts/partials/header/sidebar.html @@ -40,14 +40,22 @@ -
+
+ {{ $si := $SP.socialIcons }} {{- range $SP.socials }} {{- range $name,$val := . }} {{- $vals := split $val "||" }} {{- $url := trim (index $vals 0) " " }} {{- $icon := trim (index $vals 1) " " }} - - {{- $name }} + + + {{- if $si.enable }} + + {{- end }} + {{- if or (not $si.enable) (not $si.iconsOnly) }} + {{- $name }} + {{- end }} + {{- end }} {{- end }} diff --git a/static/css/a_hover.css b/static/css/a_hover.css new file mode 100644 index 0000000..c096618 --- /dev/null +++ b/static/css/a_hover.css @@ -0,0 +1,71 @@ + +@keyframes wobble-vertical { + 16.65% { + transform: translateX(8px); + } + + 33.3% { + transform: translateX(-6px); + } + + 49.95% { + transform: translateX(4px); + } + + 66.6% { + transform: translateX(-2px); + } + + 83.25% { + transform: translateX(1px); + } + + 100% { + transform: translateX(0); + } +} + +/* Icon Pulse */ +@-webkit-keyframes hvr-icon-pulse { + 25% { + -webkit-transform: scale(1.3); + transform: scale(1.3); + } + 75% { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } +} +@keyframes hvr-icon-pulse { + 25% { + -webkit-transform: scale(1.3); + transform: scale(1.3); + } + 75% { + -webkit-transform: scale(0.8); + transform: scale(0.8); + } +} +.hvr-icon-pulse { + display: inline-block; + vertical-align: middle; + -webkit-transform: perspective(1px) translateZ(0); + transform: perspective(1px) translateZ(0); + box-shadow: 0 0 1px rgba(0, 0, 0, 0); +} +.hvr-icon-pulse .hvr-icon { + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.hvr-icon-pulse:hover .hvr-icon, .hvr-icon-pulse:focus .hvr-icon, .hvr-icon-pulse:active .hvr-icon { + -webkit-animation-name: hvr-icon-pulse; + animation-name: hvr-icon-pulse; + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} \ No newline at end of file diff --git a/static/css/main-gemini.css b/static/css/main_gemini.css similarity index 99% rename from static/css/main-gemini.css rename to static/css/main_gemini.css index 70b7fd1..9af029a 100644 --- a/static/css/main-gemini.css +++ b/static/css/main_gemini.css @@ -2661,9 +2661,6 @@ ul.breadcrumb li:last-child { width: 100%; } } -/* .footer-inner { - padding-left: 300px; -} */ @media (max-width: 991px) { .footer-inner { padding-left: 0;