@stokr/components-library
Version:
STOKR - Components Library
38 lines (37 loc) • 1.83 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.MenuNav = void 0;
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _theme = _interopRequireDefault(require("../../styles/theme"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const MenuNav = exports.MenuNav = _styledComponents.default.nav.withConfig({
displayName: "MenuNavstyles__MenuNav",
componentId: "sc-1v9gc1o-0"
})(["display:inline-block;vertical-align:middle;ul{display:block;list-style:none;font-size:0;padding:0;margin:0;margin:0 -18px;}li{display:inline-block;padding:0;margin:0 18px;}button,a{position:relative;display:block;font-size:11px;line-height:16px;letter-spacing:2px;text-transform:uppercase;padding:2px 0;border:0;margin:0;cursor:pointer;font-weight:500;text-decoration:none;&:hover{opacity:0.68;}}", ""], props => props.mobile && "\n display: block;\n\n ul {\n margin: 0;\n padding: 0;\n }\n\n li {\n display: block;\n text-align: center;\n margin: 0;\n padding: 18px 16px;\n }\n\n a {\n display: inline-block;\n }\n ");
var _default = exports.default = MenuNav; // Merging using IIS & ID Version - from button section (fake style prop to show difference):
// ${props =>
// props.styleIISandID
// ? ` &:hover {
// opacity: 0.68;
// }`
// : `&:before {
// content: '';
// display: block;
// height: 2px;
// width: 100%;
// position: absolute;
// top: 100%;
// left: 0;
// background-color: ${props => theme.cPrimary};
// opacity: 0;
// transform: translateY(8px);
// transition: opacity 0.2s, transform 0.2s;
// }
// &:hover {
// &:before {
// opacity: 1;
// transform: translateY(0);
// }
// }`}