(fix) wrong tabs behavior

pull/2020/head
Gabriel Rodriguez Alsina 6 years ago
parent 56f505741f
commit 5676c1462a
  1. 6
      apps/block_scout_web/assets/css/app.scss
  2. 19
      apps/block_scout_web/assets/js/lib/card_tabs.js
  3. 2
      apps/block_scout_web/lib/block_scout_web/templates/address/_tabs.html.eex
  4. 2
      apps/block_scout_web/lib/block_scout_web/templates/block_transaction/index.html.eex
  5. 2
      apps/block_scout_web/lib/block_scout_web/templates/tokens/overview/_tabs.html.eex
  6. 2
      apps/block_scout_web/lib/block_scout_web/templates/transaction/_tabs.html.eex

@ -123,9 +123,9 @@ $fa-font-path: "~@fortawesome/fontawesome-free/webfonts";
@import "components/errors"; @import "components/errors";
:export { :export {
primary: $primary; dashboardBannerChartAxisFontColor: $dashboard-banner-chart-axis-font-color;
secondary: $secondary;
dashboardLineColorMarket: $dashboard-line-color-market; dashboardLineColorMarket: $dashboard-line-color-market;
dashboardLineColorPrice: $dashboard-line-color-price; dashboardLineColorPrice: $dashboard-line-color-price;
dashboardBannerChartAxisFontColor: $dashboard-banner-chart-axis-font-color; primary: $primary;
secondary: $secondary;
} }

@ -1,21 +1,26 @@
import $ from 'jquery' import $ from 'jquery'
$(function () { $(function () {
const activeTabCard = $('.card-tab.active') const tabCards = $('.js-card-tabs')
const activeTabCard = tabCards.find('.active')
const isMobileCardTabs = tabCards.children(':hidden').length
const isOnlyChild = !activeTabCard.siblings().length
if (!activeTabCard.siblings().length) { if (isOnlyChild) {
activeTabCard.addClass('noCaret') activeTabCard.addClass('noCaret')
} }
activeTabCard.on('click', function (e) { activeTabCard.on('click', function (e) {
e.preventDefault() e.preventDefault()
const siblings = $(this).siblings() if (isMobileCardTabs) {
const siblings = $(this).siblings()
if (siblings.is(':hidden')) { if (siblings.is(':hidden')) {
siblings.show() siblings.show()
} else { } else {
siblings.hide() siblings.hide()
}
} }
}) })
}) })

@ -1,4 +1,4 @@
<div class="card-tabs"> <div class="card-tabs js-card-tabs">
<%= link( <%= link(
gettext("Transactions"), gettext("Transactions"),
class: "card-tab #{tab_status("transactions", @conn.request_path)}", class: "card-tab #{tab_status("transactions", @conn.request_path)}",

@ -4,7 +4,7 @@
<section> <section>
<div class="card mb-3"> <div class="card mb-3">
<div class="card-tabs"> <div class="card-tabs js-card-tabs">
<%= <%=
link( link(
gettext("Transactions"), gettext("Transactions"),

@ -1,4 +1,4 @@
<div class="card-tabs"> <div class="card-tabs js-card-tabs">
<%= link( <%= link(
gettext("Token Transfers"), gettext("Token Transfers"),
class: "card-tab #{tab_status("token_transfers", @conn.request_path)}", class: "card-tab #{tab_status("token_transfers", @conn.request_path)}",

@ -1,4 +1,4 @@
<div class="card-tabs"> <div class="card-tabs js-card-tabs">
<%= if @show_token_transfers do %> <%= if @show_token_transfers do %>
<%= link( <%= link(
gettext("Token Transfers"), gettext("Token Transfers"),

Loading…
Cancel
Save