User:DoggoBit/Sandbox/Infobox/Layout: Difference between revisions

DoggoBit (talk | contribs)
No edit summary
DoggoBit (talk | contribs)
No edit summary
 
(3 intermediate revisions by the same user not shown)
Line 13: Line 13:


   --infobox-content-size: 90%;
   --infobox-content-size: 90%;
  --infobox-content-padding: {{#if: {{{clip|}}} | calc(var(--infobox-border-radius) / 2) var(--infobox-border-radius) | var(--infobox-border-radius)}};
  --infobox-content-title-color: var(--infobox-title-color);


   --infobox-separator-size: {{#if: {{{clip|}}} | 10px | 0}};
   --infobox-separator-size: {{#if: {{{clip|}}} | 10px | 0}};
   --infobox-separator-clip: {{#if: {{{clip|}}} | polygon(0 0, 100% 100%, 0 100%) | none}};
   --infobox-separator-clip: {{#if: {{{clip|}}} | polygon(0 0, 100% 100%, 0 100%) | none}};
  --infobox-footer-padding: {{#if: {{{clip|}}} | calc(var(--infobox-border-radius) / 4) var(--infobox-border-radius) | calc(var(--infobox-border-radius) / 2) var(--infobox-border-radius)}};
    
    
   border: solid 3px var(--infobox-color);
   border: solid 3px var(--infobox-color);
Line 22: Line 26:
">
">
<div class="nix-wiki infobox-header" style="
<div class="nix-wiki infobox-header" style="
   padding: var(--infobox-border-radius);
   padding: var(--infobox-content-padding);
">
">
<p class="nix-wiki infobox-title" style="
<p class="nix-wiki infobox-title" style="
Line 37: Line 41:
   width: 100%;
   width: 100%;
   background-color: var(--infobox-background);
   background-color: var(--infobox-background);
   clip-path: var(--infobox-clip);
   clip-path: var(--infobox-separator-clip);
"></div>
"></div>
<div class="nix-wiki infobox-content" style="
<div class="nix-wiki infobox-content" style="
   padding: var(--infobox-border-radius);
   padding: var(--infobox-content-padding);
   background-color: var(--infobox-background);
   background-color: var(--infobox-background);
   text-align: left;
   text-align: left;
Line 53: Line 57:
   width: 100%;
   width: 100%;
   background-color: var(--infobox-color);
   background-color: var(--infobox-color);
   clip-path: var(--infobox-clip);
   clip-path: var(--infobox-separator-clip);
">
">
</div>
</div>
</div>
</div>
<div class="nix-wiki infobox-footer" style="
<div class="nix-wiki infobox-footer" style="
   padding: 0.5rem var(--infobox-border-radius);
   padding: var(--infobox-footer-padding);
   background-color: var(--infobox-color);
   background-color: var(--infobox-color);
   color: white;
   color: white;