footballrs.net

Card: Uploaded image 

<!-- Error rendering component -->
<!-- TwigException: Unable to find filter resize -->
<!-- Error: TwigException: Unable to find filter resize
    at /builds/michaelhulsman/footballrs.net/htdocs/content/themes/footballrs.net/node_modules/@frctl/twig/src/adapter.js:156:24
    at new Promise (<anonymous>)
    at TwigAdapter.render (/builds/michaelhulsman/footballrs.net/htdocs/content/themes/footballrs.net/node_modules/@frctl/twig/src/adapter.js:134:16)
    at ComponentSource._renderVariant (/builds/michaelhulsman/footballrs.net/htdocs/content/themes/footballrs.net/node_modules/@frctl/fractal/src/api/components/source.js:212:30)
    at _renderVariant.next (<anonymous>)
    at onFulfilled (/builds/michaelhulsman/footballrs.net/htdocs/content/themes/footballrs.net/node_modules/co/index.js:65:19) -->
 
{# --BLUEPRINT DO NOT REMOVE--

/--BLUEPRINT DO NOT REMOVE-- #}
<div class="card uploaded-image relative">
    {% include '@atoms/picture/picture.twig' with uploadedImage only %}
    {% include '@molecules/memberAvatarLayer/member_avatar_layer.twig' with {
        avatar: avatar,
        link: link,
        name: name
    } %}
</div>
 
{
  "uploadedImage": {
    "default": {
      "src": "https://loremflickr.com/750/600/sports?lock=5865936802283520",
      "alt": "Mollitia molestiae ratione reiciendis earum.",
      "width": 750,
      "height": 600
    },
    "sources": [
      {
        "src": "https://loremflickr.com/750/600/sports?lock=5865936802283520",
        "media": "(max-width: 2560px)"
      }
    ]
  },
  "avatar": {
    "default": {
      "src": "https://loremflickr.com/100/100/people",
      "alt": "Optio unde consequatur eum quas.",
      "width": 100,
      "height": 100
    },
    "sources": [
      {
        "src": "https://loremflickr.com/100/100/people",
        "media": "(max-width: 2560px)"
      }
    ]
  },
  "link": "#",
  "name": "Adah R."
}
  • Content: 
    <?php

namespace Theme\Views\Molecules\card;

use ACFToolkit\Types\CustomMolecule;


class Card extends CustomMolecule
{
    public string $name = 'card';
    public string $label = 'Card';
    public int $needsJs = 0;
    public int $needsVue = 0;
    public int $needsVueInitialisation = 0;

    public function __construct($name = '', $title = '', $children = [])
    {
        parent::__construct($name, $title);
        $this->addChildren(array_merge($children, [
        ]));
    }
}
  • URL: /components/raw/card/Card.php
  • Filesystem Path: resources/Views/Molecules/card/Card.php
  • Size: 489 Bytes
  • Content: 
    <?php

namespace Theme\Views\Molecules\card;

use ACFToolkit\ViewModels\BaseViewModel;

class CardViewModel extends BaseViewModel
{
}
  • URL: /components/raw/card/CardViewModel.php
  • Filesystem Path: resources/Views/Molecules/card/CardViewModel.php
  • Size: 134 Bytes
  • Content: 
    .card {
  &.uploaded-image {
    @apply inline-block rounded-lg overflow-hidden relative;

    .member-avatar-layer {
      @apply absolute left-0 bottom-0 z-20 w-full;
    }
  }

}
  • URL: /components/raw/card/card.scss
  • Filesystem Path: resources/Views/Molecules/card/card.scss
  • Size: 182 Bytes

title: Card

{% include '@molecules/card/card.twig' with {

    } only %}

ACF

Fields