<div>

    <section class="heading b-b">
        <div class="row no-gutter">
            <div class="col-xs-2 col-sm-2 col-md-1">
                <section class="heading-btn">
                    <a ng-click="backPrevLocation($event)"><i class="fas fa-long-arrow-alt-left "></i></a>
                </section>
            </div>
            <div class="col-xs-10 col-sm-10 col-md-7 b-l b-r-md">
                <section class="heading-title">
                    <h1>{{ space.name }}</h1>
                </section>
            </div>

            <div class="col-xs-12 col-sm-12 col-md-4 b-t hide-b-md">
                <section class="heading-actions wrapper">
                    <a ng-click="reserveSpace($event)" class="btn btn-lg btn-warning bg-white b-2x rounded m-t-xs" ng-if="!isAuthorized('admin')" translate>{{ 'app.public.space_show.book_this_space' }}</a>

                    <a ui-sref="app.admin.space_edit({id:space.slug})" ng-if="isAuthorized('admin')" class="btn btn-lg btn-warning bg-white b-2x rounded m-t-xs"><i class="fa fa-edit"></i> {{ 'app.shared.buttons.edit' | translate }}</a>
                    <a ng-click="deleteSpace($event)" ng-if="isAuthorized('admin')" class="btn btn-lg btn-danger b-2x rounded no-b m-t-xs"><i class="fa fa-trash-o"></i></a>

                </section>
            </div>
        </div>
    </section>

    <div class="row no-gutter">
        <div class="col-sm-12 col-md-12 col-lg-8 b-r-lg">

            <div class="article wrapper-lg">

                <div class="article-thumbnail" ng-if="space.space_image_attributes">
                    <img ng-src="{{space.space_image_attributes.attachment_url}}" alt="{{space.name}}" class="img-responsive">
                </div>

                <p class="intro" ng-bind-html="space.description | toTrusted"></p>

            </div>

        </div>

        <div class="col-sm-12 col-md-12 col-lg-4">
            <div class="spaces-relations m" ng-show="space.parent || space.children.length || space.machines.length">
              <p ng-show="space.parent" class="space-parent">{{ space.parent.name }}</p>
              <div class="space-current" ng-class="{'has-parent': space.parent}">
                <span class="space-current-name">
                  <svg viewBox="0 0 24 24" width="3rem">
                    <use href="../../images/icons.svg#pin-map"/>
                  </svg>
                  {{ space.name }}
                </span>
              </div>
              <ul ng-show="space.machines.length" class="related-machines">
                <li ng-repeat="machine in space.machines" class="">{{ machine.name }}</li>
              </ul>
              <ul ng-show="space.children.length" class="related-spaces">
                <li ng-repeat="child_space in space.children" class="">{{ child_space.name }}</li>
              </ul>
            </div>

            <div class="widget panel b-a m m-t-lg" ng-show="space.characteristics">
                <div class="panel-heading b-b small">
                    <h3 translate>{{ 'app.public.space_show.characteristics' }}</h3>
                </div>
                <div class="widget-content no-bg wrapper">
                    <h3></h3>
                    <p ng-bind-html="space.characteristics | toTrusted"></p>
                </div>
            </div>

            <section class="widget panel b-a m" ng-if="space.space_files_attributes">
                <div class="panel-heading b-b">
                    <span class="badge bg-warning pull-right">{{space.space_files_attributes.length}}</span>
                    <h3 translate>{{ 'app.public.space_show.files_to_download' }}</h3>
                </div>

                <ul class="widget-content list-group list-group-lg no-bg auto">
                    <li ng-repeat="file in space.space_files_attributes" class="list-group-item no-b clearfix">
                        <a target="_blank" ng-href="{{file.attachment_url}}"><i class="fa fa-arrow-circle-o-down"> </i> {{file.attachment_name | humanize : 25}}</a>
                    </li>
                </ul>
            </section>

            <section class="widget panel b-a m" ng-if="space.space_projects">
                <div class="panel-heading b-b">
                    <h3 translate>{{ 'app.public.space_show.projects_using_the_space' }}</h3>
                </div>

                <ul class="widget-content list-group list-group-lg no-bg auto">
                    <li ng-repeat="project in space.space_projects" class="list-group-item no-b clearfix">
                        <a ui-sref="app.public.projects_show({id:project.slug})"><i class="fa"> </i> {{project.name}}</a>
                    </li>
                </ul>
            </section>

        </div>


    </div>

</div>