Fix border bottom CSS var style#26
Conversation
| border: var(--api-body-document-title-border); | ||
| border-bottom: var(--api-body-document-title-border-bottom, | ||
| 1px var(--api-body-document-title-border-color, var(--api-parameters-document-title-border-color, #e5e5e5)) solid | ||
| ); |
There was a problem hiding this comment.
@benri, what's the initial idea for border styling actually? To make it possible to modify the entire border-bottom property, or being able to also modify the color of all border sides? If it's about sides, it can be done in the following way:
border: var(--api-body-document-title-border, 1px solid);
border-color: var(--api-body-document-title-border-color-full, transparent var(--api-parameters-document-title-border-color, #e5e5e5) transparent transparent);This way the default behavior is preserved while customization of border becomes more flexible:
- The border is set to
1px solidif variable is not defined and we can also modify the appearance of the border. - The border color is set to
transparentfor all border sides except bottom by default. It can be modified in any way we want. F.e., I can set--api-body-document-title-border-color-fullto#FFF #FFF, and this will paint top and bottom borders white.
Notice that I named variable as --api-body-document-title-border-color-full, because there's a variable name clash. I am not sure how it should be handled in this case but maybe other contributors know better.
There was a problem hiding this comment.
For my use case, I am only styling the border-bottom (actually, hiding it by setting border-bottom: 0) so I may not need to color the other border sides
There was a problem hiding this comment.
@deiteris @benri I am working on a consolidation of all documentation components under a single repository. You can see the new code base here: https://github.com/advanced-rest-client/api-documentation/tree/release/7.0.0
It is not yet ready as I am still merging test cases from the old components. This will be a breaking change anyway so it will be easier to make major styling changes out there. I'll be happy to hear your feedback.
There was a problem hiding this comment.
@jarrodek since you're moving some stuff from api-type-document there as well, please also take a look at the issues and PRs here:
https://github.com/advanced-rest-client/api-type-document/issues
Fixes
borderproperty overriding the style ofborder-bottomwhen the CSS variable is undefinedFixes issue introduced by this commit ded3611#diff-eccc2b8fef024888c50f0586687e68415115c3cc38bd9fda26ba1d4cbd0ce0dcR20