offset an html anchor, anchor copy icon changed, footer links flex
This commit is contained in:
		
							parent
							
								
									148bace4b3
								
							
						
					
					
						commit
						5acd0525b6
					
				|  | @ -1,6 +1,10 @@ | |||
| English |  | ||||
| [한국어](https://github.com/zzossig/hugo-theme-zzo/blob/master/README.ko.md) | ||||
| 
 | ||||
| ## Hugo Theme Zzo | ||||
| 
 | ||||
| Zzo is a blog theme for Hugo. It includes almost all features that a blog theme should have. Search, Gallery, so on. It looks simple but once you deep dive into it, you can find out lots of functionalities. | ||||
| 
 | ||||
| ## 📄 Documentation | ||||
| 
 | ||||
| [https://zzo-docs.vercel.app/zzo](https://zzo-docs.vercel.app/zzo) | ||||
|  | @ -28,8 +32,11 @@ Your support will be of great help in maintaining the project. | |||
| * Publication Page | ||||
| * Resume Page | ||||
| * Presentation Page | ||||
| * Showcase Page | ||||
| 
 | ||||
| ## Minimum Hugo version | ||||
| 
 | ||||
| Hugo version 0.65.0 or higher is required. | ||||
| 
 | ||||
| ## Screenshot | ||||
| 
 | ||||
|  | ||||
|  | @ -27,6 +27,10 @@ | |||
|   @include justify-content(center); | ||||
| } | ||||
| 
 | ||||
| .flexwrap { | ||||
|   @include flex-wrap(wrap); | ||||
| } | ||||
| 
 | ||||
| .basicflex-column { | ||||
|   @include flexbox(); | ||||
|   @include align-items(center); | ||||
|  |  | |||
|  | @ -249,19 +249,12 @@ | |||
|       @include clippy(); | ||||
|       @include transition(all, 0.2s, ease); | ||||
|     } | ||||
|     .copy-to-clipboard:hover { | ||||
|       @include translateY(-0.1rem); | ||||
|     } | ||||
|     .chroma .copy-to-clipboard { | ||||
|       position: absolute; | ||||
|       right: 4px; | ||||
|       top: 5px;       | ||||
|       border-radius: 2px; | ||||
|       z-index: z('clipboard'); | ||||
|       @include transition(all, 0.2s, ease); | ||||
|     } | ||||
|     .chroma .copy-to-clipboard:hover { | ||||
|       @include translateY(-0.1rem); | ||||
|     } | ||||
|     .language-code .copy-to-clipboard { | ||||
|       position: absolute; | ||||
|  | @ -269,10 +262,6 @@ | |||
|       top: 5px;       | ||||
|       border-radius: 2px; | ||||
|       z-index: z('clipboard'); | ||||
|       @include transition(all, 0.2s, ease); | ||||
|     } | ||||
|     .language-code .copy-to-clipboard:hover { | ||||
|       @include translateY(-0.1rem); | ||||
|     } | ||||
|     .highlight > .copy-to-clipboard { | ||||
|       position: absolute; | ||||
|  | @ -280,10 +269,6 @@ | |||
|       top: 5px;       | ||||
|       border-radius: 2px; | ||||
|       z-index: z('clipboard'); | ||||
|       @include transition(all, 0.2s, ease); | ||||
|     } | ||||
|     .highlight > .copy-to-clipboard:hover { | ||||
|       @include translateY(-0.1rem); | ||||
|     } | ||||
| 
 | ||||
|     blockquote { | ||||
|  |  | |||
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							|  | @ -3,11 +3,13 @@ | |||
| <script> | ||||
|   document.addEventListener('DOMContentLoaded', function () { | ||||
|     function checkTheme(local, base) { | ||||
|       if (local === "dark" || base === "dark") { | ||||
|       var currentTheme = local || base; | ||||
| 
 | ||||
|       if (currentTheme === "dark") { | ||||
|         return "photon-dark"; | ||||
|       } else if (local === "hacker" || base === "hacker") { | ||||
|       } else if (currentTheme === "hacker") { | ||||
|         return "photon-dark"; | ||||
|       } else if (local === "kimbie" || base === "kimbie") { | ||||
|       } else if (currentTheme === "kimbie") { | ||||
|         return "github-dark-orange"; | ||||
|       } else { | ||||
|         return "github-light"; | ||||
|  | @ -30,7 +32,6 @@ | |||
|       myScript.setAttribute('theme', utterTheme); | ||||
|       myScript.setAttribute('crossorigin', 'anonymous'); | ||||
|       myScript.setAttribute('async', ''); | ||||
| 
 | ||||
|       myScript.onload = function() { | ||||
|       } | ||||
| 
 | ||||
|  |  | |||
|  | @ -4,9 +4,11 @@ | |||
|     {{ partial "footer/go-to-top" . }} | ||||
|     <hr /> | ||||
| 
 | ||||
|     <div class="basicflex"> | ||||
|     <div class="basicflex flexwrap"> | ||||
|         {{ range $.Param "footerLinks" }} | ||||
|             <a href="{{ .link }}" class="footer__link" target="_blank" rel="noreferrer">{{ .name }}</a> | ||||
|             {{ if .link }} | ||||
|                 <a href="{{ .link }}" class="footer__link" target="_blank" rel="noreferrer">{{ .name }}</a> | ||||
|             {{ end }} | ||||
|         {{ end }} | ||||
|     </div> | ||||
| 
 | ||||
|  |  | |||
|  | @ -292,11 +292,13 @@ | |||
|         if (st < 45) { | ||||
|           return null; | ||||
|         } | ||||
|          | ||||
|         if (!navbar.classList.contains('navbar--hide')) { | ||||
|           navbar.classList.add('navbar--hide'); | ||||
|         } else if (navbar.classList.contains('navbar--show')) { | ||||
|           navbar.classList.remove('navbar--show'); | ||||
| 
 | ||||
|         if (navbar.classList.contains('scrolling')) { | ||||
|           if (!navbar.classList.contains('navbar--hide')) { | ||||
|             navbar.classList.add('navbar--hide'); | ||||
|           } else if (navbar.classList.contains('navbar--show')) { | ||||
|             navbar.classList.remove('navbar--show'); | ||||
|           } | ||||
|         } | ||||
| 
 | ||||
|         if (singleContentsElem) { | ||||
|  | @ -363,10 +365,12 @@ | |||
|           gttBtn.style.display = "none"; | ||||
|         } | ||||
| 
 | ||||
|         if (navbar.classList.contains('navbar--hide')) { | ||||
|           navbar.classList.remove('navbar--hide'); | ||||
|         } else if (!navbar.classList.contains('navbar--show')) { | ||||
|           navbar.classList.add('navbar--show'); | ||||
|         if (navbar.classList.contains('scrolling')) { | ||||
|           if (navbar.classList.contains('navbar--hide')) { | ||||
|             navbar.classList.remove('navbar--hide'); | ||||
|           } else if (!navbar.classList.contains('navbar--show')) { | ||||
|             navbar.classList.add('navbar--show'); | ||||
|           } | ||||
|         } | ||||
| 
 | ||||
|         if (singleContentsElem) { | ||||
|  |  | |||
|  | @ -1,4 +1,4 @@ | |||
| <nav class="navbar" role="navigation" aria-label="main navigation" data-dir="{{ if $.Param "navbardir" }}{{ $.Param "navbardir" }}{{ else }}{{ $.Param "languagedir" | default "ltr" }}{{ end }}"> | ||||
| <nav class="navbar scrolling" role="navigation" aria-label="main navigation" data-dir="{{ if $.Param "navbardir" }}{{ $.Param "navbardir" }}{{ else }}{{ $.Param "languagedir" | default "ltr" }}{{ end }}"> | ||||
|   <div class="navbar__brand"> | ||||
|     {{ if $.Param "logo" | default true }} | ||||
|     <a href="{{ "/" | relLangURL }}" title="{{ i18n "tooltip-home" }}" rel="home" class="{{ if eq ($.Param "logoType") "long" }}navbar__long-link{{ else }}navbar__logo-link{{ end }}"> | ||||
|  |  | |||
|  | @ -107,6 +107,18 @@ | |||
|     if ((enableToc || toc) && document.querySelector('.toc')) { | ||||
|       var tableOfContentsElem = document.querySelector('.toc').querySelector('#TableOfContents'); | ||||
| 
 | ||||
|       tableOfContentsElem.onmouseenter = function() { | ||||
|         if (navbar.classList.contains('scrolling')) { | ||||
|           navbar.classList.remove('scrolling'); | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       tableOfContentsElem.onmouseleave = function() { | ||||
|         if (!navbar.classList.contains('scrolling')) { | ||||
|           navbar.classList.add('scrolling'); | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       if (false === tocFolding) { | ||||
| 
 | ||||
|       } else { | ||||
|  | @ -125,10 +137,13 @@ | |||
|           tableOfContentsElem.querySelectorAll('a').forEach(function (elem) { | ||||
|             elem.addEventListener('click', function () { | ||||
|               var id = elem.getAttribute('id'); | ||||
|               navbar.classList.remove('navbar--show'); | ||||
|               navbar.classList.remove('navbar--hide'); | ||||
|               navbar.classList.add('navbar--hide'); | ||||
| 
 | ||||
|               if (!navbar.classList.contains('scrolling')) { | ||||
|                 navbar.classList.remove('navbar--show'); | ||||
|                 navbar.classList.remove('navbar--hide'); | ||||
|                 navbar.classList.add('navbar--hide'); | ||||
|               } | ||||
|                | ||||
|               document.querySelector('.toc').querySelectorAll('a').forEach(function (elem) { | ||||
|                 elem.classList.remove('active'); | ||||
|               }); | ||||
|  | @ -223,6 +238,62 @@ | |||
|     // ================================================================= | ||||
| 
 | ||||
| 
 | ||||
|     // ========================== foot notes =========================== | ||||
|     var footNoteRefs = document.querySelectorAll('.footnote-ref'); | ||||
|     var footNoteBackRefs = document.querySelectorAll('.footnote-backref'); | ||||
| 
 | ||||
|     footNoteRefs ?  | ||||
|     footNoteRefs.forEach(function(elem, idx) { | ||||
|       elem.onmouseenter = function () { | ||||
|         if (navbar.classList.contains('scrolling')) { | ||||
|           navbar.classList.remove('scrolling'); | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       elem.onmouseleave = function () { | ||||
|         if (!navbar.classList.contains('scrolling')) { | ||||
|           setTimeout(function () { | ||||
|             navbar.classList.add('scrolling'); | ||||
|           }, 100); | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       elem.onclick = function () { | ||||
|         if (!navbar.classList.contains('scrolling')) { | ||||
|           navbar.classList.remove('navbar--show'); | ||||
|           navbar.classList.remove('navbar--hide'); | ||||
|           navbar.classList.add('navbar--hide'); | ||||
|         } | ||||
|       } | ||||
|     }) : null; | ||||
| 
 | ||||
|     footNoteBackRefs ?  | ||||
|     footNoteBackRefs.forEach(function(elem, idx) { | ||||
|       elem.onmouseenter = function () { | ||||
|         if (navbar.classList.contains('scrolling')) { | ||||
|           navbar.classList.remove('scrolling'); | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       elem.onmouseleave = function () { | ||||
|         if (!navbar.classList.contains('scrolling')) { | ||||
|           setTimeout(function() { | ||||
|             navbar.classList.add('scrolling'); | ||||
|           }, 100); | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       elem.onclick = function () { | ||||
|         if (!navbar.classList.contains('scrolling')) { | ||||
|           navbar.classList.remove('navbar--show'); | ||||
|           navbar.classList.remove('navbar--hide'); | ||||
|           navbar.classList.add('navbar--hide'); | ||||
|         } | ||||
|       } | ||||
|     }) : null; | ||||
|     // ================================================================= | ||||
| 
 | ||||
| 
 | ||||
|     // ======================== markdown table ========================= | ||||
|     var tables = document.querySelectorAll('.single__contents > table'); | ||||
|     for (let i = 0; i < tables.length; i++) { | ||||
|  | @ -244,6 +315,7 @@ | |||
| 
 | ||||
|     headers ?  | ||||
|     headers.forEach(function (elem) { | ||||
|       var size = parseInt(elem.tagName.substr(1), 10) * 2; | ||||
|       var url = encodeURI(document.location.origin + document.location.pathname); | ||||
|       var link = url + "#" + elem.getAttribute('id'); | ||||
|       var newElemOuter = document.createElement('span'); | ||||
|  | @ -253,11 +325,12 @@ | |||
|       newElemOuter.style.position = 'relative'; | ||||
| 
 | ||||
|       var newElemInner = document.createElement('span'); | ||||
|       newElemInner.style.fontSize = '1rem'; | ||||
|       newElemInner.style.position = 'absolute'; | ||||
|       newElemInner.style.top = '50%'; | ||||
|       newElemInner.style.left = '0.75rem'; | ||||
|       newElemInner.style.transform = 'translateY(-50%)'; | ||||
|       newElemInner.innerText = "🔗"; | ||||
|       newElemInner.innerHTML = ` | ||||
| <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="${32 - size}px" height="${32 - size}px"><path d="M 5.5625 0 C 4.136719 0 2.707031 0.542969 1.625 1.625 C -0.539063 3.789063 -0.539063 7.335938 1.625 9.5 L 5.28125 13.15625 C 5.667969 13.554688 6.304688 13.558594 6.703125 13.171875 C 7.101563 12.785156 7.105469 12.148438 6.71875 11.75 L 3.03125 8.0625 C 1.632813 6.664063 1.632813 4.429688 3.03125 3.03125 C 4.429688 1.632813 6.664063 1.632813 8.0625 3.03125 L 12.96875 7.9375 C 14.367188 9.335938 14.367188 11.570313 12.96875 12.96875 C 12.804688 13.132813 12.621094 13.25 12.4375 13.375 C 11.980469 13.6875 11.859375 14.308594 12.171875 14.765625 C 12.484375 15.222656 13.105469 15.34375 13.5625 15.03125 C 13.847656 14.835938 14.125 14.625 14.375 14.375 C 16.539063 12.210938 16.539063 8.664063 14.375 6.5 L 9.5 1.625 C 8.417969 0.542969 6.988281 0 5.5625 0 Z M 10.78125 8.875 C 10.738281 8.882813 10.695313 8.894531 10.65625 8.90625 C 10.507813 8.9375 10.371094 9 10.25 9.09375 C 10.039063 9.253906 9.820313 9.429688 9.625 9.625 C 7.460938 11.789063 7.460938 15.335938 9.625 17.5 L 14.5 22.375 C 16.664063 24.539063 20.210938 24.539063 22.375 22.375 C 24.539063 20.210938 24.539063 16.664063 22.375 14.5 L 18.71875 10.875 C 18.476563 10.578125 18.089844 10.441406 17.714844 10.527344 C 17.34375 10.613281 17.050781 10.90625 16.964844 11.277344 C 16.878906 11.652344 17.015625 12.039063 17.3125 12.28125 L 20.96875 15.9375 C 22.367188 17.335938 22.367188 19.570313 20.96875 20.96875 C 19.570313 22.367188 17.335938 22.367188 15.9375 20.96875 L 11.03125 16.0625 C 9.632813 14.664063 9.632813 12.429688 11.03125 11.03125 C 11.152344 10.90625 11.300781 10.820313 11.4375 10.71875 C 11.839844 10.472656 12.015625 9.976563 11.855469 9.53125 C 11.699219 9.085938 11.25 8.8125 10.78125 8.875 Z"/></svg>`; | ||||
| 
 | ||||
|       if (languagedir === "rtl") { | ||||
|         newElemInner.style.left = '-2rem'; | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue
	
	 zzossig
						zzossig