From 2ab097b2e5d0470f39021e2c27252d1ee8f20d94 Mon Sep 17 00:00:00 2001
From: Andrew Dolgov <noreply@fakecake.org>
Date: Tue, 4 Dec 2018 22:24:31 +0300
Subject: initial work for flat modern theme

---
 lib/flat-ttrss/dijit/ColorPalette.css | 66 +++++++++++++++++++++++++++++++++++
 1 file changed, 66 insertions(+)
 create mode 100755 lib/flat-ttrss/dijit/ColorPalette.css

(limited to 'lib/flat-ttrss/dijit/ColorPalette.css')

diff --git a/lib/flat-ttrss/dijit/ColorPalette.css b/lib/flat-ttrss/dijit/ColorPalette.css
new file mode 100755
index 000000000..a8f647458
--- /dev/null
+++ b/lib/flat-ttrss/dijit/ColorPalette.css
@@ -0,0 +1,66 @@
+/* ColorPalette
+ * 
+ * Styling of the ColorPalette consists of the following:
+ * 
+ * 1. the whole color palette
+ *		.dijitColorPalette - for outline, border, and background color of the whole color palette
+ *		Note: outline does not work for IE
+ *
+ * 2. the color swatch 
+ *		.dijitColorPalette .dijitPaletteImg
+ *		transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
+ *		displays border around a color swatch
+ *
+ * 3. hovered swatch
+ * 		.dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg
+ *		the hovered state of the color swatch - adds border
+ * 	
+ * 4. active and selected swatch
+ * 		.dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg
+ *		.dijitColorPalette .dijitPaletteCellSelected .dijitPaletteImg
+ *		adds border for active or selected state
+ */
+.flat .dijitColorPalette {
+  border: 1px solid #ccc;
+  background-color: #fff;
+  border-radius: 4px;
+/* swatch */
+}
+.flat .dijitColorPalette .dijitPaletteTable {
+  padding: 4px;
+}
+.flat .dijitColorPalette .dijitColorPaletteSwatch {
+  height: 15px;
+  width: 15px;
+  border-radius: 2px;
+}
+.flat .dijitColorPalette .dijitPaletteImg {
+/* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
+			 * displays border around a color swatch
+			 * overrides border color in dijit.css */
+  border: 1px solid transparent;
+  line-height: normal;
+}
+.flat .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
+  border-color: #ccc;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  border-radius: 2px;
+  -webkit-transform: scale(1.2);
+  -moz-transform: scale(1.2);
+  -o-transform: scale(1.2);
+  -ms-transform: scale(1.2);
+  transform: scale(1.2);
+}
+.flat .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg,
+.flat .dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
+  border: 1px solid #257aa7;
+  -webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
+  box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
+  border-radius: 2px;
+  -webkit-transform: scale(1.2);
+  -moz-transform: scale(1.2);
+  -o-transform: scale(1.2);
+  -ms-transform: scale(1.2);
+  transform: scale(1.2);
+}
-- 
cgit v1.2.3