Indentation: Consistent use of Tab

Added style guide
Updated changelog

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ### Builds after release 0.12.0
 
+#### Build 2203011
+
+-   IR rewrite (PR #2561), supports CCT
+-   Added locate button to Time settings
+-   CSS fixes and adjustments
+-   Consistent Tab indentation in index JS and CSS
+-   Added initial contribution style guideline
+
 #### Build 2202222
 
 -   Version bump to 0.13.0-b7 "Toki"

CONTRIBUTING.md

@@ -0,0 +1,78 @@
+## Thank you for making WLED better!
+
+Here are a few suggestions to make it easier for you to contribute!
+
+### Code style
+
+When in doubt, it is easiest to replicate the code style you find in the files you want to edit :)
+Below are the guidelines we use in the WLED repository.
+
+#### Indentation
+
+We use tabs for Indentation in Web files (.html/.css/.js) and spaces (2 per indentation level) for all other files.  
+You are all set if you have enabled `Editor: Detect Indentation` in VS Code.
+
+#### Blocks
+
+Whether the opening bracket of e.g. an `if` block is in the same line as the condition or in a separate line is up to your discretion. If there is only one statement, leaving out block braches is acceptable.
+
+Good:  
+```cpp
+if (a == b) {
+  doStuff(a);
+}
+```
+
+```cpp
+if (a == b)
+{
+  doStuff(a);
+}
+```
+
+```cpp
+if (a == b) doStuff(a);
+```
+
+There should always be a space between a keyword and its condition and between the condition and brace.  
+Within the condition, no space should be between the paranthesis and variables.  
+Spaces between variables and operators are up to the authors discretion.
+There should be no space between function names and their argument parenthesis.
+
+Good:  
+```cpp
+if (a == b) {
+  doStuff(a);
+}
+```
+
+Not good:  
+```cpp
+if( a==b ){
+  doStuff ( a);
+}
+```
+
+#### Comments
+
+Comments should have a space between the delimiting characters (e.g. `//`) and the comment text.
+Note: This is a recent change, the majority of the codebase still has comments without spaces.
+
+Good:  
+```
+// This is a comment.
+
+/* This is a CSS inline comment */
+
+/* 
+ * This is a comment
+ * wrapping over multiple lines,
+ * used in WLED for file headers and function explanations
+ */
+
+<!-- This is an HTML comment -->
+```
+
+There is no set character limit for a comment within a line,
+though as a rule of thumb you should wrap your comment if it exceeds the width of your editor window.  
+Inline comments are OK if they describe that line only and are not exceedingly wide.

wled00/data/index.css

@@ -981,15 +981,15 @@ input[type=number]::-webkit-outer-spin-button {
 	border-radius: 20px;
 	text-align: left;
 	transition: background-color 0.5s;
-	filter: brightness(1);
+	filter: brightness(1); /* required for slider background to render? */
 }
 
 .selected {
 	background-color: var(--c-4);
 }
 /* "selected" CSS class is applied to the segment when it is the main segment.
 	By default, do not highlight. Can be overridden by skin.css */
-.selected .seg {
+.selected.seg {
 	background-color: var(--c-2); /* var(--c-4); */
 }
 .selected .checkmark, .selected .radiokmark {

wled00/data/index.htm

@@ -227,7 +227,6 @@
 	<button class="btn" onclick="setLor(2)">Override until reboot</button><br>
 	<span class="h">For best performance, it is recommended to turn off the streaming source when not in use.</span>
 </div>
-
 <i id="roverstar" class="icons huge" onclick="setLor(0)">&#xe410;</i><br>
 <script src="iro.js"></script>
 <script src="rangetouch.js"></script>