mirror of
https://github.com/wallabag/wallabag.git
synced 2025-03-13 22:52:39 +00:00
Extract Materialize Tooltip controller
This commit is contained in:
Yassine Guedidi
parent
b0f1a32e3c
commit
db9dab054c
5 changed files with 28 additions and 17 deletions
12
assets/controllers/materialize/tooltip_controller.js
Normal file
12
assets/controllers/materialize/tooltip_controller.js
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { Controller } from '@hotwired/stimulus';
|
||||
import M from '@materializecss/materialize';
|
||||
|
||||
export default class extends Controller {
|
||||
connect() {
|
||||
this.instance = M.Tooltip.init(this.element);
|
||||
}
|
||||
|
||||
disconnect() {
|
||||
this.instance.destroy();
|
||||
}
|
||||
}
|
||||
|
|
@ -285,7 +285,6 @@ $(document).ready(() => {
|
|||
constrainWidth: false,
|
||||
});
|
||||
|
||||
$('.tooltipped').tooltip();
|
||||
$('.fixed-action-btn').floatingActionButton();
|
||||
|
||||
stickyNav();
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@
|
|||
{{ form_label(form.config.items_per_page) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_items_per_page'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_items_per_page'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
{{ form_label(form.config.display_thumbnails, null, {'label_attr': {'class': 'settings-checkbox-label'}}) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_display_thumbnails'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_display_thumbnails'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
</p>
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_reading_speed'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_reading_speed'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
{{ form_label(form.config.language) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_language'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_language'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -100,7 +100,7 @@
|
|||
</p>
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_pocket_consumer_key'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_pocket_consumer_key'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -123,7 +123,7 @@
|
|||
{{ form_label(form.config.font) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_font'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_font'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -134,7 +134,7 @@
|
|||
{{ form_label(form.config.lineHeight, null, {'label_attr': {'class': 'settings-range-label'}}) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_lineheight'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_lineheight'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -147,7 +147,7 @@
|
|||
{{ form_label(form.config.fontsize, null, {'label_attr': {'class': 'settings-range-label'}}) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_fontsize'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_fontsize'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -158,7 +158,7 @@
|
|||
{{ form_label(form.config.maxWidth, null, {'label_attr': {'class': 'settings-range-label'}}) }}
|
||||
</div>
|
||||
<div class="input-field col s1">
|
||||
<a href="#" class="tooltipped" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_maxwidth'|trans }}">
|
||||
<a href="#" data-controller="materialize--tooltip" data-position="left" data-delay="50" data-tooltip="{{ 'config.form_settings.help_maxwidth'|trans }}">
|
||||
<i class="material-icons">live_help</i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -24,21 +24,21 @@
|
|||
{% block nav_panel_extra_actions %}
|
||||
{% if active_route %}
|
||||
<li>
|
||||
<a class="waves-effect tooltipped js-random-action" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.random_entry'|trans }}" href="{{ path('random_entry', {'type': active_route}) }}">
|
||||
<a class="waves-effect js-random-action" data-controller="materialize--tooltip" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.random_entry'|trans }}" href="{{ path('random_entry', {'type': active_route}) }}">
|
||||
<i class="material-icons">casino</i>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if has_filters %}
|
||||
<li class="button-filters">
|
||||
<a class="nav-panel-menu sidenav-trigger tooltipped js-filters-action" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.filter_entries'|trans }}" href="#" data-target="filters">
|
||||
<a class="nav-panel-menu sidenav-trigger js-filters-action" data-controller="materialize--tooltip" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.filter_entries'|trans }}" href="#" data-target="filters">
|
||||
<i class="material-icons">filter_list</i>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if has_exports %}
|
||||
<li class="button-export">
|
||||
<a class="nav-panel-menu sidenav-trigger tooltipped js-export-action" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.export'|trans }}" href="#" data-target="export">
|
||||
<a class="nav-panel-menu sidenav-trigger js-export-action" data-controller="materialize--tooltip" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.export'|trans }}" href="#" data-target="export">
|
||||
<i class="material-icons">file_download</i>
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -61,7 +61,7 @@
|
|||
<a class="results-item" href="{{ path('switch_view_mode', {redirect: current_path}) }}"><i class="material-icons">{% if list_mode == 0 %}view_list{% else %}view_module{% endif %}</i></a>
|
||||
{% endif %}
|
||||
{% if entries.count > 0 and is_granted('EDIT_ENTRIES') %}
|
||||
<label for="mass-action-inputs-displayed" class="mass-action-toggle results-item tooltipped" data-position="right" data-delay="50" data-tooltip="{{ 'entry.list.toggle_mass_action'|trans }}"><i class="material-icons">library_add_check</i></label>
|
||||
<label for="mass-action-inputs-displayed" class="mass-action-toggle results-item" data-controller="materialize--tooltip" data-position="right" data-delay="50" data-tooltip="{{ 'entry.list.toggle_mass_action'|trans }}"><i class="material-icons">library_add_check</i></label>
|
||||
{% endif %}
|
||||
{% if app.user.config.feedToken %}
|
||||
{% include "Entry/_feed_link.html.twig" %}
|
||||
|
|
|
|||
|
|
@ -88,18 +88,18 @@
|
|||
</div>
|
||||
<ul class="input-field nav-panel-buttom">
|
||||
<li class="bold toggle-add-url-container">
|
||||
<a class="waves-effect tooltipped toggle-add-url" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.add_new_entry'|trans }}" href="{{ path('new') }}" id="nav-btn-add">
|
||||
<a class="waves-effect toggle-add-url" data-controller="materialize--tooltip" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.add_new_entry'|trans }}" href="{{ path('new') }}" id="nav-btn-add">
|
||||
<i class="material-icons">add</i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="waves-effect tooltipped" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.search'|trans }}" href="javascript: void(null);" id="nav-btn-search">
|
||||
<a class="waves-effect" data-controller="materialize--tooltip" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.search'|trans }}" href="javascript: void(null);" id="nav-btn-search">
|
||||
<i class="material-icons">search</i>
|
||||
</a>
|
||||
</li>
|
||||
{% block nav_panel_extra_actions '' %}
|
||||
<li class="bold">
|
||||
<a class="wave-effect tooltipped dropdown-trigger" data-covertrigger="false" data-constrainwidth="false" data-target="dropdown-account" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.account'|trans }}" href="#" id="news_menu">
|
||||
<a class="wave-effect dropdown-trigger" data-controller="materialize--tooltip" data-covertrigger="false" data-constrainwidth="false" data-target="dropdown-account" data-position="bottom" data-delay="50" data-tooltip="{{ 'menu.top.account'|trans }}" href="#" id="news_menu">
|
||||
<i class="material-icons" id="news_link">account_circle</i>
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
Loading…
Reference in a new issue