Rocket.Chat/packages/rocketchat-ui/client/views/app/room.html

<template name="room">
	<div class="dropzone">
		<div class="dropzone-overlay background-transparent-darkest color-content-background-color">
			<div class="background-transparent-darkest">
				{{_ "Drop_to_upload_file"}}
			</div>
		</div>
		<div class="main-content-flex">
			<section class="messages-container flex-tab-main-content {{adminClass}}" id="{{windowId}}" aria-label="{{_ "Channel"}}">
				{{#unless embeddedVersion}}
					{{# header}}
						{{#with flexData}}
							<div class="rc-header__block rc-header__block-action">
								{{> RoomsActionTab}}
							</div>
						{{/with}}
					{{/header}}
				{{/unless}}
				<div class="messages-container-wrapper">
					<div class="messages-container-main">
						{{#unless embeddedVersion}}
							{{#if showAnnouncement}}
							<div class="fixed-title announcement {{getAnnouncementStyle}}" aria-label="{{RocketChatMarkdown roomAnnouncement}}">
								<p>{{{RocketChatMarkdown roomAnnouncement}}}</p>
							</div>
							{{/if}}
						{{/unless}}
						<div class="container-bars {{containerBarsShow unreadData uploading}}">
							{{#with unreadData}}
								{{#if since}}
									{{#if count}}
										<div class="unread-bar color-primary-action-color background-component-color">
											<button class="jump-to">
												<span class="jump-to-large">{{_ "Jump_to_first_unread"}}</span>
												<span class="jump-to-small">{{_ "Jump"}}</span>
											</button>
											<span class="unread-count-since">
												{{_ "S_new_messages_since_s" count formatUnreadSince}}
											</span>
											<span class="unread-count">
												{{_ "N_new_messages" count}}
											</span>
											<button class="mark-read">
												{{_ "Mark_as_read"}}
											</button>
										</div>
									{{/if}}
								{{/if}}
							{{/with}}
							{{#each uploading}}
								<div class="upload-progress color-primary-action-color background-component-color {{#if error}}error-background error-border{{/if}}">
									{{#if error}}
										<div class="upload-progress-text">
											{{error}}
										</div>
										<button class="upload-progress-close">
											{{_ "close"}}
										</button>
									{{else}}
										<div class="upload-progress-progress" style="width: {{percentage}}%;"></div>
										<div class="upload-progress-text">
											[{{percentage}}%] {{name}}
										</div>
										<button class="upload-progress-close">
											{{_ "Cancel"}}
										</button>
									{{/if}}
								</div>
							{{/each}}
						</div>
						<div class="messages-box {{#if selectable}}selectable{{/if}} {{messageViewMode}} {{hasLeader}}">
							<div class="ticks-bar"></div>
							<button class="new-message background-primary-action-color color-content-background-color not">
								<i class="icon-down-big"></i>
								{{_ "New_messages"}}
							</button>
							<div class="jump-recent background-component-color {{#unless hasMoreNext}}not{{/unless}}">
								<button>{{_ "Jump_to_recent_messages"}} <i class="icon-level-down"></i></button>
							</div>
							{{#unless canPreview}}
								<div class="content room-not-found error-color">
									<div>
										{{_ "You_must_join_to_view_messages_in_this_channel"}}
									</div>
								</div>
							{{/unless}}
							{{#with roomLeader}}
								<div class="room-leader message color-primary-font-color content-background-color border-component-color {{hideLeaderHeader}}">
									<button class="thumb user-card-message">
										{{> avatar username=username }}
									</button>
									<div class="leader-name">{{name}}</div>
									<div class="leader-status userStatus">
										<span class="color-ball status-bg-{{status}}"></span>
										<span class="status-text leader-status-text">{{_ statusDisplay}}</span>
									</div>
									<a class="chat-now" href="{{chatNowLink}}">{{_ "Chat_Now"}}</a>
								</div>
							{{/with}}
							<div class="wrapper {{#if hasMoreNext}}has-more-next{{/if}} {{hideUsername}} {{hideAvatar}}">
								<ul aria-live="polite">
									{{#if canPreview}}
										{{#if hasMore}}
											<li class="load-more">
												{{#if isLoading}}
													{{> loading}}
												{{/if}}
											</li>
										{{else}}
											<li class="start color-info-font-color">
												{{#if hasPurge}}
													<div class="start__purge-warning error-background error-border error-color">
														{{> icon block="start__purge-warning-icon" icon="warning-empty"}}
														{{#unless filesOnly}}
															{{#unless excludePinned}}
																{{_ "RetentionPolicy_RoomWarning" purgeTimeout}}
															{{else}}
																{{_ "RetentionPolicy_RoomWarning_Unpinned" purgeTimeout}}
															{{/unless}}
														{{else}}
															{{#unless excludePinned}}
																{{_ "RetentionPolicy_RoomWarning_FilesOnly" purgeTimeout}}
															{{else}}
																{{_ "RetentionPolicy_RoomWarning_UnpinnedFilesOnly" purgeTimeout}}
															{{/unless}}
														{{/unless}}
														{{> icon block="start__purge-warning-icon" icon="warning-empty"}}
													</div>
												{{/if}}
												{{_ "Start_of_conversation"}}
											</li>
										{{/if}}
									{{/if}}
									{{#each messagesHistory}}{{#nrr nrrargs 'message' .}}{{/nrr}}{{/each}}
									{{#if hasMoreNext}}
										<li class="load-more">
											{{#if isLoading}}
												{{> loading}}
											{{/if}}
										</li>
									{{/if}}
								</ul>
							</div>
						</div>
						<footer class="footer border-component-color">
							{{> messageBox messageboxData}}
						</footer>
					</div>
					{{#with flexData}}
						{{> contextualBar}}
					{{/with}}
				</div>
			</section>
		</div>
	</div>
</template>