Alpaca components for Magento 2

Actions toolbar 

<div class="dashboard-actions-toolbar ">
    <button class="button dashboard-actions-toolbar__item" type="button">
        Action 1
    </button>

    <button class="button dashboard-actions-toolbar__item" type="button">
        Action 2
    </button>

</div>
 
<div class="dashboard-actions-toolbar {{ class }}">
    {{#each buttons }}
        {{ render '@button' this }}
    {{/each}}
</div>
 
{
  "buttons": [
    {
      "tag": "button",
      "class": "dashboard-actions-toolbar__item",
      "attributes": "type=\"button\"",
      "text": "Action 1"
    },
    {
      "tag": "button",
      "class": "dashboard-actions-toolbar__item",
      "attributes": "type=\"button\"",
      "text": "Action 2"
    }
  ]
}
  • Content: 
    $dashboard-actions-toolbar__item-margin        : $spacer 0 0 !default;
$dashboard-actions-toolbar__item-margin\@medium: 0 $spacer 0 0 !default;

.dashboard-actions-toolbar {
    display: flex;
    flex-direction: column;

    @include mq($screen-m) {
        flex-direction: row;
    }

    &--last-to-right {
        .dashboard-actions-toolbar__item {
            &:last-child {
                @include mq($screen-m) {
                    margin-left: auto;
                    margin-right: 0;
                }
            }
        }
    }

    &__item {
        margin: $dashboard-actions-toolbar__item-margin;

        @include mq($screen-m) {
            margin: $dashboard-actions-toolbar__item-margin\@medium;
        }
    }

    .block-requisition-list {
        @extend .dashboard-actions-toolbar__item;
    }
}
  • URL: /components/raw/dashboard-actions-toolbar/_actions-toolbar.scss
  • Filesystem Path: build/components/Organisms/dashboard/actions-toolbar/_actions-toolbar.scss
  • Size: 825 Bytes

No notes defined.