Unverified Commit d77db06b authored by eisfunke's avatar eisfunke
Browse files

Auto view of color codes for palette page.

parent acbde166

src/palette.xhtml

+12 −9
Original line number Diff line number Diff line
@@ -16,15 +16,15 @@ 
        <br/>



        <p>Background</p>

        <div class="colorbox bg-background-super-dark">Background super dark <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-very-dark">Background very dark <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-dark">Background dark <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-dim">Background dim <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-medium">Background medium <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-light">Background light <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-bright">Background bright <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-very-bright">Background very bright <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-super-bright">Background super bright <a href="index.xhtml">Link</a></div>

        <div class="colorbox bg-background-super-dark">Background super dark</div>

        <div class="colorbox bg-background-very-dark">Background very dark</div>

        <div class="colorbox bg-background-dark">Background dark</div>

        <div class="colorbox bg-background-dim">Background dim</div>

        <div class="colorbox bg-background-medium">Background medium</div>

        <div class="colorbox bg-background-light">Background light</div>

        <div class="colorbox bg-background-bright">Background bright</div>

        <div class="colorbox bg-background-very-bright">Background very bright</div>

        <div class="colorbox bg-background-super-bright">Background super bright</div>

        <br/>



        <p>Primary</p>
@@ -49,6 +49,9 @@ 
        <div class="colorbox bg-secondary-medium">Secondary medium</div>

        <div class="colorbox bg-secondary-light">Secondary light</div>

        <div class="colorbox bg-secondary-bright">Secondary bright</div>

        <div class="colorbox bg-secondary-very-bright">Secondary very bright</div>

        <div class="colorbox bg-secondary-super-bright">Secondary super bright</div>

        <div class="colorbox bg-secondary-extreme-bright">Secondary extreme bright</div>

        <br/>



        <p>Check</p>

src/style/_colors.sass

+3 −0
Original line number Diff line number Diff line
@@ -19,6 +19,9 @@ 
    @for $i from -5 through 5

        .bg-#{$color-name}-#{map-get($shade-names, $i)}

            background-color: get-color($color-name, $i)

        .colorbox.bg-#{$color-name}-#{map-get($shade-names, $i)}::after

            font-weight: normal

            content: " (#{get-color($color-name, $i)})"

        .fg-#{$color-name}-#{map-get($shade-names, $i)}

            color: get-color($color-name, $i)

src/style/_palette.scss

+1 −1
Original line number Diff line number Diff line
@@ -14,7 +14,7 @@ $palette: ( 
$mix-intervals: (

    "primary":    (-4: 18%, -3: 18%, -2: 18%, -1: 14%),

    "accent":     (),

    "secondary":  (-4: 30%, -3: 30%, -2: 30%, -1: 30%, 1: 30%, 2: 30%, 3: 30%, 4: 30%),

    "secondary":  (-5: 30%, -4: 30%, -3: 30%, -2: 30%, -1: 30%, 1: 30%, 2: 30%, 3: 30%, 4: 30%, 5: 30%),

    "background": (-4: 40%, -3: 35%, -2: 30%, -1: 26%, 1: 30%, 2: 35%, 3: 40%, 4: 50%),



    "fail":       (),