dashboard.html.erb

<div class="container dashboard">
  <div class="row">
    <%# Topics %>
    <div class="col-lg-8">
      <%= render partial: "dashboard_v2/blog"%>
      <%= render partial: "dashboard_v2/alerts"%>
      <%= render partial: "dashboard_v2/topicCard"%>
      <%# Additional Topics %>
      <div class="other-topics">
        <p><small>
          <i class="form-grey"><%= translation('dashboard_v2.sidebar.interest_topics', :url => '/subscriptions')%></i>
        </small></p>
        <%# Featured topics %>
        <small><a href="/tags" class="form-grey"><%= translation('dashboard_v2.sidebar.featured_topics') %>:</a></small>
        <span>
          <%= feature('feature-tags') %>
          <small class="text-format form-grey" style="text-decoration: underline"><%= translation('dashboard_v2.sidebar.more_topics',:url => '/wiki/topics') %> </small>
        </span>
        <br/>
        <%# Trending topics %>
        <small><a href="/tags" class="form-grey"><%= translation('dashboard_v2.sidebar.trending_topics') %>:</a></small>
        <span>
         <% cache('trending-tags', expires_in: 24.hours, skip_digest: true) do %>
              <% @trending_tags.each do |i| %>
                  <a href="/tag/<%= i.name %>" class="badge badge-primary"><%= i.name %></a>
              <% end %>
            <% end %>
          <small class="text-format form-grey" style="text-decoration: underline"><%= translation('dashboard_v2.sidebar.more_topics',:url => '/tags') %> </small>
        </span>
      </div>
      <div class="dashboard-topics-footer">
        <%= feature('dashboard-topics-footer') %>
      </div>
    </div>
    <%# Sidebar %>
    <div class="col-lg-4">
      <%# Admin feature %>
      <%= feature('dashboard-feature') %>
      <%= render partial: "dashboard_v2/sidebar"%>
    </div>
  </div>
</div>

<style>

  .dashboard .img {
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
  }

  .dashboard .blog-caption {
    background: rgba(255, 255, 255, 0.8);
    padding: 16px 10px 6px;
  }

  .dashboard .other-topics h4 i {
    font-style: normal;
    font-size: small;
    display: inline-block;
    position: relative;
    margin-left: 201px;
  }

  .dashboard .other-topics h4 i:after,
  .dashboard .other-topics h4 i:before {
    content: "";
    position: absolute;
    height: 12px;
    border-bottom: 1px solid #888;
    top: 0;

  }

  .dashboard .other-topics h4 i:before {
    right: 100%;
    margin-right: 15px;
    width: 186px;
  }

  .dashboard .other-topics h4 i:after {
    left: 100%;
    margin-left: 15px;
    width: 231px;
  }

  .dashboard .dashboard a:hover {
    text-decoration: none;
    color: #505050;
  }

  /* Small devices and tablets*/
  @media (max-width: 1366px){
    .dashboard .other-topics h4 i {
      margin-left: 21px;
      font-size: 10px;
    }

    .dashboard .other-topics h4 i:before,
    .dashboard .other-topics h4 i:after {
      width: 12px;
      margin-right: 3px;
      margin-left: 3px;
    }
  }

</style>