div.wrapper
    tg-project-menu
    div.single-project.centered
        section.single-project-intro
            .project-logo(
                href="#"
                tg-nav="project:project=project.get('slug')"
                title="{{::project.get('name')}}"
            )
                img(
                    tg-project-logo-big-src="vm.project"
                    alt="{{::vm.project.get('name')}}"
                )
            .single-project-title-wrapper
                .intro-options
                    .intro-title
                        h1
                            span.project-name {{::vm.project.get("name")}}
                        span.private(
                            ng-if="::vm.project.get('is_private')"
                            title="{{'PROJECT.PRIVATE' | translate}}"
                        )
                            svg.icon.icon-lock
                                use(xlink:href="#icon-lock")

                    div.track-buttons-container(ng-if="vm.user")
                        tg-like-project-button(project="vm.project")
                        tg-watch-project-button(project="vm.project")

                    div.track-container(ng-if="!vm.user")
                        .list-itemtype-track
                            span.list-itemtype-track-likers(
                                title="{{ 'PROJECT.LIKE_BUTTON.COUNTER_TITLE'|translate:{total:vm.project.get(\"total_fans\")||0}:'messageformat' }}"
                            )
                                svg.icon.icon-like
                                    use(xlink:href="#icon-like")
                                span {{ ::vm.project.get('total_fans') }}

                            span.list-itemtype-track-watchers(
                                title="{{ 'PROJECT.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:vm.project.get(\"total_watchers\")||0}:'messageformat' }}"
                            )
                                svg.icon.icon-watche
                                    use(xlink:href="#icon-watch")
                                span {{ ::vm.project.get('total_watchers') }}

                p.description {{vm.project.get('description')}}

        div.single-project-tags.tags-container(ng-if="::vm.project.get('tags').size")
            span.tag(
                style='border-left: 5px solid {{::tag.get("color")}};',
                tg-repeat="tag in ::vm.project.get('colorized_tags')"
            )
                span.tag-name {{::tag.get('name')}}

        div.project-data
            section.timeline(ng-if="vm.project")
                div(tg-user-timeline, projectId="vm.project.get('id')")

            section.involved-data
                .looking-for-people(ng-if="vm.project.get('is_looking_for_people')")
                    img(
                        src="/#{v}/images/looking-for-people.png"
                        title="{{'PROJECT.LOOKING_FOR_PEOPLE' | translate}}"
                    )
                    h3 {{'PROJECT.LOOKING_FOR_PEOPLE' | translate}}
                    p(ng-if="vm.project.get('looking_for_people_note')") {{::vm.project.get('looking_for_people_note')}}
                h2.title {{"PROJECT.SECTION.TEAM" | translate}}
                ul.involved-team
                    li(tg-repeat="member in vm.members")
                        a(
                            tg-nav="user-profile:username=member.get('username')",
                            title="{{::member.get('full_name')}}"
                        )
                            img(ng-src="{{::member.get('photo')}}", alt="{{::member.get('full_name')}}")