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

.dropdown(dropdown)
	a.btn.btn-primary.dropdown-toggle(
		href="#",
		data-toggle="dropdown",
		dropdown-toggle
	)
		| #{translate("new_project")}

	ul.dropdown-menu(role="menu")
		li
			a(
				href,
				sixpack-convert="first_sign_up",
				ng-click="openCreateProjectModal()"
			) #{translate("blank_project")}
		li
			a(
				href,
				sixpack-convert="first_sign_up",
				ng-click="openCreateProjectModal('example')"
			) #{translate("example_project")}
		li
			a(
				href,
				sixpack-convert="first_sign_up",
				ng-click="openUploadProjectModal()"
			) #{translate("upload_project")}
		!= moduleIncludes("newProjectMenu", locals)
		if (templates)
			li.divider
			li.dropdown-header #{translate("templates")}
			each item in templates
				li
					a.menu-indent(href=item.url, sixpack-convert="first_sign_up") #{translate(item.name)}

.row-spaced(ng-if="projects.length > 0", ng-cloak)
	ul.list-unstyled.folders-menu(
		ng-controller="TagListController"
	)
		li(ng-class="{active: (filter == 'all')}", ng-click="filterProjects('all')")
			a(href) #{translate("all_projects")}
		li(ng-class="{active: (filter == 'owned')}", ng-click="filterProjects('owned')")
			a(href) #{translate("your_projects")}
		li(ng-class="{active: (filter == 'shared')}", ng-click="filterProjects('shared')")
			a(href) #{translate("shared_with_you")}
		li(ng-class="{active: (filter == 'archived')}", ng-click="filterProjects('archived')")
			a(href) #{translate("deleted_projects")}
		li
			h2 #{translate("folders")}
		li.tag(
			ng-repeat="tag in tags | orderBy:name",
			ng-class="{active: tag.selected}",
			ng-cloak,
			ng-click="selectTag(tag)"
		)
			a.tag-name(href)
				i.icon.fa.fa-fw(
					ng-class="{\
						'fa-folder-open-o': tag.selected,\
						'fa-folder-o': !tag.selected\
					}"
				)
				span.name {{tag.name}} 
					span.subdued  ({{tag.project_ids.length}})
			span.dropdown.tag-menu(dropdown)
				a.dropdown-toggle(
					href="#",
					data-toggle="dropdown",
					dropdown-toggle,
					stop-propagation="click"
				)
					span.caret
				ul.dropdown-menu.dropdown-menu-right(
					role="menu"
				)
					li
						a(href, ng-click="renameTag(tag)", stop-propagation="click")
							| #{translate("rename")}
					li
						a(href, ng-click="deleteTag(tag)", stop-propagation="click")
							| #{translate("delete")}
		li(ng-cloak)
			a.tag(href, ng-click="openNewTagModal()")
				i.fa.fa-fw.fa-plus
				span.name #{translate("new_folder")}

.row-spaced(ng-if="projects.length == 0", ng-cloak)
	.first-project
		div
			i.fa.fa-arrow-up.fa-2x
		div
			strong #{translate("create_your_first_project")}
			
- if (showUserDetailsArea)
	span(ng-controller="LeftHandMenuPromoController",  ng-cloak)

		.row-spaced(ng-if="showDatajoy")
			hr
			.card.card-thin
				p.text-center.small
					| <strong>Python</strong> or <strong>R</strong> user?
					p.text-center.small
						a(href="https://www.getdatajoy.com/", target="_blank").btn.btn-info.btn-small Try DataJoy
				p.text-center.small(style="font-size: 0.8em")
					a(href="https://www.getdatajoy.com/", target="_blank") DataJoy
					|  is a new online Python and R editor from ShareLaTeX.

		.row-spaced#userProfileInformation(ng-if="hasProjects && !showDatajoy")
			div(ng-controller="UserProfileController")
				hr(ng-show="percentComplete < 100")
				.text-centered.user-profile(ng-show="percentComplete < 100")
					.progress
						.progress-bar.progress-bar-info(ng-style="{'width' : (percentComplete+'%')}")

					p.small #{translate("profile_complete_percentage", {percentval:"{{percentComplete}}"})}
					
					button#completeUserProfileInformation.btn.btn-info(
						ng-hide="formVisable",
						ng-click="openUserProfileModal()"
					) #{translate("complete")}


		.row-spaced(ng-if="hasProjects && userHasSubscription", ng-cloak, sixpack-switch="left-menu-upgraed-rotation").text-centered
			span(sixpack-default).text-centered
				hr
				p.small #{translate("on_free_sl")}
				p
					a(href="/user/subscription/plans", sixpack-convert="left-menu-upgraed-rotation").btn.btn-primary #{translate("upgrade")}
				p.small.text-centered
					| #{translate("or_unlock_features_bonus")} 
					a(href="/user/bonus") #{translate("sharing_sl")} .

			span(sixpack-when="random").text-centered
				span(ng-if="randomView == 'default'")
					hr
					p.small #{translate("on_free_sl")}
					p
						a(href="/user/subscription/plans", sixpack-convert="left-menu-upgraed-rotation").btn.btn-primary #{translate("upgrade")}
					p.small.text-centered
						| #{translate("or_unlock_features_bonus")} 
						a(href="/user/bonus") #{translate("sharing_sl")} .

				span(ng-if="randomView == 'dropbox'")
					hr
					.card.card-thin
						p
							span Get Dropbox Sync
						p
							img(src="/img/dropbox/simple_logo.png")
						p
							a(href="/user/subscription/plans", sixpack-convert="left-menu-upgraed-rotation").btn.btn-primary #{translate("upgrade")}
						p.small.text-centered
							| #{translate("or_unlock_features_bonus")} 
							a(href="/user/bonus") #{translate("sharing_sl")} .

				span(ng-if="randomView == 'github'")
					hr
					.card.card-thin
						p
							span Get Github Sync
						p
							img(src="/img/github/octocat.jpg")
						p
							a(href="/user/subscription/plans", sixpack-convert="left-menu-upgraed-rotation").btn.btn-primary #{translate("upgrade")}
						p.small.text-centered
							| #{translate("or_unlock_features_bonus")} 
							a(href="/user/bonus") #{translate("sharing_sl")} .
script.
	window.userHasSubscription = #{settings.enableSubscriptions && !hasSubscription}