Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Disable Dark mode #97

Closed
yabloki opened this issue Feb 29, 2020 · 4 comments
Closed

Disable Dark mode #97

yabloki opened this issue Feb 29, 2020 · 4 comments

Comments

@yabloki
Copy link

yabloki commented Feb 29, 2020

Can't find a way to configure the theme to stick to a light mode, how can I do it?

@yabloki
Copy link
Author

yabloki commented Feb 29, 2020

switched back to 1.18.0 to get a light mode, not sure if it is possible to do with 2.0?

@mcarter960
Copy link

mcarter960 commented Mar 1, 2020

Hi, I have the same issue. Peter was kind enough to write back on this subject. I was able to manually edit sass/style.css and run grunt which gave me...

attila-lite.zip

I am not a developer, I just spent some time trying to figure it out with Peter's Help. At the bottom of this post, I'll include the email exchange with Peter...

Also, I have some changes in CODE INJECTION...

    .blog-header {
	    position: relative;
	    padding-top: 12rem;
    }
    .blog-description {
        color: #2F4F4F; 
    }
    .post-header {
	    position: relative;
	    padding: calc(12rem + 4vw) 0 calc(2rem + 2vw);
    }
    .post-excerpt {
       color: #2F4F4F; 
    }
    .post-title {
    	letter-spacing: 1px;    
    }
    .post-header .post-title {
	    font-size: 6em;
    }
    .post-content h3 {
		font-size: 2.5rem;
		line-height: 1.2;
        letter-spacing: 1px;
    }
    .post-content h1 {
		font-size: 3rem;
		line-height: 1.2;
        letter-spacing: 1px;
    }   
</style>

my website I just started is here: techtalk.devops10.com

Hi Mark,

it’s supposed to look different. Let me know if there’s something in particular that you think looks odd. In general, all sizes and spacings got adjusted.

Regarding your previous email. To disable dark mode you have to edit the style.scss and recompile it with grunt, the description is in the readme. In general, you have to search for this query and delete it everywhere (there are 56 total):

@media (prefers-color-scheme: dark) {
EVERYTHING IN HERE HAS TO LEAVE
}

This file also contains all stylings for font-sizes and spacings. It’s definitely not the easiest to read since it uses preprocessors and has a lot of complex nesting with media-queries.

Best,
Peter

@yabloki
Copy link
Author

yabloki commented Mar 2, 2020

thanks!

@mcarter960
Copy link

I updated the README file with more information on this subject...
https://github.com/mcarter960/Attila-Lite

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants