Thanks, that pointed me in the right direction. I added/changed this in
variables.less

@wiki-header-bg:    rgba(0, 134, 47, 0.9);
@wiki-nav-bg:    rgba(126, 184, 67, 0.9);

and in Template.Nav.less the following, because I needed the navigation box
to have a specific color, instead of being derived from the @wiki-header-bg:

.header > .navigation {
    background-color:@wiki-nav-bg;

I'm still not entirely clear about LESS, but it's sufficiently close to CSS
to make simple changes comfortably.

Ulf

On Sat, Sep 30, 2023 at 10:15 PM Juan Pablo Santos Rodríguez <
juanpablo.san...@gmail.com> wrote:

> Hi,
>
> if you don't feel comfortable mangling with the less files, as another
> approach, you can define a template (a folder inside
> ./jspwiki-war/src/main/webapp/templates) with only a localheader.jsp
> (see [#1]) file and set there your CSS. If a file is missing from a
> template, JSPWiki will read if from the default template, so this is a
> nice way to add wiki-wide customizations.
>
> You could also play with the Add CSS style directive, and get custom
> css styles, globally (by placing it on the LeftMenu page), for a given
> user, etc. [#2] woud be a good starting place for looking into this
> approach.
>
>
> HTH,
> juan pablo
>
>
> [#1]
> https://github.com/apache/jspwiki/blob/master/jspwiki-war/src/main/webapp/templates/default/localheader.jsp#L31-L34
> [#2
> <https://github.com/apache/jspwiki/blob/master/jspwiki-war/src/main/webapp/templates/default/localheader.jsp#L31-L34[%232>]
> https://jspwiki-wiki.apache.org/Wiki.jsp?page=Add%20CSS%20Style
>
> On Sat, Sep 30, 2023 at 9:08 PM Arturo Bernal <aber...@apache.org> wrote:
> >
> > Hi Ulf,
> >
> > Thank you for reaching out. The elegant way to change the colors of the
> > header and footer in JSPWiki is to modify the variables.less file and
> then
> > recompile the LESS into CSS. This ensures that your changes are
> integrated
> > into the base template and are consistent across the site.
> >
> > However, if you're not familiar with LESS or if you're looking for a
> > quicker workaround, you can directly override the CSS styles. Here's an
> > example to change the header background to a pinkish-red color:
> >
> > css
> >
> > .header {
> >   background: hsla(333, 76%, 46%, 0.9) !important;
> > }
> >
> > The !important flag ensures that this rule will take precedence over any
> > existing styles.
> >
> > Please note that using !important is generally considered a workaround
> and
> > it's best to use it sparingly. For a long-term solution, I would
> recommend
> > getting comfortable with LESS and modifying the variables.less file.
> >
> > Hope this helps!
> >
> >
> > Arturo
> >
> >
> > On Fri, Sep 29, 2023 at 3:38 PM Ulf Dittmer
> > <ulf.ditt...@googlemail.com.invalid> wrote:
> >
> > > Hi-
> > >
> > > For a site I'm implementing with JSPWiki I need to change the two blue
> > > tones of the header and footer to other colors. How would I go about
> that?
> > > I've gone through various CSS-related pages of the documentation, but
> they
> > > all seem to deal with changing styles within a page, not in the base
> > > template. I suspect the answer has something to do with the color
> > > definitions in the variables.less file, but although I'm somewhat
> > > proficient with CSS, LESS is a mystery to me.
> > >
> > > Can someone point me in the right direction?
> > >
> > > Thanks, Ulf
> > >
>

Reply via email to