<commit_before><link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="../../bower_components/paper-styles/typography.html">
<link rel="import" href="../../bower_components/paper-styles/color.html">
<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="../../bower_components/paper-input/paper-input.html">

<link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout-classes.html">

<dom-module id="home-side-menu">
  <template>
    <style include="shared-styles iron-flex iron-flex-alignment">

      :host {
        display: block;
      }

      paper-menu {

        padding-top: 0px;

        --paper-menu-selected-item: {
          color: var(--primary-color);
        }

        --paper-menu-focused-item-after: {
          background: var(--primary-color);
        }
      }

      paper-menu iron-icon {
        margin-right: 33px;
        opacity: 0.54;
      }

      paper-menu a {
        @apply(--layout-horizontal);
        @apply(--layout-center);

        text-decoration: none;
        color: var(--menu-link-color);
        font-family: 'Roboto', 'Noto', sans-serif;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        min-height: 48px;
        padding: 0 16px;
      }

      paper-dialog {
        margin-left: 20px;
        margin-right: 20px;
        padding-left: 20px;
        padding-right: 20px;
      }

    </style>

    <paper-menu class="app-menu" attr-for-selected="data-route" selected="[[route]]">

      <iron-image style="width:100%; --iron-image-width:100%; height:250px; background-color:lightgray;"
        sizing="cover" preload fade src="http://lorempixel.com/250/200"></iron-image>

      <!-- <a data-route="home" href="{{baseUrl}}">
        <iron-icon icon="home"></iron-icon>
        <span>Home</span>
      </a> -->

      <a data-route="most-recent-photos" href="{{baseUrl}}most-recent-photos">
        <iron-icon icon="dashboard"></iron-icon>
        <span>Most Recent Photos</span>
      </a>

      <a data-route="top-rated-photos" href="{{baseUrl}}top-rated-photos">
        <iron-icon icon="favorite"></iron-icon>
        <span>Top Rated Photos</span>
      </a>

      <a data-route="popular-shops" href="{{baseUrl}}popular-shops">
        <iron-icon icon="store"></iron-icon>
        <span>Popular Shops</span>
      </a>

      <hr>

      <a id="profileLink">
        <iron-icon icon="social:person"></iron-icon><commit_msg>Remove side profile photo for now.<commit_after><link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="../../bower_components/paper-styles/typography.html">
<link rel="import" href="../../bower_components/paper-styles/color.html">
<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="../../bower_components/paper-input/paper-input.html">

<link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout-classes.html">

<dom-module id="home-side-menu">
  <template>
    <style include="shared-styles iron-flex iron-flex-alignment">

      :host {
        display: block;
      }

      paper-menu {

        padding-top: 0px;

        --paper-menu-selected-item: {
          color: var(--primary-color);
        }

        --paper-menu-focused-item-after: {
          background: var(--primary-color);
        }
      }

      paper-menu iron-icon {
        margin-right: 33px;
        opacity: 0.54;
      }

      paper-menu a {
        @apply(--layout-horizontal);
        @apply(--layout-center);

        text-decoration: none;
        color: var(--menu-link-color);
        font-family: 'Roboto', 'Noto', sans-serif;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        min-height: 48px;
        padding: 0 16px;
      }

      paper-dialog {
        margin-left: 20px;
        margin-right: 20px;
        padding-left: 20px;
        padding-right: 20px;
      }

    </style>

    <paper-menu class="app-menu" attr-for-selected="data-route" selected="[[route]]">

      <!-- <iron-image style="width:100%; --iron-image-width:100%; height:250px; background-color:lightgray;"
        sizing="cover" preload fade src="http://lorempixel.com/250/200"></iron-image> -->

      <!-- <a data-route="home" href="{{baseUrl}}">
        <iron-icon icon="home"></iron-icon>
        <span>Home</span>
      </a> -->

      <a data-route="most-recent-photos" href="{{baseUrl}}most-recent-photos">
        <iron-icon icon="dashboard"></iron-icon>
        <span>Most Recent Photos</span>
      </a>

      <a data-route="top-rated-photos" href="{{baseUrl}}top-rated-photos">
        <iron-icon icon="favorite"></iron-icon>
        <span>Top Rated Photos</span>
      </a>

      <a data-route="popular-shops" href="{{baseUrl}}popular-shops">
        <iron-icon icon="store"></iron-icon>
        <span>Popular Shops</span>
      </a>

      <hr>

      <a id="profileLink">
        <iron-icon icon="social:person"></iron-icon>
{'fraction_non_alphanumeric': 0.18582445831803157, 'fraction_numerical': 0.015056922511935366, 'mean_word_length': 2.3895457373988798, 'pattern_counts': {'":': 0, '<': 90, '<?xml version=': 0, '>': 90, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '926528', 'n_tokens_mistral': 1849, 'n_tokens_neox': 1710, 'n_words': 272}