initial work for flat modern theme

1 files changed, 69 insertions, 0 deletions

diff --git a/lib/flat-ttrss/dijit/Editor.styl b/lib/flat-ttrss/dijit/Editor.styl
new file mode 100755
index 000000000..1be19acb2
--- /dev/null
+++ b/lib/flat-ttrss/dijit/Editor.styl
@@ -0,0 +1,69 @@
+/* Editor 
+ * 
+ * Styling Editor means styling the Editor inside iframe container (dijitEditorIFrameContainer)
+ * 
+ * 1. Editor iframe container (default styling): 
+ * 		.dijitEditorIFrameContainer - normal state styles: background-color, border, padding
+ *
+ * 2. hovered Editor iframe container (ie, mouse hover on editor)
+ * 		.dijitEditorHover .dijitEditorIFrameContainer/dijitEditorIFrame - styles when mouse hover on the container
+ * 
+ * 3. focused Editor iframe container (ie, mouse focus on the editor pane)
+ * 		.dijitEditorFocused .dijitEditorIFrameContainer/dijitEditorIFrame - styles when container focused
+ * 
+ * 3. disabled Editor iframe container 
+ * 		.dijitEditorDisabled - editor's inner iframe container disable status styles: background, border
+ */
+
+@import 'dijit_variables';
+
+.{$theme-name} {
+
+	.dijitEditor {
+		background-color: $editor-background-color;
+		border: 1px solid $editor-border-color;
+		border-radius: $editor-border-radius;
+
+		.dijitEditorIFrameContainer {
+			border: 1px solid $editor-iframe-border-color;
+			border-top: 1px solid $editor-border-color;
+			padding: $editor-iframe-padding;
+			transition: border 0.2s linear 0s;
+		}
+	}
+
+	/* Hover */
+
+	.dijitEditorHover {
+		.dijitEditorIFrameContainer,
+		.dijitEditorIFrameContainer .dijitEditorIFrame {
+			border: 1px solid $editor-iframe-hover-border-color;
+		}
+	}
+
+	/* Focused */
+
+	.dijitEditorFocused {
+		.dijitEditorIFrameContainer {
+			border: 1px solid $editor-iframe-focused-border-color;
+		}
+		.dijitEditorIFrameContainer .dijitEditorIFrame {
+			border: 1px solid $editor-iframe-focused-border-color;
+		}
+	}
+
+	/* Disabled */
+
+	.dijitEditorDisabled {
+		border: 1px solid $editor-disabled-border-color;
+		opacity: $disabled-opacity;
+
+		.dijitEditorIFrame,
+		.dijitEditorIFrameContainer,
+		.dijitEditorIFrameContainer .dijitEditorIFrame {
+			background-color: $editor-iframe-disabled-background-color;
+			border: 1px solid $editor-iframe-disabled-border-color;
+		}
+	}
+	
+}
\ No newline at end of file