CSS customized for Page ref of pages with specific page property

Questions & Help
1

Hi all.

I would like to have a customized CSS for page references only for those pages with a specific page property.

E.g. page tagged “person”

Thanks

1 Like
2
  • CSS cannot read information outside of what is rendered.
  • References don’t contain any information about their target, other than its address.
  • Therefore, what you ask should be impossible to be done with CSS.
1 Like
3

Yes, you can do. Basically you have to check if the page has a page-property classed element, then check if it has “tags” data-ref and “person” data-ref, then you can modify references like so:

#main-content-container:has(
  div.block-properties.rounded.page-properties:is(
  div > div a[data-ref="tags"]),
  div > div.page-property-value.inline a[data-ref="person"]){
  & .references.page-linked {
    & .references-blocks-wrap {
        border: 1px solid blue;
        background-color: red;
    }
    & .my-2.references-blocks-item {
        background-color: yellow;
      }
  }
}

I picked you some ugly colors, have fun. If you have questions, let me know @Federico_Frosini

1 Like
4

The page-property is for the destination, not for the currently opened page (that doesn’t sound useful anyway, unless I misunderstand the OP).

5

@mentaloid @izdener Thanks both.
As @mentaloid said the page-property is for the destination not the currently opened page.
If so confirmed that cannot be done, correct?

6

@Federico_Frosini I misunderstood you. It cannot be done. You can try to search a plugin for it.

1 Like