search

TimOetting / kirby-builder

A site builder extension for Kirby CMS
398 stars 51 forks source link

CSS/JS block paths #95

Closed yordanoff closed 5 years ago

yordanoff commented 5 years ago

Which one is the correct directory where CSS/JS files related to blocks should be put in order to be loaded via blueprints?

TimOetting commented 5 years ago

He @yordanoff . CSS files have to be located inside the asset folder, just like normal asset files. Js file support is rather limited in the current veraion ( not sure if it works at all right now)

yordanoff commented 5 years ago

That's what I have tried at first, but it doesn't really load. I had to elaborate on that, sorry. So the URL to the CSS I can see in the Network tab is this one: http://localhost/projectname/panel/assets/blocks/quote.css. The panel part is not correct, I think? When I preview it in the Network tab, all I get is this:

<!DOCTYPE html>
<html>
<head>

  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1.0">

  <title>Kirby Panel</title>

  <link rel="stylesheet" href="http://localhost/projectname/media/panel/211324f61e0b30bc0e1ad77e651bc37e/css/app.css">
  <link rel="stylesheet" href="http://localhost/projectname/media/plugins/index.css">

  <link rel="apple-touch-icon" href="http://localhost/projectname/media/panel/211324f61e0b30bc0e1ad77e651bc37e/apple-touch-icon.png" />
  <link rel="shortcut icon" href="http://localhost/projectname/media/panel/211324f61e0b30bc0e1ad77e651bc37e/favicon.png">

  <base href="/projectname/panel/">
</head>
<body>
  <svg aria-hidden="true" style="position:absolute;width:0;height:0" xmlns="http://www.w3.org/2000/svg" overflow="hidden">
  <defs>
    <symbol id="icon-account" viewBox="0 0 16 16">
      <path d="M11 7a3 3 0 1 1-6 0 3 3 0 0 1 6 0z" />
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm4 12.4c-.6-.7-1.4-1.4-3-1.4H7c-1.6 0-2.4.7-3 1.4C2.8 11.3 2 9.8 2 8c0-3.3 2.7-6 6-6s6 2.7 6 6c0 1.8-.8 3.3-2 4.4z"
      />
    </symbol>
    <symbol id="icon-add" viewBox="0 0 16 16">
      <path d="M9 4H7v3H4v2h3v3h2V9h3V7H9z" />
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6z"
      />
    </symbol>
    <symbol id="icon-alert" viewBox="0 0 16 16">
      <path d="M7 6h2v4H7V6zM9 12a1 1 0 1 1-2 0 1 1 0 0 1 2 0z" />
      <path d="M15 16H1a1.001 1.001 0 0 1-.895-1.448l7-14c.34-.678 1.449-.678 1.789 0l7 14A1 1 0 0 1 15 16zM2.618 14h10.764L8 3.236 2.618 14z"
      />
    </symbol>
    <symbol id="icon-angle-down" viewBox="0 0 16 16">
      <path d="M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z" />
    </symbol>
    <symbol id="icon-angle-left" viewBox="0 0 16 16">
      <path d="M10 13.4L4.6 8 10 2.6 11.4 4l-4 4 4 4z" />
    </symbol>
    <symbol id="icon-angle-right" viewBox="0 0 16 16">
      <path d="M6 13.4L4.6 12l4-4-4-4L6 2.6 11.4 8z" />
    </symbol>
    <symbol id="icon-angle-up" viewBox="0 0 16 16">
      <path d="M12 11.4l-4-4-4 4L2.6 10 8 4.6l5.4 5.4z" />
    </symbol>
    <symbol id="icon-bars" viewBox="0 0 16 16">
      <path d="M15 7H1c-.6 0-1 .4-1 1s.4 1 1 1h14c.6 0 1-.4 1-1s-.4-1-1-1zM15 1H1c-.6 0-1 .4-1 1s.4 1 1 1h14c.6 0 1-.4 1-1s-.4-1-1-1zM15 13H1c-.6 0-1 .4-1 1s.4 1 1 1h14c.6 0 1-.4 1-1s-.4-1-1-1z"
      />
    </symbol>
    <symbol id="icon-bold" viewBox="0 0 16 16">
      <path d="M11.561 7.316a3.485 3.485 0 0 0 1.418-3.208C12.781 2.305 11.144.999 9.33.999H2.001v1l1.447.724a1 1 0 0 1 .553.894v8.764a.998.998 0 0 1-.553.894l-1.447.724v1h7.823c2.104 0 3.98-1.547 4.162-3.643a4 4 0 0 0-2.424-4.04zM7 3h1a2 2 0 1 1 0 4H7V3zm2 10H7V9h2a2 2 0 1 1 0 4z"
      />
    </symbol>
    <symbol id="icon-bolt" viewBox="0 0 16 16">
      <path d="M9.2 0H5.4c-.4 0-.8.3-1 .7l-2 7c-.2.7.3 1.3.9 1.3H7l-1.5 7 7.3-9.4c.5-.6 0-1.6-.8-1.6H9l1.1-3.7C10.3.6 9.8 0 9.2 0z"
      />
    </symbol>
    <symbol id="icon-calendar" viewBox="0 0 16 16">
      <path d="M15 2h-2V0h-2v2H9V0H7v2H5V0H3v2H1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zm-1 12H2V5h12v9z"
      />
      <path d="M4 7h2v2H4V7zM7 7h2v2H7V7zM4 10h2v2H4v-2zM7 10h2v2H7v-2zM10 7h2v2h-2V7zM10 10h2v2h-2v-2z" />
    </symbol>
    <symbol id="icon-cancel" viewBox="0 0 16 16">
      <path d="M10.1 4.5L8 6.6 5.9 4.5 4.5 5.9 6.6 8l-2.1 2.1 1.4 1.4L8 9.4l2.1 2.1 1.4-1.4L9.4 8l2.1-2.1z" />
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6z"
      />
    </symbol>
    <symbol id="icon-check" viewBox="0 0 16 16">
      <path d="M8 0C3.589 0 0 3.589 0 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8zm0 14c-3.309 0-6-2.691-6-6s2.691-6 6-6 6 2.691 6 6-2.691 6-6 6z"
      />
      <path d="M7 11.414L3.586 8 5 6.586l2 2 4-4L12.414 6z" />
    </symbol>
    <symbol id="icon-clock" viewBox="0 0 16 16">
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6z" />
      <path d="M9 4H7v5h5V7H9z" />
    </symbol>
    <symbol id="icon-code" viewBox="0 0 16 16">
      <path d="M12.7 11.7l-1.4-1.4L13.6 8l-2.3-2.3 1.4-1.4 3 3c.4.4.4 1 0 1.4l-3 3zM3.3 11.7l-3-3c-.4-.4-.4-1 0-1.4l3-3 1.4 1.4L2.4 8l2.3 2.3-1.4 1.4zM6 15c-.1 0-.2 0-.3-.1-.5-.2-.8-.7-.6-1.3l4-12c.2-.5.7-.8 1.3-.6.5.2.8.7.6 1.3l-4 12c-.2.4-.6.7-1 .7z"
      />
    </symbol>
    <symbol id="icon-cog" viewBox="0 0 16 16">
      <path d="M13.3 5.2l1.1-2.1L13 1.7l-2.1 1.1c-.3-.2-.7-.3-1.1-.4L9 0H7l-.8 2.3c-.3.1-.7.2-1 .4L3.1 1.6 1.6 3.1l1.1 2.1c-.2.3-.3.7-.4 1L0 7v2l2.3.8c.1.4.3.7.4 1.1L1.6 13 3 14.4l2.1-1.1c.3.2.7.3 1.1.4L7 16h2l.8-2.3c.4-.1.7-.3 1.1-.4l2.1 1.1 1.4-1.4-1.1-2.1c.2-.3.3-.7.4-1.1L16 9V7l-2.3-.8c-.1-.3-.2-.7-.4-1zM8 11c-1.7 0-3-1.3-3-3s1.3-3 3-3 3 1.3 3 3-1.3 3-3 3z"
      />
    </symbol>
    <symbol id="icon-collapse" viewBox="0 0 16 16">
      <path d="M15.707 1.707A.999.999 0 1 0 14.293.293l-2.5 2.5L9 0v7h7l-2.793-2.793 2.5-2.5zM2.793 11.793l-2.5 2.5a.999.999 0 1 0 1.414 1.414l2.5-2.5L7 16V9H0l2.793 2.793z"
      />
    </symbol>
    <symbol id="icon-copy" viewBox="0 0 16 16">
      <path d="M10 4H2c-.6 0-1 .4-1 1v10c0 .6.4 1 1 1h8c.6 0 1-.4 1-1V5c0-.6-.4-1-1-1z" />
      <path d="M14 0H4v2h9v11h2V1c0-.6-.4-1-1-1z" />
    </symbol>
    <symbol id="icon-dashboard" viewBox="0 0 16 16">
      <path d="M6 9H1a1 1 0 0 1-1-1V1a1 1 0 0 1 1-1h5a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1zM6 16H1a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h5a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1zM15 6h-5a1 1 0 0 1-1-1V1a1 1 0 0 1 1-1h5a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1zM15 16h-5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h5a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1z"
      />
    </symbol>
    <symbol id="icon-document" viewBox="0 0 16 16">
      <path d="M14 0H2c-.6 0-1 .4-1 1v14c0 .6.4 1 1 1h12c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1zm-1 14H3V2h10v12z" />
      <path d="M4 3h4v4H4V3zM9 4h3v1H9V4zM9 6h3v1H9V6zM4 8h8v1H4V8zM4 10h8v1H4v-1zM4 12h5v1H4v-1z" />
    </symbol>
    <symbol id="icon-dots" viewBox="0 0 16 16">
      <path d="M10 8a2 2 0 1 1-3.999.001A2 2 0 0 1 10 8zM4 8a2 2 0 1 1-3.999.001A2 2 0 0 1 4 8zM16 8a2 2 0 1 1-3.999.001A2 2 0 0 1 16 8z"
      />
    </symbol>
    <symbol id="icon-download" viewBox="0 0 16 16">
      <path d="M8 12c.3 0 .5-.1.7-.3L14.4 6 13 4.6l-4 4V0H7v8.6l-4-4L1.6 6l5.7 5.7c.2.2.4.3.7.3z" />
      <path d="M14 14H2v-3H0v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1v-4h-2v3z" />
    </symbol>
    <symbol id="icon-draft" viewBox="0 0 16 16">
      <path d="M4 0v9H0v4c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3V0H4zm10 13c0 .6-.4 1-1 1H6V2h8v11z" />
      <path d="M8 5h4v2H8V5zM8 9h4v2H8V9z" />
    </symbol>
    <symbol id="icon-edit" viewBox="0 0 16 16">
      <path d="M8.1 3.5L.3 11.3c-.2.2-.3.4-.3.7v3c0 .6.4 1 1 1h3c.3 0 .5-.1.7-.3l7.8-7.8-4.4-4.4zM15.7 3.3l-3-3c-.4-.4-1-.4-1.4 0L9.5 2.1l4.4 4.4 1.8-1.8c.4-.4.4-1 0-1.4z"
      />
    </symbol>
    <symbol id="icon-email" viewBox="0 0 16 16">
      <path d="M15 1H1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zm-1 12H2V6.723l5.504 3.145a.998.998 0 0 0 .992 0L14 6.723V13zm0-8.58L8 7.849 2 4.42V3h12v1.42z"
      />
    </symbol>
    <symbol id="icon-expand" viewBox="0 0 16 16">
      <path d="M7.4 10L6 8.6l-2.7 2.7L0 8v8h8l-3.3-3.3zM11.3 3.3L8.6 6 10 7.4l2.7-2.7L16 8V0H8z" />
    </symbol>
    <symbol id="icon-facebook" viewBox="0 0 16 16">
      <path d="M15.3 0H.7C.3 0 0 .3 0 .7v14.7c0 .3.3.6.7.6H8v-5H6V8h2V6c0-2.1 1.2-3 3-3h2v3h-1c-.6 0-1 .4-1 1v1h2.6l-.6 3h-2v5h4.3c.4 0 .7-.3.7-.7V.7c0-.4-.3-.7-.7-.7z"
      />
    </symbol>
    <symbol id="icon-file-word" viewBox="0 0 32 32">
      <g>
        <circle cx="14" cy="17" r="1" />
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <path d="M17.6,25h-7.2l-4.6-8.1L14,6.4l8.2,10.5L17.6,25z M11.6,23h4.8l3.4-5.9L14,9.6l-5.8,7.5L11.6,23z" />
        <rect x="7" y="23" width="14" height="2" />
        <circle cx="14" cy="17" r="2" />
      </g>
    </symbol>
    <symbol id="icon-file-audio" viewBox="0 0 32 32">
      <g>
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <polygon points="12,20.5 10,20.5 10,8 21,8 21,18.5 19,18.5 19,10 12,10  " />
        <path d="M8.5,24C6.6,24,5,22.4,5,20.5S6.6,17,8.5,17s3.5,1.6,3.5,3.5S10.4,24,8.5,24z M8.5,19C7.7,19,7,19.7,7,20.5
        S7.7,22,8.5,22s1.5-0.7,1.5-1.5S9.3,19,8.5,19z" />
        <path d="M17.5,22c-1.9,0-3.5-1.6-3.5-3.5s1.6-3.5,3.5-3.5s3.5,1.6,3.5,3.5S19.4,22,17.5,22z M17.5,17
        c-0.8,0-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5s1.5-0.7,1.5-1.5S18.3,17,17.5,17z" />
      </g>
    </symbol>
    <symbol id="icon-file-image" viewBox="0 0 32 32">
      <g>
        <polygon points="13.1,23.4 8.1,19.3 5,22.4 3.6,21 7.9,16.7 12.9,20.6 19,13.4 24.4,20.2 22.8,21.4 19,16.6    " />
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <path d="M12.5,14C10.6,14,9,12.4,9,10.5S10.6,7,12.5,7S16,8.6,16,10.5S14.4,14,12.5,14z M12.5,9
        C11.7,9,11,9.7,11,10.5s0.7,1.5,1.5,1.5s1.5-0.7,1.5-1.5S13.3,9,12.5,9z" />
      </g>
    </symbol>
    <symbol id="icon-file-text" viewBox="0 0 32 32">
      <g>
        <path d="M32,32H0V0h32V32z M2,30h28V2H2V30z" />
        <polygon points="23.1,25.4 16.3,8 15.7,8 8.9,25.4 7.1,24.6 14.3,6 17.7,6 24.9,24.6  " />
        <rect x="11.1" y="16" width="9.8" height="2" />
        <rect x="5" y="24" width="6" height="2" />
        <rect x="21" y="24" width="6" height="2" />
      </g>
    </symbol>
    <symbol id="icon-file-video" viewBox="0 0 32 32">
      <g>
        <path d="M32,32H0V0h32V32z M2,30h28V2H2V30z" />
        <path d="M11,18.8V5.2L21.9,12L11,18.8z M13,8.8v6.4l5.1-3.2L13,8.8z" />
        <rect x="24" y="23" width="4" height="2" />
        <rect x="4" y="23" width="12" height="2" />
        <path d="M18,28c-2.2,0-4-1.8-4-4s1.8-4,4-4c2.2,0,4,1.8,4,4S20.2,28,18,28z M18,22c-1.1,0-2,0.9-2,2s0.9,2,2,2
        c1.1,0,2-0.9,2-2S19.1,22,18,22z" />
      </g>
    </symbol>
    <symbol id="icon-file-code" viewBox="0 0 32 32">
      <g>
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <polygon points="9,20.4 4.6,16 9,11.6 10.4,13 7.4,16 10.4,19    " />
        <polygon points="19,20.4 17.6,19 20.6,16 17.6,13 19,11.6 23.4,16    " />
        <rect x="13" y="8.7" transform="matrix(0.9488 0.3159 -0.3159 0.9488 5.7719 -3.6035)" width="2"
          height="14.6" />
      </g>
    </symbol>
    <symbol id="icon-file-zip" viewBox="0 0 32 32">
      <g>
        <polygon points="28,32 0,32 0,0 15,0 15,8 13,8 13,2 2,2 2,30 26,30 26,2 18,2 18,0 28,0  " />
        <path d="M18,19h-8v-9h8V19z M12,17h4v-5h-4V17z" />
        <rect x="12" y="25" width="4" height="2" />
        <rect x="12" y="21" width="4" height="2" />
      </g>
    </symbol>
    <symbol id="icon-file-document" viewBox="0 0 32 32">
      <g>
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <rect x="16" y="7" width="6" height="2" />
        <rect x="16" y="12" width="6" height="2" />
        <rect x="6" y="17" width="16" height="2" />
        <rect x="6" y="22" width="16" height="2" />
        <path d="M14,14H6V7h8V14z M8,12h4V9H8V12z" />
      </g>
    </symbol>
    <symbol id="icon-file-spreadsheet" viewBox="0 0 32 32">
      <g>
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <rect x="13" y="10" width="2" height="12" />
        <rect x="8" y="17" width="2" height="5" />
        <rect x="18" y="14" width="2" height="8" />
      </g>
    </symbol>
    <symbol id="icon-file" viewBox="0 0 32 32">
      <g>
        <path d="M28,32H0V0h28V32z M2,30h24V2H2V30z" />
        <path d="M19.5,22h-11C6.6,22,5,20.4,5,18.5c0-1.8,1.3-3.3,3.1-3.5c0.5-2.8,2.9-5,5.9-5s5.5,2.2,5.9,5
        c1.7,0.2,3.1,1.7,3.1,3.5C23,20.4,21.4,22,19.5,22z M8.5,17C7.7,17,7,17.7,7,18.5S7.7,20,8.5,20h11c0.8,0,1.5-0.7,1.5-1.5
        S20.3,17,19.5,17c-0.1,0-0.2,0-0.3,0L18,17.3l0-1.3c0-2.2-1.8-3.9-4-3.9c-2.2,0-4,1.8-4,3.9l0,0.1v1.2L8.8,17C8.7,17,8.6,17,8.5,17
        z" />
      </g>
    </symbol>
    <symbol id="icon-funnel" viewBox="0 0 16 16">
      <path d="M9 15H7a1 1 0 0 1 0-2h2a1 1 0 0 1 0 2zM11 11H5a1 1 0 0 1 0-2h6a1 1 0 0 1 0 2zM13 7H3a1 1 0 0 1 0-2h10a1 1 0 0 1 0 2zM15 3H1a1 1 0 0 1 0-2h14a1 1 0 0 1 0 2z"
      />
    </symbol>
    <symbol id="icon-globe" viewBox="0 0 16 16">
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm5.9 7H12c-.1-1.5-.4-2.9-.8-4.1 1.4.9 2.4 2.4 2.7 4.1zM8 14c-.6 0-1.8-1.9-2-5h4c-.2 3.1-1.4 5-2 5zM6 7c.2-3.1 1.3-5 2-5s1.8 1.9 2 5H6zM4.9 2.9C4.4 4.1 4.1 5.5 4 7H2.1c.3-1.7 1.3-3.2 2.8-4.1zM2.1 9H4c.1 1.5.4 2.9.8 4.1-1.4-.9-2.4-2.4-2.7-4.1zm9 4.1c.5-1.2.7-2.6.8-4.1h1.9c-.2 1.7-1.2 3.2-2.7 4.1z"
      />
    </symbol>
    <symbol id="icon-headline" viewBox="0 0 16 16">
      <path d="M0 0v6h1l2-3h3v10l-3 2v1h10v-1l-3-2V3h3l2 3h1V0z" />
    </symbol>
    <symbol id="icon-image" viewBox="0 0 16 16">
      <path d="M15 16H1c-.6 0-1-.4-1-1V1c0-.6.4-1 1-1h14c.6 0 1 .4 1 1v14c0 .6-.4 1-1 1zM2 14h12V2H2v12z" />
      <path d="M6 4c.6 0 1 .4 1 1s-.4 1-1 1-1-.4-1-1 .4-1 1-1zM3 12l2-4 2 2 3-4 3 6z" />
    </symbol>
    <symbol id="icon-import" viewBox="0 0 16 16">
      <path d="M15 15H1a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h4v2H2v10h12V3h-3V1h4a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1z" />
      <path d="M9 7V1H7v6H4l4 4 4-4z" />
    </symbol>
    <symbol id="icon-instagram" viewBox="0 0 16 16">
      <path d="M13.105 3.892a.96.96 0 1 1-1.92 0 .96.96 0 0 1 1.92 0zM8 12c-2.206 0-4-1.794-4-4s1.794-4 4-4 4 1.794 4 4-1.794 4-4 4zm0-6c-1.103 0-2 .897-2 2s.897 2 2 2 2-.897 2-2-.897-2-2-2z"
      />
      <path d="M12 16H4c-2.056 0-4-1.944-4-4V4c0-2.056 1.944-4 4-4h8c2.056 0 4 1.944 4 4v8c0 2.056-1.944 4-4 4zM4 2c-.935 0-2 1.065-2 2v8c0 .953 1.047 2 2 2h8c.935 0 2-1.065 2-2V4c0-.935-1.065-2-2-2H4z"
      />
    </symbol>
    <symbol id="icon-italic" viewBox="0 0 16 16">
      <path d="M12 2V0H6v2h1.271a.5.5 0 0 1 .495.571l-1.51 10.571a1 1 0 0 1-.99.859H4v2h6v-2H8.729a.5.5 0 0 1-.495-.571l1.51-10.571a1 1 0 0 1 .99-.859H12z"
      />
    </symbol>
    <symbol id="icon-key" viewBox="0 0 16 16">
      <path d="M12.7 0L6.5 6.3C6 6.1 5.5 6 5 6c-2.8 0-5 2.2-5 5s2.2 5 5 5 5-2.2 5-5c0-.5-.1-1.1-.3-1.6L11 8V6h2V4h2l1-1V0h-3.3zM4.5 12c-.8 0-1.5-.7-1.5-1.5S3.7 9 4.5 9 6 9.7 6 10.5 5.3 12 4.5 12z"
      />
    </symbol>
    <symbol id="icon-list-bullet" viewBox="0 0 16 16">
      <path d="M4 2a2 2 0 1 1-3.999.001A2 2 0 0 1 4 2zM4 8a2 2 0 1 1-3.999.001A2 2 0 0 1 4 8zM4 14a2 2 0 1 1-3.999.001A2 2 0 0 1 4 14zM6 1h10v2H6V1zM6 7h10v2H6V7zM6 13h10v2H6v-2z"
      />
    </symbol>
    <symbol id="icon-list-numbers" viewBox="0 0 16 16">
      <path d="M5 1h11v2H5V1zM5 7h11v2H5V7zM5 13h11v2H5v-2zM.368 4v-.549l.597-.049c.097-.007.111-.035.111-.139V.839c0-.083-.021-.125-.09-.146L.382.568l.076-.569h1.667v3.264c0 .111.007.132.111.139l.569.049V4H.367zM.047 10v-.63l.907-.886c.683-.663.975-.934.975-1.32 0-.251-.122-.433-.48-.433-.373 0-.528.122-.528.602l-.92-.081C.008 6.176.827 6 1.537 6c1.049 0 1.421.447 1.421 1.083s-.44 1.056-.934 1.53l-.765.731h.995c.068 0 .095-.014.108-.081l.095-.534h.717v1.272H.047zM2.344 13.682c.566.087.879.426.879 1.026 0 .879-.659 1.292-1.612 1.292-.673 0-1.272-.239-1.612-.613l.533-.586c.253.246.533.439.999.439.373 0 .693-.133.693-.599 0-.406-.253-.573-.666-.573a2.66 2.66 0 0 0-.493.047v-.666l.327-.04c.479-.06.739-.293.739-.719 0-.253-.113-.46-.486-.46-.359 0-.532.12-.532.593l-.912-.08c0-1.052.793-1.232 1.492-1.232 1.026 0 1.419.393 1.419 1.106 0 .56-.346.912-.766 1.039v.027z"
      />
    </symbol>
    <symbol id="icon-loader" viewBox="0 0 16 16">
      <path d="M8 16a7.928 7.928 0 0 1-3.428-.77l.857-1.807A6.006 6.006 0 0 0 14 8c0-3.309-2.691-6-6-6a6.006 6.006 0 0 0-5.422 8.572l-1.806.859A7.929 7.929 0 0 1 0 8c0-4.411 3.589-8 8-8s8 3.589 8 8-3.589 8-8 8z"
      />
    </symbol>
    <symbol id="icon-lock" viewBox="0 0 16 16">
      <path d="M8 0C5.8 0 4 1.8 4 4v1H2c-.6 0-1 .4-1 1v9c0 .6.4 1 1 1h12c.6 0 1-.4 1-1V6c0-.6-.4-1-1-1h-2V4c0-2.2-1.8-4-4-4zm1 11.7V13H7v-1.3c-.6-.3-1-1-1-1.7 0-1.1.9-2 2-2s2 .9 2 2c0 .7-.4 1.4-1 1.7zM10 5H6V4c0-1.1.9-2 2-2s2 .9 2 2v1z"
      />
    </symbol>
    <symbol id="icon-logout" viewBox="0 0 16 16">
      <path d="M3.4 2H8v2h2V1c0-.6-.4-1-1-1H1C.4 0 0 .4 0 1v9c0 .3.1.5.3.7l5 5c.2.2.4.3.7.3.1 0 .3 0 .4-.1.4-.1.6-.5.6-.9V6c0-.3-.1-.5-.3-.7L3.4 2zM5 12.6l-3-3V3.4l3 3v6.2z"
      />
      <path d="M15.7 7.3L12 3.6 10.6 5l2 2H8v2h4.6l-2 2 1.4 1.4 3.7-3.7c.4-.4.4-1 0-1.4z" />
    </symbol>
    <symbol id="icon-markdown" viewBox="0 0 16 16">
      <path d="M14.85 3H1.15C.52 3 0 3.52 0 4.15v7.69C0 12.48.52 13 1.15 13h13.69c.64 0 1.15-.52 1.15-1.15v-7.7C16 3.52 15.48 3 14.85 3zM9 11H7V8L5.5 9.92 4 8v3H2V5h2l1.5 2L7 5h2v6zm2.99.5L9.5 8H11V5h2v3h1.5l-2.51 3.5z"
      />
    </symbol>
    <symbol id="icon-menu" viewBox="0 0 16 16">
      <path d="M0 0h16v3H0V0zM0 6h16v3H0V6zM0 12h16v3H0v-3z" />
    </symbol>
    <symbol id="icon-open" viewBox="0 0 16 16">
      <path d="M8 7l-4 4h3v5h2v-5h3z" />
      <path d="M0 1v12a1 1 0 0 0 1 1h4v-2H2V6h12v6h-3v2h4a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1H1a1 1 0 0 0-1 1zm2 3V2h12v2H2z" />
    </symbol>
    <symbol id="icon-page" viewBox="0 0 16 16">
      <path d="M14 0H2c-.6 0-1 .4-1 1v14c0 .6.4 1 1 1h12c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1zm-1 14H3V2h10v12z" />
      <path d="M4 3h4v4H4V3zM9 4h3v1H9V4zM9 6h3v1H9V6zM4 8h8v1H4V8zM4 10h8v1H4v-1zM4 12h5v1H4v-1z" />
    </symbol>
    <symbol id="icon-phone" viewBox="0 0 16 16">
      <path d="M15.285 12.305l-2.578-2.594a1 1 0 0 0-1.416-.002L9 12 4 7l2.294-2.294a1 1 0 0 0 .001-1.414L3.715.708a1 1 0 0 0-1.415 0L.004 3.003 0 3c0 7.18 5.82 13 13 13l2.283-2.283a1 1 0 0 0 .002-1.412z"
      />
    </symbol>
    <symbol id="icon-pinterest" viewBox="0 0 16 16">
      <path d="M8 0C3.6 0 0 3.6 0 8c0 3.4 2.1 6.3 5.1 7.4-.1-.6-.1-1.6 0-2.3.1-.6.9-4 .9-4s-.2-.4-.2-1.1c0-1.1.7-2 1.5-2 .7 0 1 .5 1 1.1 0 .7-.4 1.7-.7 2.7-.2.8.4 1.4 1.2 1.4 1.4 0 2.5-1.5 2.5-3.7 0-1.9-1.4-3.3-3.3-3.3-2.3 0-3.6 1.7-3.6 3.5 0 .7.3 1.4.6 1.8v.4c-.1.3-.2.8-.2.9s-.1.2-.3.1c-1-.5-1.6-1.9-1.6-3.1C2.9 5.3 4.7 3 8.2 3c2.8 0 4.9 2 4.9 4.6 0 2.8-1.7 5-4.2 5-.8 0-1.6-.4-1.8-.9 0 0-.4 1.5-.5 1.9-.2.7-.7 1.6-1 2.1.8.2 1.6.3 2.4.3 4.4 0 8-3.6 8-8s-3.6-8-8-8z"
      />
    </symbol>
    <symbol id="icon-preview" viewBox="0 0 16 16">
      <path d="M8 14c4.707 0 7.744-5.284 7.871-5.508a1 1 0 0 0 .001-.98C15.746 7.287 12.731 2 8 2 3.245 2 .251 7.289.126 7.514a.998.998 0 0 0 .002.975C.254 8.713 3.269 14 8 14zM8 4c2.839 0 5.036 2.835 5.818 4-.784 1.166-2.981 4-5.818 4-2.841 0-5.038-2.838-5.819-4.001C2.958 6.835 5.146 4 8 4z"
      />
      <path d="M10 8a2 2 0 1 1-3.999.001A2 2 0 0 1 10 8z" />
    </symbol>
    <symbol id="icon-quote" viewBox="0 0 16 16">
      <path d="M3.024 4.561C1.839 6.042 1.668 7.535 2.016 8.58c1.316-1.045 3.145-.826 4.258.214 1.125 1.051 1.222 2.898.504 4.094a3.293 3.293 0 0 1-2.847 1.613C1.238 14.501 0 12.126 0 9.462c0-1.73.441-3.28 1.323-4.649S3.536 2.34 5.317 1.5l.479.932c-1.075.454-1.999 1.163-2.772 2.129zm8.768 0c-1.185 1.481-1.356 2.974-1.008 4.019.588-.454 1.226-.68 1.915-.68C14.511 7.9 16 9.107 16 11.201c0 1.926-1.478 3.301-3.301 3.301-2.693 0-3.931-2.375-3.931-5.039 0-1.73.441-3.28 1.323-4.649s2.213-2.473 3.994-3.313l.479.932c-1.075.454-1.999 1.163-2.772 2.129z"
      />
    </symbol>
    <symbol id="icon-refresh" viewBox="0 0 16 16">
      <path d="M4.5 4.5c1.9-1.9 5.1-1.9 7 0 .7.7 1.2 1.7 1.4 2.7l2-.3c-.2-1.5-.9-2.8-1.9-3.8C10.3.4 5.9.4 3.1 3.1L.9.9.2 7.3l6.4-.7-2.1-2.1zM15.8 8.7l-6.4.7 2.1 2.1c-1.9 1.9-5.1 1.9-7 0-.7-.7-1.2-1.7-1.4-2.7l-2 .3c.2 1.5.9 2.8 1.9 3.8 1.4 1.4 3.1 2 4.9 2s3.6-.7 4.9-2l2.2 2.2.8-6.4z"
      />
    </symbol>
    <symbol id="icon-search" viewBox="0 0 16 16">
      <path d="M7 14c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7zM7 2C4.243 2 2 4.243 2 7s2.243 5 5 5 5-2.243 5-5-2.243-5-5-5zM15.707 14.293L13.314 11.9a8.019 8.019 0 0 1-1.414 1.414l2.393 2.393a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414z"
      />
    </symbol>
    <symbol id="icon-settings" viewBox="0 0 16 16">
      <path d="M5 5V1c0-.6-.4-1-1-1S3 .4 3 1v4c0 .6.4 1 1 1s1-.4 1-1zM1 11c0 1.3.9 2.4 2 2.8V15c0 .6.4 1 1 1s1-.4 1-1v-1-.2c1.2-.4 2-1.5 2-2.8 0-1.7-1.3-3-3-3s-3 1.3-3 3zM11 11v4c0 .6.4 1 1 1s1-.4 1-1v-4c0-.6-.4-1-1-1s-1 .4-1 1zM9 5c0 1.7 1.3 3 3 3s3-1.3 3-3c0-1.3-.9-2.4-2-2.8V1c0-.6-.4-1-1-1s-1 .4-1 1v1.2C9.9 2.6 9 3.7 9 5z"
      />
    </symbol>
    <symbol id="icon-smile" viewBox="0 0 16 16">
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6z" />
      <path d="M7 6a1 1 0 1 1-2 0 1 1 0 0 1 2 0zM11 6a1 1 0 1 1-2 0 1 1 0 0 1 2 0zM8 12c1.7 0 3-1.3 3-3H5c0 1.7 1.3 3 3 3z"
      />
    </symbol>
    <symbol id="icon-sort" viewBox="0 0 10 16">
      <path d="M0 0h3v3H0V0zM6 0h3v3H6V0zM0 6h3v3H0V6zM6 6h3v3H6V6zM0 12h3v3H0v-3zM6 12h3v3H6v-3z" />
    </symbol>
    <symbol id="icon-tag" viewBox="0 0 16 16">
      <path d="M15.7 8.3l-8-8C7.5.1 7.3 0 7 0H1C.4 0 0 .4 0 1v6c0 .3.1.5.3.7l8 8c.2.2.4.3.7.3s.5-.1.7-.3l6-6c.4-.4.4-1 0-1.4zM4 5c-.6 0-1-.4-1-1s.4-1 1-1 1 .4 1 1-.4 1-1 1z"
      />
    </symbol>
    <symbol id="icon-text" viewBox="0 0 16 16">
      <path d="M0 1h16v2H0V1zM0 5h10v2H0V5zM0 9h16v2H0V9zM0 13h10v2H0v-2z" />
    </symbol>
    <symbol id="icon-title" viewBox="0 0 16 16">
      <path d="M6 1H0v3h1l1-1h3v11l-2 1v1h6v-1l-2-1V3h3l1 1h1V1z" />
      <path d="M8 6v3h1l1-1h1v6l-1 1v1h4v-1l-1-1V8h1l1 1h1V6z" />
    </symbol>
    <symbol id="icon-toggle-off" viewBox="0 0 16 16">
      <path d="M8 8a2 2 0 1 1-3.999.001A2 2 0 0 1 8 8z" />
      <path d="M10 2H6C2.7 2 0 4.7 0 8s2.7 6 6 6h4c3.3 0 6-2.7 6-6s-2.7-6-6-6zm0 10H6c-2.2 0-4-1.8-4-4s1.8-4 4-4h4c2.2 0 4 1.8 4 4s-1.8 4-4 4z"
      />
    </symbol>
    <symbol id="icon-toggle-on" viewBox="0 0 16 16">
      <path d="M8,8 C8,6.3 9.3,5 11,5 C12.7,5 14,6.3 14,8 C14,9.7 12.7,11 11,11 C9.3,11 8,9.7 8,8 M0,8 C0,10.8 2.2,13 5,13 L11,13 C13.8,13 16,10.8 16,8 C16,5.2 13.8,3 11,3 L5,3 C2.2,3 0,5.2 0,8"/>
    </symbol>
    <symbol id="icon-trash" viewBox="0 0 16 16">
      <path d="M5 7h2v6H5V7zM9 7h2v6H9V7z" />
      <path d="M12 1c0-.6-.4-1-1-1H5c-.6 0-1 .4-1 1v2H0v2h1v10c0 .6.4 1 1 1h12c.6 0 1-.4 1-1V5h1V3h-4V1zM6 2h4v1H6V2zm7 3v9H3V5h10z"
      />
    </symbol>
    <symbol id="icon-twitter" viewBox="0 0 16 16">
      <path d="M16 3c-.6.3-1.2.4-1.9.5.7-.4 1.2-1 1.4-1.8-.6.4-1.3.6-2.1.8-.6-.6-1.5-1-2.4-1-1.7 0-3.2 1.5-3.2 3.3 0 .3 0 .5.1.7-2.7-.1-5.2-1.4-6.8-3.4-.3.5-.4 1-.4 1.7 0 1.1.6 2.1 1.5 2.7-.5 0-1-.2-1.5-.4C.7 7.7 1.8 9 3.3 9.3c-.3.1-.6.1-.9.1-.2 0-.4 0-.6-.1.4 1.3 1.6 2.3 3.1 2.3-1.1.9-2.5 1.4-4.1 1.4H0c1.5.9 3.2 1.5 5 1.5 6 0 9.3-5 9.3-9.3v-.4C15 4.3 15.6 3.7 16 3z"
      />
    </symbol>
    <symbol id="icon-undo" viewBox="0 0 16 16">
      <path d="M2.502 12.333a6.996 6.996 0 0 1-1.405-3.168l1.973-.331a4.982 4.982 0 0 0 1.003 2.26l-1.571 1.239zM6.834 14.903a7.015 7.015 0 0 1-2.976-1.259l1.186-1.611c.624.459 1.358.77 2.122.898l-.332 1.972zM9.165 14.903l-.33-1.973a4.99 4.99 0 0 0 2.209-.964l1.219 1.586a6.997 6.997 0 0 1-3.098 1.351zM8 1c-1.873 0-3.65.759-4.948 2.052L.9.9.2 7.3l6.4-.7-2.135-2.135A5.023 5.023 0 0 1 8 3c2.757 0 5 2.243 5 5 0 1.06-.327 2.072-.947 2.928l1.621 1.173A6.96 6.96 0 0 0 15 8c0-3.86-3.141-7-7-7z"
      />
    </symbol>
    <symbol id="icon-upload" viewBox="0 0 16 16">
      <path d="M7 3.4V12h2V3.4l4 4L14.4 6 8.7.3c-.4-.4-1-.4-1.4 0L1.6 6 3 7.4l4-4z" />
      <path d="M14 14H2v-3H0v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1v-4h-2v3z" />
    </symbol>
    <symbol id="icon-url" viewBox="0 0 16 16">
      <path d="M11 0C9.7 0 8.4.5 7.5 1.5L6.3 2.6c-.4.4-.4 1 0 1.4s1 .4 1.4 0l1.2-1.2c1.1-1.1 3.1-1.1 4.2 0 .6.6.9 1.4.9 2.2s-.3 1.6-.9 2.1L12 8.3c-.4.4-.4 1 0 1.4.2.2.5.3.7.3s.5-.1.7-.3l1.2-1.2C15.5 7.6 16 6.3 16 5s-.5-2.6-1.5-3.5C13.6.5 12.3 0 11 0zM8.3 12l-1.2 1.2c-1.1 1.1-3.1 1.1-4.2 0-.6-.6-.9-1.4-.9-2.2s.3-1.6.9-2.1L4 7.7c.4-.4.4-1 0-1.4s-1-.4-1.4 0L1.5 7.5C.5 8.4 0 9.7 0 11s.5 2.6 1.5 3.5c.9 1 2.2 1.5 3.5 1.5s2.6-.5 3.5-1.5l1.2-1.2c.4-.4.4-1 0-1.4s-1-.3-1.4.1z"
      />
      <path d="M9.4 5.2L5.2 9.4c-.4.4-.4 1 0 1.4.2.2.5.3.7.3s.5-.1.7-.3l4.2-4.2c.4-.4.4-1 0-1.4s-1-.4-1.4 0z" />
    </symbol>
    <symbol id="icon-user" viewBox="0 0 16 16">
      <path d="M8 0C5.794 0 4 1.794 4 4v1c0 2.206 1.794 4 4 4s4-1.794 4-4V4c0-2.206-1.794-4-4-4zM12.036 9.426C10.969 10.4 9.555 11 8 11s-2.969-.6-4.036-1.574C2.203 10 1 11.311 1 13v3h14v-3c0-1.689-1.203-3-2.964-3.574z"
      />
    </symbol>
    <symbol id="icon-users" viewBox="0 0 16 16">
      <path d="M10.2 11.4l-2.7-2C8.4 8.7 9 7.7 9 6.5v-.8C9 3.8 7.6 2.1 5.7 2 3.7 1.9 2 3.5 2 5.5v1c0 1.2.6 2.2 1.5 2.9L.8 11.5c-.5.4-.8 1-.8 1.6V15c0 .6.4 1 1 1h9c.6 0 1-.4 1-1v-2c0-.6-.3-1.2-.8-1.6zM15.1 6.4l-1.8-1.2c.4-.4.7-1 .7-1.7v-.9c0-1.2-.9-2.4-2.1-2.6S9.7.5 9.2 1.4c1.1 1 1.8 2.4 1.8 4v1c0 .9-.2 1.8-.6 2.5 0 0 1.2.9 1.2 1H15c.6 0 1-.4 1-1v-.8c0-.7-.3-1.3-.9-1.7z"
      />
    </symbol>
    <symbol id="icon-video" viewBox="0 0 16 16">
      <path d="M11 9V7c0-.6-.4-1-1-1H1c-.6 0-1 .4-1 1v8c0 .6.4 1 1 1h9c.6 0 1-.4 1-1v-2l5 2V7l-5 2zM5 2.5a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0zM10 3a2 2 0 1 1-3.999.001A2 2 0 0 1 10 3z"
      />
    </symbol>
    <symbol id="icon-wand" viewBox="0 0 16 16">
      <path d="M8.046 4.985l2.97 2.97-7.99 7.99-2.97-2.97 7.99-7.99zM12.995 1.591l1.414 1.414-2.404 2.404-1.414-1.414 2.404-2.404zM13 7h3v2h-3V7zM12.243 10.834l2.121 2.121-1.414 1.414-2.121-2.121 1.414-1.414zM7 0h2v3H7V0zM3.05 1.631l2.121 2.121-1.414 1.414-2.121-2.121L3.05 1.631z"
      />
    </symbol>
    <symbol id="icon-template" viewBox="0 0 16 16">
      <path d="M15 1h-3v2h2v11H2V3h2V1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1z" />
      <path d="M5 0h6v4H5zM4 6h8v2H4zM4 10h8v2H4z" />
    </symbol>
    <symbol id="icon-parent" viewBox="0 0 16 16">
      <path d="M14,6H3.4l4-4L6,0.6L0.3,6.3c-0.4,0.4-0.4,1,0,1.4L6,13.4L7.4,12l-4-4H13v7h2V7C15,6.4,14.6,6,14,6z" />
    </symbol>
    <symbol id="icon-circle" viewBox="0 0 16 16">
      <circle cx="8" cy="8" r="8" />
    </symbol>
    <symbol id="icon-circle-outline" viewBox="0 0 16 16">
      <path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6z" />
    </symbol>
    <symbol id="icon-circle-filled" viewBox="0 0 16 16">
      <path d="M8,0C3.6,0,0,3.6,0,8s3.6,8,8,8s8-3.6,8-8S12.4,0,8,0z M8,14c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6 S11.3,14,8,14z" />
      <circle cx="8" cy="8" r="4" />
    </symbol>
    <symbol id="icon-protected" viewBox="0 0 16 16">
      <path d="M8,0C3.6,0,0,3.6,0,8s3.6,8,8,8s8-3.6,8-8S12.4,0,8,0z M8,2c1.3,0,2.5,0.4,3.5,1.1l-8.4,8.4 C2.4,10.5,2,9.3,2,8C2,4.7,4.7,2,8,2z M8,14c-1.3,0-2.5-0.4-3.5-1.1l8.4-8.4C13.6,5.5,14,6.7,14,8C14,11.3,11.3,14,8,14z" />
    </symbol>
    <symbol id="icon-share" viewBox="0 0 16 16">
      <path d="M15,16H1c-0.6,0-1-0.4-1-1V3c0-0.6,0.4-1,1-1h3v2H2v10h12V9h2v6C16,15.6,15.6,16,15,16z" />
      <path d="M10,3c-3.2,0-6,2.5-6,7c1.1-1.7,2.4-3,6-3v3l6-5l-6-5V3z" />
    </symbol>
    <symbol id="icon-remove" viewBox="0 0 16 16">
      <rect data-color="color-2" x="4" y="7" width="8" height="2"></rect> <path d="M8,0C3.6,0,0,3.6,0,8s3.6,8,8,8s8-3.6,8-8S12.4,0,8,0z M8,14c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6 S11.3,14,8,14z"></path>
    </symbol>
    <symbol id="icon-cart" viewBox="0 0 16 16">
      <path d="M15,3H4.5L4,0.8C3.9,0.3,3.5,0,3,0H0v2h2.2L4,10.2C4.1,10.7,4.5,11,5,11h8c0.4,0,0.8-0.3,0.9-0.7l2-6 C16.1,3.8,15.8,3,15,3z"></path>
      <circle data-color="color-2" cx="5" cy="14" r="2"></circle>
      <circle data-color="color-2" cx="13" cy="14" r="2"></circle>
    </symbol>
    <symbol id="icon-key" viewBox="0 0 16 16">
      <path d="M12.7,0L6.5,6.3C6,6.1,5.5,6,5,6c-2.8,0-5,2.2-5,5s2.2,5,5,5s5-2.2,5-5c0-0.5-0.1-1.1-0.3-1.6L11,8V6h2V4h2 l1-1V0H12.7z M4.5,12C3.7,12,3,11.3,3,10.5S3.7,9,4.5,9S6,9.7,6,10.5S5.3,12,4.5,12z"></path>
    </symbol>
  </defs>
</svg>
  <div id="app"></div>

  <noscript>
    Please enable JavaScript in your browser
  </noscript>

  <script>window.panel = {"url":"http://localhost/projectname/panel","site":"http://localhost/projectname","api":"http://localhost/projectname/api","csrf":"3e1584a401c54832a94c392f42f31be1b655601b9da4f3fc186832206149a8c8","translation":"en","debug":true,"search":{"limit":10}}</script>

  <script src="http://localhost/projectname/media/panel/211324f61e0b30bc0e1ad77e651bc37e/js/plugins.js" defer></script>
  <script src="http://localhost/projectname/media/panel/211324f61e0b30bc0e1ad77e651bc37e/js/vendor.js" defer></script>
  <script src="http://localhost/projectname/media/plugins/index.js" defer></script>
    <script src="http://localhost/projectname/media/panel/211324f61e0b30bc0e1ad77e651bc37e/js/app.js" defer></script>

</body>
</html>

Also, if the JS support doesn't work at the moment, can you give me a hint in which file I could include a single JS file that will be used for all snippets (to hardcode it). Thank you!

TimOetting commented 5 years ago

Can you show me the relates lines from you blueprint?

yordanoff commented 5 years ago

Of course, here it is: 

title: Simple Page
preset: page

icon: 📝

status:
  draft: true
  unlisted:
    label: Hidden Page
    text: The page is not listed in the main menu
  listed:
    label: Menu Page
    text: The page is listed in the main menu

pages:
  template: default

fields:
  # text:
    # type: textarea
    # size: huge

  mybuilder:
    label: Builder
    type: builder
    columns: 1
    max: 10
    fieldsets:
      quote: # This is a field set. It contains a group of kirby fields. The user can select from these sets to build the content.
        label: Quote
        preview: # Optional. If defined, a preview of the block can be rendered by the specified snippet from within the snippets folder
          snippet: blocks/quote
          # css: /assets/css/styles1.css
          # css: /assets/css/styles1.css
          css: /assets/css/quote.css
          # js: /assets/main1.js
        fields:
          text:
            label: Quote Text
            type: textarea
          citation:
            label: Citation
            type: text
bnomei commented 5 years ago

@TimOetting @yordanoff i am having this issue as well.

css file is reachable in browser but kirby builder plugin will just get to stuff from the panel.

maybe because panel sets <base href="/panel/"> in its head the iframe is broken and the css not found? the output in the style would match an request to /panel/assets/css/test.css (yielding the login form).

block definition loaded via extend

label: Text
preview:
  snippet: c-text
  css: /assets/css/test.css
fields:
  text:
    label: Text
    type: textarea

/assets/css/test.css

.bg-red {
    background-color: blue;
}
TimOetting commented 5 years ago

This issue came up with Kirby 3.0.3. I fixed it with the latest release. Thanks for contributing!

yordanoff commented 5 years ago

Thank you!

One more thing: if the Kirby installation is not in the root directory though, the path is not correct.

Kirby is in http://localhost/projectname

and the assets are being loaded from: http://localhost/assets/css/style.css instead of http://localhost/projectname/assets/css/style.css

piaaaac commented 4 years ago

One more thing: if the Kirby installation is not in the root directory though, the path is not correct.

I have exactly this problem, is there a way to make it work with this setup? I tried with a relative path without success.

It would be handy to use something similar to $kirby->url('assets')

piaaaac commented 4 years ago

Fantastic, fixed! Thank you

graphek commented 3 years ago

@piaaaac hey, can you tell me how you managed to get the correct assets path in the yaml when your installation is in a subdirectory, e.g. /localhost/myproject/... ?

piaaaac commented 3 years ago 
title: Two columns builder

sections:
  meta: 
    type: fields
    fields:

      openingImage:
        label: Opening image
        type: files
        translate: false
        layout: cards
        size: huge
        image:
          ratio: 3/1
          cover: true
        max: 1

      mybuilder:
        label: Page Builder
        type: builder
        fieldsets:

          twocols:
            name: Two columns block
            preview: 
              snippet: blocks/twocols

              # this works for me #
              css: /assets/css/panel.css

            defaultView: preview
            fields:
              submenu:
                type: text
                label: Submenu text
              textLeft:
                label: Large text on the left
                type: textarea
              images:
                label: Images
                type: files
                min: 1
              textRight:
                label: Body text on the right
                type: textarea

and my project sits in a subdirectory of the server

graphek commented 3 years ago

@piaaaac thanks for your answer! Strange, this doesn't work for me. I have my kirby installation in http://localhost/kirby/ and if i set the CSS Path like you, its trying to get it from the root: https://www.dropbox.com/s/aatosv8yu5zxelv/Bildschirmfoto%202021-04-28%20um%2016.39.38.png?dl=0