vuestic-ui/dist/web-components/src/components/va-navbar/VaNavbar.js

Vue 3 UI Framework

import { _ as _sfc_main } from "./VaNavbar.vue_vue_type_script_setup_true_lang.js";
import { _ as _export_sfc } from "../../../plugin-vue_export-helper.js";
const _style_0 = '.va-navbar {\n  --va-navbar-mobile-height: 6.5rem;\n  --va-navbar-height: 4.0625rem;\n  --va-navbar-padding-x: 1rem;\n  --va-navbar-padding-y: 1.2rem;\n  --va-navbar-transition: transform 0.5s ease;\n  --va-navbar-position: relative;\n  --va-nav-z-index: calc(var(--va-z-index-teleport-overlay) - 100);\n  --va-navbar-sm-padding: 1.1875rem 1rem 1rem;\n  --va-navbar-shape-width: 33%;\n  --va-navbar-shape-max-width: 467px;\n  --va-navbar-shape-bg: rgba(0, 0, 0, 0.5);\n  --va-navbar-shape-border-left: 3.1875rem solid transparent;\n  --va-navbar-shape-border-right: 3.1875rem solid transparent;\n  --va-navbar-shape-transition: border-top-color 0.3s ease;\n  --va-navbar-item-margin: 0.75rem;\n  --va-navbar-item-margin-side: calc(2 * var(--va-navbar-item-margin));\n}\n.va-navbar {\n  display: grid;\n  grid-template: "left center right"/1fr auto 1fr;\n  align-items: center;\n  transition: var(--va-navbar-transition);\n  position: var(--va-navbar-position);\n  padding: var(--va-navbar-padding-y) var(--va-navbar-padding-x);\n  background-color: var(--va-primary);\n  font-family: var(--va-font-family);\n  top: 0;\n  left: 0;\n  width: 100%;\n  min-width: 100%;\n  z-index: var(--va-navbar-z-index);\n}\n.va-navbar__left {\n  display: flex;\n  grid-area: left;\n}\n.va-navbar__left > .va-navbar__item {\n  margin-right: var(--va-navbar-item-margin-side);\n}\n.va-navbar__left > .va-navbar__item:last-child {\n  margin-right: 0;\n}\n.va-navbar__center {\n  display: flex;\n  justify-content: center;\n  grid-area: center;\n}\n.va-navbar__center > .va-navbar__item {\n  margin: 0 var(--va-navbar-item-margin);\n}\n.va-navbar__center > .va-navbar__item:last-child {\n  margin-right: 0;\n}\n.va-navbar__center > .va-navbar__item:first-child {\n  margin-left: 0;\n}\n.va-navbar__right {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  grid-area: right;\n}\n.va-navbar__right > .va-navbar__item {\n  margin-right: var(--va-navbar-item-margin-side);\n}\n.va-navbar__right > .va-navbar__item:last-child {\n  margin-right: 0;\n}\n.va-navbar__background-shape {\n  transition: var(--va-navbar-shape-transition);\n  width: var(--va-navbar-shape-width);\n  max-width: var(--va-navbar-shape-max-width);\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  margin: auto;\n  border-top: var(--va-navbar-height) solid var(--va-navbar-shape-bg);\n  border-left: var(--va-navbar-shape-border-left);\n  border-right: var(--va-navbar-shape-border-right);\n  height: 0;\n}\n@media (max-width: 767.98px) {\n.va-navbar__background-shape {\n    display: none;\n}\n}\n.va-navbar--shadowed {\n  box-shadow: 0 2px 8px var(--va-shadow);\n}\n.va-navbar--bordered {\n  border-bottom: var(--va-background-border);\n}';
const _VaNavbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["styles", [_style_0]]]);
export {
  _VaNavbar as _
};
//# sourceMappingURL=VaNavbar.js.map