{%- set navbar_locations = [ 'overall_header_body_before', 'overall_header_headerbar_before', 'overall_header_headerbar_after', 'overall_header_navbar_before', '' ] -%} {% macro makeNumberInput(name, element, prop, min, isPrimary) %} {% endmacro %} {% macro makeSize(name, element, prop, min) %}
{{ _self.makeNumberInput(name, element, prop.default|default(prop), min, true) }}
{% if attribute(prop, 'top_left') is not defined %}
{{ _self.makeNumberInput(name ~ '_left', element, attribute(prop, 'left') is defined ? attribute(prop, 'left') : prop ~ '-left', min) }}
{{ _self.makeNumberInput(name ~ '_top', element, attribute(prop, 'top') is defined ? attribute(prop, 'top') : prop ~ '-top', min) }}
{{ _self.makeNumberInput(name ~ '_bottom', element, attribute(prop, 'bottom') is defined ? attribute(prop, 'bottom') : prop ~ '-bottom', min) }}
{{ _self.makeNumberInput(name ~ '_right', element, attribute(prop, 'right') is defined ? attribute(prop, 'right') : prop ~ '-right', min) }}
{% else %}
{{ _self.makeNumberInput(name ~ '_tl', element, attribute(prop, 'top_left') is defined ? attribute(prop, 'top_left') : prop ~ '-top-left', min) }}
{{ _self.makeNumberInput(name ~ '_tr', element, attribute(prop, 'top_right') is defined ? attribute(prop, 'top_right') : prop ~ '-top-right', min) }}
{{ _self.makeNumberInput(name ~ '_bl', element, attribute(prop, 'bottom_left') is defined ? attribute(prop, 'bottom_left') : prop ~ '-bottom-left', min) }}
{{ _self.makeNumberInput(name ~ '_br', element, attribute(prop, 'bottom_right') is defined ? attribute(prop, 'bottom_right') : prop ~ '-bottom-right', min) }}
{% endif %}
{% endmacro %} {% macro makeColorPicker(name, element, prop, group) %} {% endmacro %} {% macro makeBorderOptions(name, element, hideRadius, borderColorTitle) %}
{{ lang(borderColorTitle|default('COLOR')) }}:
{{ _self.makeColorPicker(name ~ 'border_color', element, 'border-color') }}
{% set props = { default: 'border-width', top: 'border-top-width', right: 'border-right-width', bottom: 'border-bottom-width', left: 'border-left-width' } %}
{{ lang('BORDER_WIDTH') }}
{{ _self.makeSize(name ~ 'border_width', element, props, 0) }}
{% if not hideRadius %}
{% set props = { default: 'border-radius', top_left: 'border-top-left-radius', top_right: 'border-top-right-radius', bottom_left: 'border-bottom-left-radius', bottom_right: 'border-bottom-right-radius', } %}
{{ lang('BORDER_RADIUS') }}
{{ _self.makeSize(name ~ 'border_radius', element, props, 0) }}
{% endif %} {% endmacro %} {% macro makeBgColorOptions(name, element, title) %}
{% if title %}
{{ lang(title) }}
{% endif %}
{{ lang('BACKGROUND') }}:
{{ _self.makeColorPicker(name ~ '_bg_color', element, 'background-color') }}
{{ lang('COLOR') }}:
{{ _self.makeColorPicker(name ~ '_txt_color', element, 'color') }}
{% endmacro %} {% macro makeTextOptions(name, element) %}
{{ lang('BACKGROUND') }}:
{{ _self.makeColorPicker(name ~ '_bg_color', element, 'background-color') }}
{{ lang('COLOR') }}:
{{ _self.makeColorPicker(name ~ 'txt_color', element, 'color') }}
{{ lang('SIZE') }}:
{{ _self.makeNumberInput(name ~ 'txt_size', element, 'font-size', 10) }}
{{ _self.makeBgColorOptions(name ~ 'hover', element ~ ':hover', 'HOVER') }} {% endmacro %} {% macro makeActiveElement(name, element) %} {{ _self.makeBgColorOptions(name, element) }} {{ _self.makeBorderOptions(name, element, true, 'BORDER_COLOR') }} {% endmacro %}

{{ lang('NAVBAR') }}

{% if NAVBAR_LOCATION %}
{{ _self.makeBgColorOptions('nav_resp_toggle', '.sm-menu label') }}
{{ lang('COLOR') }}:
{{ _self.makeColorPicker('nav_bg_color', '.sm-menu', 'background-color') }}
{{ lang('GRADIENT') }}
{{ lang('START') }}:
{{ _self.makeColorPicker('nav_grad_color_start', '.sm-menu', 'background-image', 'bg-gradient') }}
{{ lang('END') }}:
{{ _self.makeColorPicker('nav_grad_color_end', '.sm-menu', 'background-image', 'bg-gradient') }}
{{ _self.makeSize('nav_margin', '.sm-menu', 'margin', false, sizeInputOptions) }}
{{ _self.makeSize('nav_padding', '.sm-menu', 'padding', 0, sizeInputOptions) }}
{{ _self.makeBorderOptions('nav_', '.sm-menu')}}
{% endif %}
{% if NAVBAR_LOCATION %}

{{ lang('NAVBAR_TOP_MENU') }}

{{ lang('TRANSFORM') }}:
{{ _self.makeTextOptions('tm', '.sm-menu > ul > li > .sm-nav-item') }}
{{ _self.makeSize('tm_margin', '.sm-menu > ul > li > .sm-nav-item', 'margin', false, sizeInputOptions) }}
{{ _self.makeSize('tm_padding', '.sm-menu > ul > li > .sm-nav-item', 'padding', 5, sizeInputOptions) }}
{{ _self.makeBorderOptions('tm_', '.sm-menu > ul > li > a') }}
{{ _self.makeActiveElement('tm_active', '.sm-menu > ul > li > a.active', sizeInputOptions) }}

{{ lang('NAVBAR_DROPDOWN') }}

{{ _self.makeTextOptions('drop', '.sm-menu > ul > li > .sub-menu li .sm-nav-item') }}
{{ _self.makeBorderOptions('drop', '.sm-menu > ul > li .sub-menu') }}
{{ _self.makeBgColorOptions('header', '.sm-menu > ul > li > .sub-menu li .sm-nav-header')}}
{{ _self.makeColorPicker('divider_color', '.sm-menu > ul > li > .sub-menu li .sm-nav-divider', 'border-color') }}
{% endif %}