Athou_commafeed/src/main/webapp/templates/settings.html

<div class="settings">
	<div class="page-header">
		<h1>${toolbar.settings}</h1>
	</div>
	<form name="settingsForm" ng-submit="save()">
		<div class="row">
			<div class="col-md-2">
				<ul class="nav nav-pills nav-stacked">
					<li ng-class="{active: !tab || tab == 'general'}" class="pointer">
						<a ng-click="tab = 'general'">${settings.general}</a>
					</li>
					<li ng-class="{active: tab == 'css'}" class="pointer">
						<a ng-click="tab = 'css'">${settings.appearance}</a>
					</li>
				</ul>
			</div>
			<div class="col-md-10">
				<div class="tab-content">
					<div class="tab-pane" ng-class="{active: !tab || tab == 'general'}">
						<div class="form-horizontal">
							<div class="form-group">
								<label>${settings.general.language}</label>
								<select name="language" ng-model="settings.language" class="form-control"
									ng-options="id as label for (id,label) in ServerService.supportedLanguages" required>
								</select>
								<span class="help-block">
									<a href="https://github.com/Athou/commafeed#translate-commafeed-into-your-language" target="_blank">
										${settings.general.language.contribute} </a>
								</span>
							</div>
							<div class="checkbox">
								<label>
									<input type="checkbox" name="showRead" ng-model="settings.showRead" />
									${settings.general.show_unread}
								</label>
							</div>
							<div class="checkbox">
								<label>
									<input type="checkbox" name="socialButtons" ng-model="settings.socialButtons" />
									${settings.general.social_buttons}
								</label>
							</div>
							<div class="checkbox">
								<label>
									<input type="checkbox" name="scrollMarks" ng-model="settings.scrollMarks" />
									${settings.general.scroll_marks}
								</label>
							</div>
						</div>
					</div>
					<div class="tab-pane" ng-class="{active: tab == 'css'}">
						<div class="form-group">
							<label>${settings.scroll_speed}</label>
							<input type="number" ng-model="settings.scrollSpeed" min="0" max="1000" class="form-control" />
							<span class="help-inline">${settings.scroll_speed.help}</span>
						</div>
						<div class="form-group">
							<label>${settings.theme}</label>
							<select ng-model="settings.theme" ng-options="theme for theme in themes" class="form-control"></select>
							<span class="help-block">
								<a href="https://github.com/Athou/commafeed#themes" target="_blank"> ${settings.submit_your_theme} </a>
							</span>
						</div>
						<div class="form-group">
							<label>${settings.custom_css}</label>
							<textarea ng-model="settings.customCss" class="form-control" rows="20">
							</textarea>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="form-actions">
			<button type="submit" class="btn btn-primary">${global.save}</button>
			<button type="button" class="btn btn-default" ng-click="cancel()">${global.cancel}</button>
		</div>
	</form>
</div>