footballrs.net

Icon: cheerleader 

<i class="cheerleader"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
        <title>cheerleader</title>
        <g id="cheerleader">
            <path d="M46,31H44.85a1,1,0,0,1-1-1.15A12.49,12.49,0,0,0,44,28V22a1,1,0,0,1,1-1h1a5,5,0,0,1,0,10Zm0-2h0a3,3,0,0,0,3-3,3,3,0,0,0-3-3v5C46,28.34,46,28.67,46,29Z" />
            <path d="M19.15,31H18a5,5,0,0,1,0-10h1a1,1,0,0,1,1,1v6a12.49,12.49,0,0,0,.14,1.85,1,1,0,0,1-1,1.15ZM18,23a3,3,0,0,0-1.5.41,3.06,3.06,0,0,0-.64.48A3,3,0,0,0,18,29h0c0-.33,0-.66,0-1Z" />
            <path d="M32,51a1,1,0,0,1-.71-.29l-4-4A1,1,0,0,1,27,46V40.37a1,1,0,0,1,1.31-.95,12.08,12.08,0,0,0,7.38,0,1,1,0,0,1,1.31.95V46a1,1,0,0,1-.29.71l-4,4A1,1,0,0,1,32,51Zm-3-5.41,3,3,3-3V41.68a14.11,14.11,0,0,1-6,0Z" />
            <path d="M32,42a13.88,13.88,0,0,1-4.31-.68,14.09,14.09,0,0,1-9.53-11.17A13.77,13.77,0,0,1,18,28V19a1,1,0,0,1,1-1h7a5,5,0,0,0,3.53-1.46,5.05,5.05,0,0,0,.79-1A4.9,4.9,0,0,0,31,13a1,1,0,0,1,2,0,4.86,4.86,0,0,0,.67,2.49A5,5,0,0,0,38,18h7a1,1,0,0,1,1,1v9a13.77,13.77,0,0,1-.16,2.15,14.09,14.09,0,0,1-9.53,11.17A13.88,13.88,0,0,1,32,42ZM20,20v8a12.49,12.49,0,0,0,.14,1.85,12,12,0,0,0,23.72,0A12.49,12.49,0,0,0,44,28V20H38a7,7,0,0,1-6-3.4A7.34,7.34,0,0,1,31,18,6.93,6.93,0,0,1,26,20Z" />
            <path d="M48,23.54a1,1,0,0,1-.5-.13A3,3,0,0,0,46,23H45a1,1,0,0,1-1-1V20H38a7,7,0,0,1-6-3.4A7.34,7.34,0,0,1,31,18,6.93,6.93,0,0,1,26,20H20v2a1,1,0,0,1-1,1H18a3,3,0,0,0-1.5.41,1,1,0,0,1-1,0,1,1,0,0,1-.5-.87V16.85a14,14,0,0,1,3.05-8.56l.07-.09a14.36,14.36,0,0,1,2.65-2.52A13.85,13.85,0,0,1,29,3h6a13.85,13.85,0,0,1,8.23,2.68A14.36,14.36,0,0,1,45.88,8.2l.08.1c.19.25.38.5.56.76l0,0,.05.06c.19.3.38.6.57.92A14.31,14.31,0,0,1,48.68,14c0,.16.07.32.09.48A13.09,13.09,0,0,1,49,16.84h0v5.69a1,1,0,0,1-.5.87A1,1,0,0,1,48,23.54ZM19.73,9.39l-.06.08A12,12,0,0,0,17,16.86V21.1a5.56,5.56,0,0,1,1-.1V19a1,1,0,0,1,1-1h7a5,5,0,0,0,3.53-1.46,5.05,5.05,0,0,0,.79-1A4.9,4.9,0,0,0,31,13a1,1,0,0,1,2,0,4.86,4.86,0,0,0,.67,2.49A5,5,0,0,0,38,18h7a1,1,0,0,1,1,1v2a5.56,5.56,0,0,1,1,.1V16.86a11.74,11.74,0,0,0-.2-2c0-.16,0-.28-.08-.4a12.12,12.12,0,0,0-1.28-3.35L45,10.32l0-.06c-.19-.27-.39-.54-.6-.8a.18.18,0,0,0,0-.07A12,12,0,0,0,35,5H29a12,12,0,0,0-9.27,4.39Z" />
            <path d="M16,63H9a1,1,0,0,1-.78-.37,1,1,0,0,1-.2-.85L9.76,54a14,14,0,0,1,8.9-10.12,1,1,0,0,1,.91.12,1,1,0,0,1,.43.82V55a1,1,0,0,1-.28.69A9.09,9.09,0,0,0,17,62,1,1,0,0,1,16,63Zm-5.75-2h4.8A11,11,0,0,1,18,54.61V46.3a11.93,11.93,0,0,0-6.28,8.1Z" />
            <path d="M55,63H48a1,1,0,0,1-1-1,9.09,9.09,0,0,0-2.72-6.31A1,1,0,0,1,44,55V44.78a1,1,0,0,1,.43-.82,1,1,0,0,1,.91-.12A13.91,13.91,0,0,1,54.24,54L56,61.78a1,1,0,0,1-.2.85A1,1,0,0,1,55,63Zm-6-2h4.8l-1.47-6.6A11.87,11.87,0,0,0,46,46.3v8.31A11,11,0,0,1,49,61Z" />
            <path d="M32,57a1,1,0,0,1-.71-.29l-8-8A1,1,0,0,1,23,48V44a1,1,0,0,1,1-1h4a1,1,0,0,1,1,1v1.59l3,3,3-3V44a1,1,0,0,1,1-1h4a1,1,0,0,1,1,1v4a1,1,0,0,1-.29.71l-8,8A1,1,0,0,1,32,57Zm-7-9.41,7,7,7-7V45H37v1a1,1,0,0,1-.29.71l-4,4a1,1,0,0,1-1.42,0l-4-4A1,1,0,0,1,27,46V45H25Z" />
            <path d="M48,63H16a1,1,0,0,1-1-1,11,11,0,0,1,3-7.39V44.78a1,1,0,0,1,.68-1l1.33-.4a14.24,14.24,0,0,1,1.74-.32l.14,0A14.06,14.06,0,0,1,23.43,43H24a1,1,0,0,1,1,1v3.59l7,7,7-7V44a1,1,0,0,1,1-1h.57a14.06,14.06,0,0,1,1.54.09l.14,0a14.08,14.08,0,0,1,1.7.31,5.39,5.39,0,0,1,.63.17c.24.07.5.15.77.25a1,1,0,0,1,.65.94v9.83A11,11,0,0,1,49,62,1,1,0,0,1,48,63ZM17.06,61H46.94a9.33,9.33,0,0,0-2.66-5.31A1,1,0,0,1,44,55V45.5h0a4.67,4.67,0,0,0-.5-.13,13.09,13.09,0,0,0-1.6-.29l-.14,0L41,45v3a1,1,0,0,1-.29.71l-8,8a1,1,0,0,1-1.42,0l-8-8A1,1,0,0,1,23,48V45l-.76.05-.14,0a14.52,14.52,0,0,0-1.59.28L20,45.5V55a1,1,0,0,1-.28.69A9.33,9.33,0,0,0,17.06,61Z" />
            <path d="M31,63a1,1,0,0,1-.71-.29l-12-12a1,1,0,0,1,1.42-1.42l12,12a1,1,0,0,1,0,1.42A1,1,0,0,1,31,63Z" />
            <path d="M33,63a1,1,0,0,1-.71-.29,1,1,0,0,1,0-1.42l12-12a1,1,0,0,1,1.42,1.42l-12,12A1,1,0,0,1,33,63Z" />
            <path d="M7,28a1,1,0,0,1-1-1V10a2.09,2.09,0,0,1,0-.25A2.09,2.09,0,0,1,6,9.5,8.5,8.5,0,0,1,22.28,6.09,1,1,0,0,1,22,7.3a11.87,11.87,0,0,0-2.22,2.09l-.06.08A12,12,0,0,0,17,16.86V18.8a1,1,0,0,1-.17.56c-.52.76-1.08,1.52-1.68,2.27C14,23.12,9.82,28,7,28ZM14.5,3A6.51,6.51,0,0,0,8,9.5v.13a1,1,0,0,1,0,.24V25.66a21.83,21.83,0,0,0,5.59-5.28q.75-.94,1.41-1.89V16.85a14,14,0,0,1,3.05-8.56l.07-.09a13.8,13.8,0,0,1,2-2A6.5,6.5,0,0,0,14.5,3Z" />
            <path d="M57,28c-2.82,0-7-4.88-8.15-6.37-.6-.75-1.16-1.51-1.68-2.27A1,1,0,0,1,47,18.8V16.85a11.82,11.82,0,0,0-.2-2c0-.16,0-.28-.08-.4a12.12,12.12,0,0,0-1.28-3.35c-.15-.25-.31-.51-.47-.75l0-.07c-.19-.27-.38-.54-.59-.79l-.06-.08A11.85,11.85,0,0,0,42.05,7.3a1,1,0,0,1-.33-1.21A8.5,8.5,0,0,1,58,9.5a2.09,2.09,0,0,1,0,.25A2.09,2.09,0,0,1,58,10V27A1,1,0,0,1,57,28Zm-8-9.51c.44.63.91,1.26,1.41,1.88A21.74,21.74,0,0,0,56,25.66V9.87a1,1,0,0,1,0-.24V9.5A6.5,6.5,0,0,0,43.9,6.21a13.8,13.8,0,0,1,2,2l.07.09c.2.25.39.51.57.77l0,0,0,.05c.2.3.41.62.59.95A14.24,14.24,0,0,1,48.68,14c0,.16.07.32.09.48A13.09,13.09,0,0,1,49,16.84Z" />
        </g>
    </svg></i>
 
{% set className = className ? className ~ ' ' : '' %}
{% set attributes = className ~ icon | trim %}
{% set insert = true %}
{% if iconType is empty or iconType == 'custom' %}
<i class="{{ attributes }}">{% if insert is defined and insert == true %}{{ source('@customIcons/' ~ icon ~ '.svg') }}{% endif %}</i>
{% elseif iconType is not empty or iconType == 'iconoir' %}
<i class="{{ attributes }}">{% if insert is defined and insert == true %}{{ source('@icons/' ~ icon ~ '.svg') }}{% endif %}</i>
{% endif %}
 
{
  "icon": "cheerleader"
}
  • Content: 
    <?php

namespace Theme\Views\Atoms\icon;

use ACFToolkit\Traits\SetWrapperWidth;
use ACFToolkit\Types\CustomAtom;


class Icon extends CustomAtom
{
    use SetWrapperWidth;

    public string $name = 'icon';
    public string $label = 'Icon';
    public int $needsJs = 0;
    public int $needsVue = 1;
    public int $needsVueInitialisation = 0;

    public function __construct($name = '', $title = '', $children = [])
    {
        parent::__construct($name, $title);
        $this->addChildren(array_merge($children, [
        ]));
    }

    public function getChoices()
    {
        $customIcons = get_template_directory().'/resources/Views/Assets/dist/custom-icons/*.svg';

        $result = [];
        $files = glob($customIcons);
        foreach($files as $file) {
            $filename = basename($file, '.svg');
            $result[$filename] = $filename;
        }
        return $result;
    }
}
  • URL: /components/raw/icon/Icon.php
  • Filesystem Path: resources/Views/Atoms/icon/Icon.php
  • Size: 909 Bytes
  • Content: 
    <?php

namespace Theme\Views\Atoms\icon;

use ACFToolkit\ViewModels\BaseViewModel;

class IconViewModel extends BaseViewModel
{
}
  • URL: /components/raw/icon/IconViewModel.php
  • Filesystem Path: resources/Views/Atoms/icon/IconViewModel.php
  • Size: 130 Bytes
  • Content: 
    i {
  display: inline-block;
  width: 26px;

  svg {
    width: 100%;
    vertical-align: top;
  }

  &.sm {
    width: 20px;
  }

  &.md {
    width: 40px;
  }

  &.lg {
    width: 50px;
  }

  &.xl {
    width: 60px;
  }

  &.star--filled {
    svg {
      g {
        fill: theme('colors.primary');
      }
    }
  }

  &.logo {
    svg {
      g {
        fill: theme('colors.primary');
      }
    }
  }

  &.logo--white {
    svg {
      g {
        fill: #fff;
      }
    }
  }

  &.logo_subline {
    svg {
      g {
        fill: theme('colors.primary');
      }
    }
  }

  &.logo_subline--white {
    svg {
      g {
        fill: #fff;
      }
    }
  }

  &.logo_subline-subline--accent {
    svg {
      g {
        fill: theme('colors.primary');

        &#subline {
          fill: theme('colors.accent');
        }
      }
    }
  }

  &.logo_subline--white-subline--accent {
    svg {
      g {
        fill: #fff;

        &#subline {
          fill: theme('colors.accent');
        }
      }
    }
  }

  &.search {
    width: 24px;
    height: 24px;
  }
}
  • URL: /components/raw/icon/icon.scss
  • Filesystem Path: resources/Views/Atoms/icon/icon.scss
  • Size: 1.1 KB
  • Content: 
    <template>
  <i
    :class="getTypeClass + '-' + icon + ' ' + className"
    v-html="iconSource"
    :title="title"
    v-if="iconSource"
  ></i>
</template>
<script>
  import IconService from '../../Assets/src/js/services/IconService';

  export default {
    props: {
      className: {
        type: String,
        default: ''
      },
      icon: {
        type: String,
      },
      title: {
        type: String
      },
      type: {
        type: String,
        default: 'custom'
      }
    },
    data: () => {
      return {
        iconSource: null
      }
    },
    computed: {
        getTypeClass(){
          return this.type === 'custom' ? 'custom' : 'iconoir'
        }
    },
    async created(){
      const {data} = this.type === 'custom' ?
        await IconService.getCustom(this.icon) :
        await IconService.getIconoir(this.icon)
      this.iconSource = data
    }
  }
</script>
<style>
*[class^="iconoir-"], *[class*=" iconoir-"] {
  display: inline-block;
}
</style>
  • URL: /components/raw/icon/icon.vue
  • Filesystem Path: resources/Views/Atoms/icon/icon.vue
  • Size: 1 KB

title: Icon

{% include '@atoms/icon/icon.twig' with {
    icon: 'icon'
} only %}

ACF

Fields