import { defineComponent, toRefs, pushScopeId, popScopeId, openBlock, createBlock, createVNode, toDisplayString, renderSlot, withScopeId } from 'vue';

var script = defineComponent({
    name: "Header",
    props: {
        title: {
            type: String
        }
    },
    setup(props) {
        return {
            ...toRefs(props)
        };
    }
});

const _withId = /*#__PURE__*/withScopeId("data-v-234e762c");

pushScopeId("data-v-234e762c");
const _hoisted_1 = { class: "header" };
const _hoisted_2 = { class: "header-left" };
const _hoisted_3 = { class: "header-right" };
popScopeId();

const render = /*#__PURE__*/_withId(function render(_ctx, _cache, $props, $setup, $data, $options) {
  return (openBlock(), createBlock("div", _hoisted_1, [
    createVNode("div", _hoisted_2, toDisplayString(_ctx.title), 1),
    createVNode("div", _hoisted_3, [
      renderSlot(_ctx.$slots, "default")
    ])
  ]))
});

function styleInject(css, ref) {
  if ( ref === void 0 ) ref = {};
  var insertAt = ref.insertAt;

  if (!css || typeof document === 'undefined') { return; }

  var head = document.head || document.getElementsByTagName('head')[0];
  var style = document.createElement('style');
  style.type = 'text/css';

  if (insertAt === 'top') {
    if (head.firstChild) {
      head.insertBefore(style, head.firstChild);
    } else {
      head.appendChild(style);
    }
  } else {
    head.appendChild(style);
  }

  if (style.styleSheet) {
    style.styleSheet.cssText = css;
  } else {
    style.appendChild(document.createTextNode(css));
  }
}

var css_248z = ".header {\n  overflow: hidden;\n  height: 6rem;\n  padding: 1.25rem 0.625rem;\n  background-color: #5F656F;\n}\n.header-left {\n  float: left;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  height: 100%;\n  -webkit-align-items: center;\n      -ms-flex-align: center;\n          align-items: center;\n  font-weight: 590;\n  font-size: 1.625rem;\n  padding: 0.75rem;\n\n  color: #F7F7F8;\n}\n.header-right {\n  float: right;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  height: 100%;\n  -webkit-align-items: center;\n      -ms-flex-align: center;\n          align-items: center;\n  padding: 0.75rem;\n}\n@media screen and (max-width: 500px) {\n  .header {\n    height: 3rem;\n    padding: 0.5rem 1rem;\n  }\n\n  .header-left {\n    padding: 0rem;\n  }\n  \n  .header-right {\n    padding: 0rem;\n  }\n}\n";
styleInject(css_248z);

script.render = render;
script.__scopeId = "data-v-234e762c";

const registerComponent = (instance, component) => {
    if (component) {
        instance.component(component.name || "", component);
    }
};

const Plugin = {
    install(vue) {
        registerComponent(vue, script);
    }
};

export default Plugin;
export { script as Header };