1 files changed, 63 insertions, 0 deletions
diff --git a/.themes/FlatColor/gtk-3.20/widgets/switch.css b/.themes/FlatColor/gtk-3.20/widgets/switch.css
new file mode 100644
index 0000000..5bf986a
--- /dev/null
+++ b/.themes/FlatColor/gtk-3.20/widgets/switch.css
@@ -0,0 +1,63 @@
+/**********
+ * Switch *
+ **********/
+
+switch {
+    transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0;
+    margin: 6px 0;
+    border: 4px solid transparent;
+    border-radius: 100px;
+    background-color: alpha(#000, 0.2);
+    background-clip: padding-box;
+    font-size: 0;
+}
+switch:disabled {
+    color: shade(@selected_bg_color, 0.8);
+    background-color: alpha(#000, 0.1);
+}
+
+switch image {
+    color: alpha(#000, 0.0);
+}
+
+switch:disabled image:disabled {
+    color: alpha(#000, 0.0);
+}
+
+switch:checked {
+    background-color: shade(@selected_bg_color, 0.7);
+}
+switch:checked:disabled {
+    background-color: rgba(68, 138, 255, 0.2);
+    color: rgba(0, 0, 0, 0.32);
+}
+switch slider {
+    transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0;
+    border-image: none;
+    background-color: @selected_bg_color;
+    color: rgba(0, 0, 0, 0.8);
+    transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, margin 0;
+    min-width: 24px;
+    min-height: 24px;
+    margin: -4px 0 -4px -4px;
+    -gtk-outline-radius: 100px;
+    border-radius: 400px;
+    background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(transparent), to(transparent));
+}
+
+switch:hover slider {
+    border-image: none;
+}
+switch:disabled slider {
+    background-color: shade(@selected_bg_color, 0.7);
+    color: rgba(0, 0, 0, 0.32);
+}
+switch:checked slider {
+    transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, margin 0, background-image 0;
+    animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
+    margin: -4px -4px -4px 0;
+    color: @selected_fg_color;
+}
+switch:checked:disabled slider {
+    animation: none;
+}