<div class="uk-width-1-5@xl uk-width-1-3@m uk-width-1-1">
    <%# DESKTOP %>
    <div class="sidebar uk-visible@m" uk-height-viewport="offset-top: true">
        <h2 class="uk-text-center uk-margin-remove-bottom uk-margin-remove-top uk-padding">Wiki</h2>

        <div class="uk-overflow-auto uk-margin-left" style="max-height: calc(100vh - 80px - 121px);" id="wiki-nav">
            <h4>General</h4>
            <hr class="esm-border-color-blue">
            <ul class="uk-list uk-visible@s sidebar-items">
                <%= link_to wiki_path, id: "link-wiki" do %>
                    <li class="<%= "selected" if action_name == "index" %>">
                        Getting Started
                    </li>
                <% end %>

                <%= link_to wiki_commands_path, id: "commands-link" do %>
                    <li class="<%= "selected" if action_name == "commands" %>">
                        Commands
                    </li>
                <% end %>
            </ul>

            <h4>How To <small>(Server)</small></h4>
            <hr class="esm-border-color-blue">
            <ul class="uk-list uk-visible@s sidebar-items">
                <%= link_to wiki_gambling_path, id: "link-gambling" do %>
                    <li class="<%= "selected" if action_name == "gambling" %>">
                        Gambling
                    </li>
                <% end %>

                <%= link_to wiki_notification_configuration_path, id: "link-notification_configuration"  do %>
                    <li class="<%= "selected" if action_name == "notification_configuration" %>">
                        Notifications
                    </li>
                <% end %>

                <%= link_to wiki_server_xm8_notification_routing_path, id: "link-admin_xm8_routing"  do %>
                    <li class="<%= "selected" if action_name == "server_xm8_notification_routing" %>">
                        XM8 Notification Routing
                    </li>
                <% end %>
            </ul>

            <h4>How To <small>(Player)</small></h4>
            <hr class="esm-border-color-blue">
            <ul class="uk-list uk-visible@s sidebar-items">
                <%= link_to wiki_player_xm8_notification_routing_path, id: "link-player_xm8_routing"  do %>
                    <li class="<%= "selected" if action_name == "player_xm8_notification_routing" %>">
                        XM8 Notification Routing
                    </li>
                <% end %>
            </ul>

            <h4>Changelogs</h4>
            <hr class="esm-border-color-blue">
            <ul class="uk-list uk-visible@s sidebar-items">
                <% WikiController::CHANGELOG_ENTRIES.each do |date| %>
                    <%= link_to wiki_changelog_path(date: date), id: "link-#{date}" do %>
                        <li class="<%= "selected" if @changelog == date %>">
                            <%= date %>
                        </li>
                    <% end %>
                <% end %>
            </ul>

            <h4>API</h4>
            <hr class="esm-border-color-blue">
            <ul class="uk-list uk-visible@s sidebar-items">
                <% WikiController::API_ENTRIES.each do |entry| %>
                    <%= link_to wiki_api_path(function: entry), id: "link-#{entry}" do %>
                        <li class="<%= "selected" if @function == entry %>">
                            ESM_<%= entry %>
                        </li>
                    <% end %>
                <% end %>
            </ul>

            <h4>Legal</h4>
            <hr class="esm-border-color-blue">
            <ul class="uk-list uk-visible@s sidebar-items">
                <%= link_to wiki_tos_path, id: "link-tos" do %>
                    <li class="<%= "selected" if action_name == "tos" %>">
                        Terms of Use
                    </li>
                <% end %>

                <%= link_to wiki_privacy_path, id: "link-privacy" do %>
                    <li class="<%= "selected" if action_name == "privacy" %>">
                        Privacy Policy
                    </li>
                <% end %>
            </ul>
        </div>
    </div>

    <%# MOBILE %>
    <div class="uk-hidden@m uk-container uk-margin-top">
        <h2 class="uk-text-center">Wiki</h2>
        <ul class="uk-list uk-text-center">
            <li class="<%= action_name == "index" ? "uk-active" : "" %>"><%= link_to "Getting Started", wiki_path %></li>
            <li class="<%= action_name == "commands" ? "uk-active" : "" %>"><%= link_to "Commands", wiki_commands_path %></li>
            <li class="<%= action_name == "notification_configuration" ? "uk-active" : "" %>"><%= link_to "Notification Configuration", wiki_notification_configuration_path %></li>
            <li class="<%= action_name == "gambling" ? "uk-active" : "" %>"><%= link_to "Gambling", wiki_gambling_path %></li>
            <li class="<%= action_name == "api" ? "uk-active" : "" %>"><%= link_to "API", wiki_api_path %></li>
            <li class="<%= action_name == "tos" ? "uk-active" : "" %>"><%= link_to "Terms of Service", wiki_tos_path %></li>
            <li class="<%= action_name == "privacy" ? "uk-active" : "" %>"><%= link_to "Privacy Policy", wiki_privacy_path %></li>
        </ul>
        <% if action_name == "api" %>
            <select class="uk-select uk-margin api-switcher">
                <% WikiController::API_ENTRIES.each do |entry| %>
                    <option value="<%= wiki_api_path(function: entry) %>" <%= "selected" if @function == entry %>>
                        <%= entry %>
                    </option>
                <% end %>
            </select>
        <% end %>
    </div>
</div>