Skip to content
Grav 2.0 is officially stable. Read the announcement →

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Themes & Styling

Agency Theme - change menu font color

Solved by pamtbaau View solution

Started by SportStau 4 years ago · 12 replies · 975 views
4 years ago

Hi community,
I've inherited a job and I'm supposed to keep an eye on a website.
But I'm not a web designer.

It seems to be customized Agency Theme.
The Background Banner on the Top ist white and the menu font color is also white.

How do i change the Menu font color?

There is no custom.css in the template or in the file structure.

4 years ago

The answer is still CSS

Is it an inheriting custom child theme? If so, you could probably change the main theme CSS. Or you could even add custom CSS load to base template.

4 years ago

@Karmalakas:
inheriting custom child theme

It is a custom theme from Agency with its own file structure.

Wich css file do i have to modify?
One of these: ?
scss\agency.scss
css-compiled\agency.css
css-compiled\global.css

4 years ago

I suspect it's scss\agency.scss, but then you have to compile it to css-compiled\agency.css

👍 1
4 years ago

Can you share the link to the site?

👍 1
4 years ago

@SportStau,

It is a custom theme from Agency with its own file structure.

Not sure what your interpretation of "custom theme" is.

  • Do you mean Agency is inherited as @Karmalakas asked?
  • If so, does it contain file /user/themes/yourtheme/templates/base.html.twig?

Anyway... The original theme Agency has the following line in /user/themes/agency/templates/base.html.twig: See line 14

TWIG
{% do assets.addCss('theme://css/custom.css',100) %}

If the "custom theme" did not override base.html.twig from theme Agency, or it still has that line in its template, you can add your css in file /user/themes/yourtheme/css/custom.css.

👍 1
last edited 01/02/22 by pamtbaau
4 years ago

https://www.efbornheim.de/

in the file /user/themes/efbornheim/templates/partials/base.html.twig

{% block stylesheets %}
{% do assets.addCss('theme://css-compiled/global.css',100) %}
{% do assets.addCss('theme://css/custom.css',100) %}

4 years ago Solution

@SportStau, In that case, you can create file /user/themes/efbornheim/css/custom.css and add your css in that file.

👍 1
4 years ago

Try adding

CSS
.navbar-default .nav li a {
    color: #000;
}
👍 1
4 years ago

@SportStau,

Does the CSS file have to be compiled?

No, css is what is understood by the browser. Only scss, sass and less files need to be compiled into css.

I’ve inherited a job and I’m supposed to keep an eye on a website.
But I’m not a web designer.

You might consider asking to also get the training required for the job... ;-)

👍 1
4 years ago

You are right!
The problem was CSS Pipeline was switched off.
Now the custom.css file is loading.

Thank you all. Thank you for your patience. Thanks for all explanations.

4 years ago

@SportStau, The pipeline was not the issue, because earlier this morning, I saw custom.css and its css being loaded in my browser.

Maybe your browser hasn't refreshed back then?

When working on html, css or js, it's a good practice to open the DevTools window and disable cache when DevTools is open. In Chrome it has a permanent setting for this: Disable cache (while DevTools is open).
I assume other browsers offer a similar setting.

Also the cache of Grav might sometimes lead to head scratching. It can be switched of in system.yaml.

Suggested topics

Topic Participants Replies Views Activity
Themes & Styling · by Pedro M, 2 months ago
4 198 2 months ago
Themes & Styling · by Ian, 2 months ago
3 94 2 months ago
Themes & Styling · by Norbert, 2 years ago
11 456 3 months ago
Themes & Styling · by Lukáš Findeis, 3 months ago
0 48 3 months ago
Themes & Styling · by Sebadamus, 4 months ago
5 128 3 months ago