Giter Club home page Giter Club logo

hugo-juicebar's Introduction

HotJuice

Hi there! 👋 I'm HotJuice

  • Bachelor's Degree in Accounting and Computer Science
  • Interested in a lot of things
  • Love Open Source & knowledge sharing

Sometimes I write articles on my blog.

🔬 Tech & Tools Preference

Backend:

Go Python C cpp Java MySQL Redis Mongodb

Frontend

TypeScript JavaScript HTML5 CSS3 Sass React Vue

Operating System

Linux Windows

Tools

VS Code Docker Hugo git

📫 How to reach me:

hugo-juicebar's People

Contributors

hotjuicew avatar teeramaet avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

hugo-juicebar's Issues

highlight markdown hyperlinks

Hi there,

I am using your theme and I love it, yet it seems that all the hyperlink in markdown [foo](https://bar.baz) are not colored by default.
It is complicated for certain category of users to identify what hyperlink they can click on.

Do you have an idea how I could modify this site style in order to make the site more readable?

配置项图片路径问题

配置项中有头像配置:imageUrl = "/images/profile.jpg"
测试:主站点imgses目录、更换其他路径均不能正常显示
不知道是不是要在特定目录下还是图片配置就是有bug

How do I add a background image??

I've tried going into the index.html file and adding

<style>
body {
  background-image: url('img.png');
}
</style>

I've tried following https://discourse.gohugo.io/t/background-image-how-to/38539/8?u=4e5rhwrt (@jmooring) but it didn't work for my theme. I can't figure this out. Have spent 4hrs on it so far. Please help.

On my site's forums, the CSS is:

html {
  body {
    background: linear-gradient(
        0deg,
        rgba(var(--primary-rgb), 0.075) 0%,
        rgba(var(--primary-rgb), 0.075) 100%
      ),
      linear-gradient(0deg, var(--secondary) 100%, var(--secondary) 100%);
  }
  .background-container {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    background: linear-gradient(
      90deg,
      var(--tertiary-hover) 0%,
      var(--tertiary) 100%
    );
    clip-path: ellipse(148% 70% at 91% -14%);
  }
}

and the header.html is: <div class="background-container"></div> but that won't work either when I add to CSS files in the theme. The above CSS & HTML on my forums gives a nice:
https://i.imgur.com/gOJ5NND.png

enable toc

While browsing your example site I noticed that your post have all a right hand side table of content displayed.
I checked the raw markdown of your example site but did not find anything related to the toc.
in the layout/partial/toc.html I could find the code which displays the toc yet I do not understand why on my side this is not active.

The `config.toml does not specify anything in relation with the table of content either. Anything I am missing?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.