overleaf/services/web/app/views/project/list/project-list.jade

.row
	.col-md-12
		form.project-search.form-horizontal(role="form")
			.form-group.has-feedback.has-feedback-left.col-md-7
				input.form-control.col-md-7(
					placeholder='Search projects…',
					autofocus='autofocus',
					ng-model="searchText",
					focus-on='search:clear'
				)
				i.fa.fa-search.form-control-feedback-left
				i.fa.fa-times.form-control-feedback(
					ng-click="clearSearchText()",
					style="cursor: pointer;",
					ng-show="searchText.length > 0"
				)
			//- i.fa.fa-remove

		.project-tools(ng-cloak)
			.btn-toolbar(ng-show="filter != 'archived'")
				.btn-group(ng-hide="selectedProjects.length < 1")
					a.btn.btn-default(
						href='#',
						tooltip="Download",
						tooltip-placement="bottom",
						tooltip-append-to-body="true",
						ng-click="downloadSelectedProjects()"
					)
						i.fa.fa-cloud-download
					a.btn.btn-default(
						href='#',
						tooltip="Delete",
						tooltip-placement="bottom",
						tooltip-append-to-body="true",
						ng-click="openArchiveProjectsModal()"
					)
						i.fa.fa-trash-o

				.btn-group.dropdown(ng-hide="selectedProjects.length < 1")
					a.btn.btn-default.dropdown-toggle(
						href="#",
						data-toggle="dropdown",
						tooltip="Add to folders",
						tooltip-append-to-body="true",
						tooltip-placement="bottom"
					)
						i.fa.fa-folder-open-o
						|  
						span.caret
					ul.dropdown-menu.dropdown-menu-right.js-tags-dropdown-menu(
						role="menu"
						ng-controller="TagListController"
					)
						li.dropdown-header Add to folder
						li(
							ng-repeat="tag in tags | filter:nonEmpty | orderBy:'name'",
							ng-controller="TagDropdownItemController"
						)
							a(href="#", ng-click="addOrRemoveProjectsFromTag()", stop-propagation="click")
								i.fa(
									ng-class="{\
										'fa-check-square-o': areSelectedProjectsInTag == true,\
										'fa-square-o': areSelectedProjectsInTag == false,\
										'fa-minus-square-o': areSelectedProjectsInTag == 'partial'\
									}"
								)
								|  {{tag.name}}
						li.divider
						li
							a(href="#", ng-click="openNewTagModal()", stop-propagation="click") Create New Folder

				.btn-group(ng-hide="selectedProjects.length != 1").dropdown
					a.btn.btn-default.dropdown-toggle(
						href='#',
						data-toggle="dropdown"
					) More 
						span.caret
					ul.dropdown-menu.dropdown-menu-right(role="menu")
						li(ng-show="getFirstSelectedProject().accessLevel == 'owner'")
							a(
								href='#',
								ng-click="openRenameProjectModal()"
							) Rename
						li
							a(
								href='#',
								ng-click="openCloneProjectModal()"
							) Make a copy

			.btn-toolbar(ng-show="filter == 'archived'")
				.btn-group(ng-hide="selectedProjects.length < 1")
					a.btn.btn-default(
						href='#',
						data-original-title="Restore",
						data-toggle="tooltip",
						data-placement="bottom",
						ng-click="restoreSelectedProjects()"
					) Restore

				.btn-group(ng-hide="selectedProjects.length < 1")
					a.btn.btn-danger(
						href='#',
						data-original-title="Delete Forever",
						data-toggle="tooltip",
						data-placement="bottom",
						ng-click="openDeleteProjectsModal()"
					) Delete Forever

.row.row-spaced
	.col-md-12
		.card.card-thin
			ul.list-unstyled.project-list.structured-list(
				select-all-list,
				ng-if="projects.length > 0",
				max-height="windowHeight - 290",
				ng-cloak
			)
				li.container-fluid
					.row
						.col-md-6(ng-click="changePredicate('name')")
							input.select-all(
								select-all,
								type="checkbox"
							)
							span.header Title
							i.tablesort.fa(ng-class="getSortIconClass('name')")
						.col-md-2(ng-click="changePredicate('accessLevel')")
							span.header Owner
							i.tablesort.fa(ng-class="getSortIconClass('accessLevel')")
						.col-md-4(ng-click="changePredicate('lastUpdated')")
							span.header Last Modified
							i.tablesort.fa(ng-class="getSortIconClass('lastUpdated')")
				li.project_entry.container-fluid(
					ng-repeat="project in visibleProjects | orderBy:predicate:reverse",
					ng-controller="ProjectListItemController"
				)
					.row
						.col-md-6
							input.select-item(
								select-individual,
								type="checkbox",
								ng-model="project.selected"
							)
							span
								a.projectName(href="/project/{{project.id}}") {{project.name}}
								span(
									ng-controller="TagListController"
								)
									a.label.label-default.tag-label(
										href,
										ng-repeat='tag in project.tags',
										ng-click="selectTag(tag)"
									) {{tag.name}}
						.col-md-2
							span.owner {{ownerName()}}
						.col-md-4
							span.last-modified {{project.lastUpdated | formatDate}}
				li(
					ng-if="visibleProjects.length == 0",
					ng-cloak
				)
					.row
						.col-md-12.text-centered
							small No projects
			div.welcome.text-centered(ng-if="projects.length == 0", ng-cloak)
				h2 Welcome to ShareLaTeX!
				p New to LaTeX? Start by having a look at our
					a(href="/templates")  templates
					|  or
					a(href="/learn")  help guides
					| ,
					br 
					| or create your first project on the left.