more on themes

README.md

@@ -97,11 +97,11 @@ When adding new translations, add them in en.properties then run `mvn -e groovy:
 Themes
 ---------------------
 
-To create a theme, create a new file  `src/main/webapp/sass/themes/_<theme>.scss`. Your styles should be wrapped in a `#theme-<theme>` element.
+To create a theme, create a new file  `src/main/webapp/sass/themes/_<theme>.scss`. Your styles should be wrapped in a `#theme-<theme>` element and use the [SCSS format](http://sass-lang.com/) which is a superset of CSS.
 
 Don't forget to reference your theme in `src/main/webapp/sass/app.scss` and in `src/main/webapp/js/controllers.js` (look for `$scope.themes`).
 
-See _test.scss for an example.
+See [_test.scss](https://github.com/Athou/commafeed/blob/master/src/main/webapp/sass/themes/_test.scss) for an example.
 
 
 Copyright and license

src/main/resources/i18n/en.properties

@@ -55,6 +55,9 @@ settings.general.language.contribute=Contribute with translations
 settings.general.show_unread=Show feeds and categories with no unread entries
 settings.general.social_buttons=Show social sharing buttons
 settings.general.scroll_marks=In expanded view, scrolling through entries mark them as read
+settings.appearance=Appearance
+settings.theme=Theme
+settings.submit_your_theme=Submit your theme
 settings.custom_css=Custom CSS
 
 details.feed_details=Feed details

src/main/webapp/js/controllers.js

@@ -992,7 +992,7 @@ function($scope, $location, SettingsService, AnalyticsService, ServerService) {
 	
 	$scope.ServerService = ServerService.get();
 	
-	$scope.themes = ['default', 'test'];
+	$scope.themes = ['default'];
 	
 	$scope.settingsService = SettingsService;
 	$scope.$watch('settingsService.settings', function(value) {

src/main/webapp/templates/settings.html

@@ -10,7 +10,7 @@
 						<a ng-click="tab = 'general'">${settings.general}</a>
 					</li>
 					<li ng-class="{active: tab == 'css'}" class="pointer">
-						<a ng-click="tab = 'css'">${settings.custom_css}</a>
+						<a ng-click="tab = 'css'">${settings.appearance}</a>
 					</li>
 				</ul>
 			</div>
@@ -56,9 +56,16 @@
 					</div>
 					<div class="tab-pane" ng-class="{active: tab == 'css'}">
 						<div>
+							<label>${settings.theme}</label>
 							<select ng-model="settings.theme" ng-options="theme for theme in themes"></select>
+							<span class="help-block">
+								<a href="https://github.com/Athou/commafeed#themes" target="_blank">
+									${settings.submit_your_theme}
+								</a>
+							</span>
 						</div>
 						<div>
+							<label>${settings.custom_css}</label>
 							<textarea ng-model="settings.customCss" class="input-block-level" rows="20">
 							</textarea>
 						</div>