-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #129 from oarepo/header-component
Header component
- Loading branch information
Showing
25 changed files
with
991 additions
and
336 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| i18n: | ||
| babel_output_translations: oarepo_ui/translations | ||
| babel_source_paths: | ||
| - oarepo_ui | ||
| i18next_output_translations: oarepo_ui/theme/assets/semantic-ui/translations/oarepo_ui | ||
| i18next_source_paths: | ||
| - oarepo_ui/theme/assets/semantic-ui/js | ||
| languages: | ||
| - cs | ||
| - en |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| {# def search_link="/search" #} | ||
| <div class="item p-0 search-bar"> | ||
| <div id="header-search-bar"> | ||
| <form action="{{ search_link }}" class="ui form" role="search"> | ||
| <div class="ui fluid action input"> | ||
| <input type="text" name="q" class="form-control" placeholder="{{ _('Search') }}"> | ||
| <button type="submit" class="ui icon search button" aria-label="{{ _('Search') }}"><i class="search icon"></i></button> | ||
| </div> | ||
| </form> | ||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,17 +1,46 @@ | ||
| <footer id="footer"> | ||
| {# Copyright (C) 2019-2020 CERN. Copyright (C) 2019-2020 Northwestern | ||
| University. Copyright (C) 2021 Graz University of Technology. Invenio App RDM is | ||
| free software; you can redistribute it and/or modify it under the terms of the | ||
| MIT License; see LICENSE file for more details. #} | ||
|
|
||
| <footer class="ui page-footer"> | ||
| <div id="nr-footer-container"> | ||
| <div class="ui container"> | ||
| <div class="ui divider"></div> | ||
| </div> | ||
| <div class="ui grid container"> | ||
| <div class="eight wide column"> | ||
| {% trans link="http://inveniosoftware.org" %}Powered by | ||
| <a href="{{ link }}">Invenio</a>{% endtrans %} | ||
| </div> | ||
| <div class="eight wide column right aligned"> | ||
| {%- if config.I18N_LANGUAGES %} | ||
| {% from "invenio_i18n/macros/language_selector.html" import language_selector_dropdown %} | ||
| {{ language_selector_dropdown() }} | ||
| {%- endif %} | ||
| <div class="ui middle aligned grid"> | ||
| <div class="two column row center aligned footer-top"> | ||
| {%- block footer_top %} | ||
| <div class="eight wide column left aligned"> | ||
| {%- block footer_top_left %} | ||
| <p class="margin-small"> | ||
| <span class="ui small header">{{_("Contact")}}: </span> | ||
| <i class="envelope icon"></i> | ||
| <a href="mailto:[email protected]">[email protected]</a> | ||
| </p> | ||
| {%- endblock footer_top_left -%} | ||
| </div> | ||
| <div class="eight wide column right aligned center"> | ||
| {%- block footer_top_right %} {%- if config.I18N_LANGUAGES %} {% | ||
| from "invenio_i18n/macros/language_selector.html" import | ||
| language_selector_dropdown %} {{ language_selector_dropdown() }} {%- | ||
| endif %} {%- endblock footer_top_right %} | ||
| </div> | ||
| {%- endblock footer_top %} | ||
| </div> | ||
|
|
||
| <div class="two column row footer-bottom"> | ||
| {%- block footer_bottom %} | ||
| <div class="eight wide column left middle aligned"> | ||
| {%- block footer_bottom_left %} {% trans | ||
| link="http://inveniosoftware.org" %}Powered by | ||
| <a href="{{ link }}">Invenio</a>{% endtrans %} {%- endblock | ||
| footer_bottom_left %} | ||
| </div> | ||
| <div class="eight wide column right aligned"> | ||
| {%- block footer_bottom_right %} {%- endblock footer_bottom_right %} | ||
| </div> | ||
| {%- endblock footer_bottom %} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </footer> | ||
| </div> | ||
| </footer> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,140 +1,138 @@ | ||
|
|
||
| {# | ||
| -*- coding: utf-8 -*- | ||
| Copyright (C) 2019-2020 CERN. | ||
| Copyright (C) 2019-2020 Northwestern University. | ||
| Copyright (C) 2021 New York University. | ||
| -*- coding: utf-8 -*- | ||
| Copyright (C) 2019-2020 CERN. | ||
| Copyright (C) 2019-2020 Northwestern University. | ||
| Copyright (C) 2021 New York University. | ||
|
|
||
| Invenio App RDM is free software; you can redistribute it and/or modify it | ||
| under the terms of the MIT License; see LICENSE file for more details. | ||
| Invenio App RDM is free software; you can redistribute it and/or modify it | ||
| under the terms of the MIT License; see LICENSE file for more details. | ||
| #} | ||
| <div> | ||
| <header class="theme header"> | ||
| {%- block site_banner %} | ||
| {%- endblock site_banner %} | ||
| <div class="outer-navbar"> | ||
| {%- block banner %} | ||
| {# TODO: add support for user banners {% from 'invenio_banners/banner.html' import banner %} {{ banner() }} #} | ||
| {%- endblock banner %} | ||
| {%- block navbar %} | ||
| <div class="ui container invenio-header-container"> | ||
| <nav id="invenio-nav" class="ui menu shadowless borderless stackable p-0 pt-10 pb-10"> | ||
|
|
||
| {# Main Site logo #} | ||
| <div class="item logo p-0"> | ||
| {%- block navbar_header %} | ||
| {%- block brand %} | ||
| {%- if config.THEME_LOGO %} | ||
| <a class="logo-link" href="/"> | ||
| <img class="ui image" | ||
| src="{{ url_for('static', filename=config.THEME_LOGO) }}" | ||
| alt="{{ _(config.THEME_SITENAME) }}"/> | ||
| </a> | ||
| {%- else %} | ||
| <a class="logo" href="/">{{ _(config.THEME_SITENAME) }}</a> | ||
| {%- endif %} | ||
| {%- endblock brand %} | ||
| {%- endblock navbar_header %} | ||
| </div> | ||
| <header class="ui page-header"> | ||
| {%- block site_banner %} | ||
| {%- endblock site_banner %} | ||
| <div class="outer-navbar"> | ||
| {%- block banner %} | ||
| {# TODO: add support for user banners {% from 'invenio_banners/banner.html' import banner %} {{ banner() }} #} | ||
| {%- endblock banner %} | ||
| {%- block navbar %} | ||
| <div class="ui container invenio-header-container"> | ||
| <nav id="invenio-nav" class="ui menu shadowless borderless stackable p-0"> | ||
|
|
||
| {# Main Site logo #} | ||
| <div class="item logo p-0"> | ||
| {%- block navbar_header %} | ||
| {%- block brand %} | ||
| {%- if config.THEME_LOGO %} | ||
| <a class="logo-link" href="/"> | ||
| <img class="ui image" | ||
| src="{{ url_for('static', filename=config.THEME_LOGO) }}" | ||
| alt="{{ _(config.THEME_SITENAME) }}"/> | ||
| </a> | ||
| {%- else %} | ||
| <a class="logo" href="/">{{ _(config.THEME_SITENAME) }}</a> | ||
| {%- endif %} | ||
| {%- endblock brand %} | ||
| {%- endblock navbar_header %} | ||
| </div> | ||
|
|
||
| {# Burger menu toggle for mobile menu #} | ||
| <div id="invenio-burger-toggle"> | ||
| <button | ||
| id="invenio-burger-menu-icon" | ||
| class="ui button transparent" | ||
| aria-label="{{ _('Menu') }}" | ||
| aria-haspopup="menu" | ||
| aria-expanded="false" | ||
| aria-controls="invenio-menu" | ||
| > | ||
| <span class="navicon"></span> | ||
| </button> | ||
| </div> | ||
| {# Burger menu toggle for mobile menu #} | ||
| <div id="invenio-burger-toggle"> | ||
| <button | ||
| id="invenio-burger-menu-icon" | ||
| class="ui button transparent" | ||
| aria-label="{{ _('Menu') }}" | ||
| aria-haspopup="menu" | ||
| aria-expanded="false" | ||
| aria-controls="invenio-menu" | ||
| > | ||
| <span class="navicon"></span> | ||
| </button> | ||
| </div> | ||
|
|
||
| {# Main menu #} | ||
| <div | ||
| role="menu" | ||
| id="invenio-menu" | ||
| aria-labelledby="invenio-burger-menu-icon" | ||
| class="ui fluid menu borderless mobile-hidden" | ||
| > | ||
| <button | ||
| id="invenio-close-burger-menu-icon" | ||
| class="ui button transparent" | ||
| aria-label="{{ _('Close menu') }}" | ||
| > | ||
| <span class="navicon"></span> | ||
| </button> | ||
| {# Main menu #} | ||
| <div | ||
| role="menu" | ||
| id="invenio-menu" | ||
| aria-labelledby="invenio-burger-menu-icon" | ||
| class="ui fluid menu borderless mobile-hidden" | ||
| > | ||
| <button | ||
| id="invenio-close-burger-menu-icon" | ||
| class="ui button transparent" | ||
| aria-label="{{ _('Close menu') }}" | ||
| > | ||
| <span class="navicon"></span> | ||
| </button> | ||
|
|
||
| {%- if config.THEME_SEARCHBAR %} | ||
| {%- block navbar_search %} | ||
| {%- include config.THEME_SEARCHBAR_TEMPLATE %} | ||
| {%- endblock navbar_search %} | ||
| {# Search bar #} | ||
| {%- block navbar_search %} | ||
| <Searchbar/> | ||
| {%- endblock navbar_search %} | ||
|
|
||
| {# Navigation links #} | ||
| {%- block navbar_nav %} | ||
| {# | ||
| {%- for item in current_menu.submenu('main').children|sort(attribute='order') if item.visible recursive %} | ||
| {%- if item.children %} | ||
| <div class="item"> | ||
| <div class="dropdown {{ ' active' if item.active else '' }}"> | ||
| <a role="menuitem" | ||
| class="dropdown-toggle" | ||
| data-toggle="dropdown" | ||
| aria-haspopup="true" | ||
| aria-expanded="false" | ||
| href="{{ item.url }}" | ||
| > | ||
| {{ item.text|safe }} | ||
| <b class="caret"></b> | ||
| </a> | ||
| <ul class="dropdown-menu">{{ loop(item.children|sort(attribute='order')) }}</ul> | ||
| </div> | ||
| </div> | ||
| {%- else %} | ||
| <div class="{{' item main-nav-links active' if item.active and loop.depth == 0 else ' item main-nav-links' }}"> | ||
| <a role="menuitem" href="{{ item.url }}">{{ item.text|safe }}</a> | ||
| </div> | ||
| {%- endif %} | ||
| {%- endfor %} | ||
|
|
||
| {% for item in current_menu.submenu('actions').children|sort(attribute='order') if item.visible recursive %} | ||
| <div class="item"> | ||
| <a role="menuitem" href="{{ item.url }}">{{ item.text|safe }}</a> | ||
| </div> | ||
| {% endfor %} | ||
| #} | ||
| {%- endblock navbar_nav %} | ||
|
|
||
| {# Navigation links #} | ||
| {%- block navbar_nav %} | ||
| {# TODO: uncomment for communities, requests & more | ||
| {%- for item in current_menu.submenu('main').children|sort(attribute='order') if item.visible recursive %} | ||
| {%- if item.children %} | ||
| <div class="item"> | ||
| <div class="dropdown {{ ' active' if item.active else '' }}"> | ||
| <a role="menuitem" | ||
| class="dropdown-toggle" | ||
| data-toggle="dropdown" | ||
| aria-haspopup="true" | ||
| aria-expanded="false" | ||
| href="{{ item.url }}" | ||
| > | ||
| {{ item.text|safe }} | ||
| <b class="caret"></b> | ||
| </a> | ||
| <ul class="dropdown-menu">{{ loop(item.children|sort(attribute='order')) }}</ul> | ||
| </div> | ||
| </div> | ||
| {%- else %} | ||
| <div class="{{' item active' if item.active and loop.depth == 0 else ' item' }}"> | ||
| <a role="menuitem" href="{{ item.url }}">{{ item.text|safe }}</a> | ||
| </div> | ||
| {%- endif %} | ||
| {%- endfor %} | ||
| #} | ||
|
|
||
| {% for item in current_menu.submenu('actions').children|sort(attribute='order') if item.visible recursive %} | ||
| <div class="item"> | ||
| <a role="menuitem" href="{{ item.url }}">{{ item.text|safe }}</a> | ||
| {# User Account menu #} | ||
| {%- block navbar_right %} | ||
| <div class="right menu item"> | ||
| {%- if config.ACCOUNTS and current_user.is_authenticated %} | ||
| {% for item in current_menu.submenu('notifications').children|sort(attribute='order') if item.visible recursive %} | ||
| <div class="item inbox"> | ||
| <a role="menuitem" href="{{ item.url }}" aria-label="{{ _('Requests') }}"> | ||
| <i class="fitted inbox icon inverted"></i> | ||
| <span class="mobile tablet only inline">{{ _("Inbox") }}</span> | ||
| </a> | ||
| </div> | ||
| {% endfor %} | ||
| {%- endblock navbar_nav %} | ||
|
|
||
| {# User Account menu #} | ||
| {%- block navbar_right %} | ||
| <div class="right menu item"> | ||
| {%- if config.ACCOUNTS and current_user.is_authenticated %} | ||
| {% for item in current_menu.submenu('notifications').children|sort(attribute='order') if item.visible recursive %} | ||
| <div class="item inbox"> | ||
| <a role="menuitem" href="{{ item.url }}" aria-label="{{ _('Requests') }}"> | ||
| <i class="fitted inbox icon inverted"></i> | ||
| <span class="mobile tablet only inline">{{ _("Inbox") }}</span> | ||
| </a> | ||
| </div> | ||
| {% endfor %} | ||
| {% endif %} | ||
| {%- include config.THEME_HEADER_LOGIN_TEMPLATE %} | ||
| </div> | ||
| {%- endblock navbar_right %} | ||
| {% endif %} | ||
| {%- include "oarepo_ui/header_login.html" %} | ||
| </div> | ||
| </nav> | ||
| {%- endblock navbar_right %} | ||
| </div> | ||
| {%- endblock navbar %} | ||
|
|
||
| {%- block flashmessages %} | ||
| {%- from "invenio_theme/macros/messages.html" import flashed_messages with context -%} | ||
| {{ flashed_messages() }} | ||
| {%- endblock %} | ||
| </nav> | ||
| </div> | ||
| </header> | ||
| {%- endblock navbar %} | ||
|
|
||
| {%- block flashmessages %} | ||
| {%- from "invenio_theme/macros/messages.html" import flashed_messages with context -%} | ||
| {{ flashed_messages() }} | ||
| {%- endblock %} | ||
| </div> | ||
| </header> | ||
|
|
||
| {%- block breadcrumbs %} | ||
| {%- endblock breadcrumbs %} | ||
| </div> | ||
| {%- block breadcrumbs %} | ||
| {%- endblock breadcrumbs %} |
Oops, something went wrong.