make styles icon use iconsDir #69

weru

01.23.2022 8fc05ebec2318842d94f95b9b9e9b10be88a64ef

make styles icon use iconsDir #69

Signed-off-by: weru <fromweru@gmail.com>

 assets/sass/_components.sass

@@ -197,7 +197,7 @@
    text-align: center
    justify-content: center
    &::before, &::after
      background-image: url(../images/next.svg)
      background-image: var(--nextIcon)
      height: 0.8rem
      width: 0.8rem
      background-size: 100%
@@ -270,7 +270,7 @@
      transform-origin: 50% 50%
      transition: transform 0.5s cubic-bezier(.19,1,.22,1)
      will-change: transform
      background-image: url(../icons/sun.svg)
      background-image: var(--sunIcon)
      background-size: 60%
      background-repeat: no-repeat
      background-position: center 
@@ -316,7 +316,7 @@
    transform-origin: 50% 50%
    border-radius: 50%
    background-color: var(--theme)
    background-image: url(../icons/info.svg)
    background-image: var(--infoIcon)
    background-size: 12%
    background-position: 50% 50%
    background-repeat: no-repeat

 assets/sass/_variables.sass

@@ -34,7 +34,7 @@
    .color
      &_choice
        &::after
          background-image: url(../icons/moon.svg)
          background-image: var(--moonIcon)

  &.dark:not([data-mode="light"])
    @media (prefers-color-scheme: dark)

 assets/sass/main.sass

@@ -1,3 +1,9 @@
{{ $iconsPath := partialCached "functions/getIconPath" . }}
html
  --infoIcon: url('{{ absURL $iconsPath  }}info.svg')
  --sunIcon: url('{{ absURL $iconsPath  }}sun.svg')
  --moonIcon: url('{{ absURL $iconsPath  }}moon.svg')
  --nextIcon: url('{{ absURL $iconsPath  }}next.svg')
@import "variables"
@import "base"
@import "nav"

 static/icons/next.svg

New file
@@ -0,0 +1,43 @@
<?xml version="1.0" encoding="iso-8859-1"?>

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"

     viewBox="0 0 492.004 492.004" style="enable-background:new 0 0 492.004 492.004;" xml:space="preserve" fill="#eee">

<g>

    <g>

        <path d="M484.14,226.886L306.46,49.202c-5.072-5.072-11.832-7.856-19.04-7.856c-7.216,0-13.972,2.788-19.044,7.856l-16.132,16.136

            c-5.068,5.064-7.86,11.828-7.86,19.04c0,7.208,2.792,14.2,7.86,19.264L355.9,207.526H26.58C11.732,207.526,0,219.15,0,234.002

            v22.812c0,14.852,11.732,27.648,26.58,27.648h330.496L252.248,388.926c-5.068,5.072-7.86,11.652-7.86,18.864

            c0,7.204,2.792,13.88,7.86,18.948l16.132,16.084c5.072,5.072,11.828,7.836,19.044,7.836c7.208,0,13.968-2.8,19.04-7.872

            l177.68-177.68c5.084-5.088,7.88-11.88,7.86-19.1C492.02,238.762,489.228,231.966,484.14,226.886z"/>

    </g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

<g>

</g>

</svg>