section.home-project-list(ng-if="vm.projects.size")

    .home-project(tg-bind-scope, tg-repeat="project in vm.projects")
        .tags-container
            .project-tag(
                style="background: {{tag.get('color')}}"
                title="{{tag.get('name')}}"
                tg-repeat="tag in project.get('colorized_tags') track by tag.get('name')"
            )
        .project-card-inner(href="#", tg-nav="project:project=project.get('slug')")
            .project-card-header
                a.project-card-logo(
                    href="#"
                    tg-nav="project:project=project.get('slug')"
                    title="{{::project.get('name')}}"
                )
                    img(
                        tg-project-logo-small-src="::project"
                        alt="{{::project.get('name')}}"
                    )
                h2.project-card-name
                    a(
                        href="#"
                        tg-nav="project:project=project.get('slug')"
                        title="{{::project.get('name')}}"
                    ) {{::project.get('name')}}
                    svg.look-for-people.icon.icon-recruit(ng-if="project.get('is_looking_for_people')")
                        use(xlink:href="#icon-recruit")
                            title="{{ ::project.get('looking_for_people_note') }}"
            p.project-card-description {{::project.get('description')| limitTo:100 }}
                 span(ng-if="::project.get('description').length > 100") ...
            .project-card-statistics
                span.statistic(
                    ng-class="{'active': project.get('is_fan')}"
                    title="{{ 'PROJECT.FANS_COUNTER_TITLE'|translate:{total:project.get('total_fans')||0}:'messageformat' }}"
                )
                    svg.icon.icon-like
                        use(xlink:href="#icon-like")
                    span {{::project.get('total_fans')}}
                span.statistic(
                    ng-class="{'active': project.get('is_watcher')}"
                    title="{{ 'PROJECT.WATCHERS_COUNTER_TITLE'|translate:{total:project.get('total_watchers')||0}:'messageformat' }}"
                )
                    svg.icon.icon-watch
                        use(xlink:href="#icon-watch")
                    span {{::project.get('total_watchers')}}
                span.statistic(
                    ng-class="{'active': project.get('i_am_member')}"
                    title="{{ 'PROJECT.MEMBERS_COUNTER_TITLE'|translate:{total:project.get('members').size||0}:'messageformat' }}"
                )
                    svg.icon.icon-team
                        use(xlink:href="#icon-team")
                    span.statistics-num {{ ::project.get('members').size }}
                span.statistic(
                    ng-if="::project.get('is_private')"
                    title="{{ 'PROJECT.PRIVATE' | translate }}"
                )
                    svg.icon.icon-lock
                        use(xlink:href="#icon-lock")

    a.see-more-projects-btn.button-gray(
        href="#",
        ng-show="vm.projects.size",
        tg-nav="projects",
        title="{{'PROJECT.NAVIGATION.MANAGE_PROJECTS' | translate}}",
        translate="PROJECT.NAVIGATION.MANAGE_PROJECTS"
    )

section.projects-empty(ng-if="vm.projects != undefined && vm.projects.size === 0")
    svg.icon.icon-project
        use(xlink:href="#icon-project")
    p(translate="HOME.EMPTY_PROJECT_LIST")
    a.create-project-button.button-green(href="#", ng-click="vm.newProject()",
                                      title="{{'PROJECT.NAVIGATION.TITLE_CREATE_PROJECT' | translate}}",
                                      translate="PROJECT.NAVIGATION.ACTION_CREATE_PROJECT")
    span(tg-import-project-button)
        a.import-project-button.button-blackish(href="#",
                                                title="{{'PROJECT.NAVIGATION.TITLE_IMPORT_PROJECT' | translate}}",
                                                translate="PROJECT.NAVIGATION.ACTION_IMPORT_PROJECT")
        input.import-file.hidden(type="file")