summaryrefslogtreecommitdiff
path: root/data
diff options
context:
space:
mode:
authorFelipe Erias Morandeira <femorandeira@igalia.com>2013-07-04 14:03:40 +0100
committerPhilip Chimento <philip@endlessm.com>2013-07-04 21:57:00 -0700
commitdb295e182f1cf96f619d65c6a16c0c8a3cd289a5 (patch)
tree2c03e32305381e523c642f2ad5a3142fafa7948f /data
parente6495e019c13f99ea6fdc9fa2a0c5cf2217e985f (diff)
Added the CSS style of EosActionButtons to endless-widgets.css
[endlessm/eos-sdk#104]
Diffstat (limited to 'data')
-rw-r--r--data/css/endless-widgets.css146
1 files changed, 146 insertions, 0 deletions
diff --git a/data/css/endless-widgets.css b/data/css/endless-widgets.css
index faf1e38..4ef2e2a 100644
--- a/data/css/endless-widgets.css
+++ b/data/css/endless-widgets.css
@@ -49,3 +49,149 @@
.top-bar .button *:active {
color: #8a8a8a;
}
+
+
+/* Endless action button */
+
+EosActionButton {
+ background-color: transparent;
+ border-style: solid;
+ border-image: none;
+ margin: 10px;
+
+ border-radius: 40px;
+ border-width: 8px;
+}
+
+EosActionButton GtkLabel {
+ font-family: BentonSans, sans-serif;
+ font-weight: normal;
+ font-size: 11px;
+}
+
+/* Endless action button: sizes */
+
+EosActionButton.primary {
+ border-radius: 40px;
+ border-width: 8px;
+}
+
+EosActionButton.secondary {
+ border-radius: 30px;
+ border-width: 6px;
+}
+
+EosActionButton.tertiary {
+ border-radius: 23px;
+ border-width: 5px;
+}
+
+EosActionButton.quaternary {
+ border-radius: 17px;
+ border-width: 4px;
+}
+
+/* Endless action button: light background */
+
+/* normal */
+EosActionButton,
+EosActionButton:selected,
+EosActionButton:focused {
+ border-color: alpha(#323232, 0.5);
+ box-shadow: 1px 1px 1px alpha(black, 0.8) inset,
+ 0px -1px 1px alpha(white, 0.65);
+}
+
+EosActionButton GtkImage,
+EosActionButton GtkImage:selected,
+EosActionButton GtkImage:focused {
+ color: alpha(#323232, 0.5);
+}
+
+EosActionButton GtkLabel,
+EosActionButton GtkLabel:selected,
+EosActionButton GtkLabel:focused {
+ color: alpha(#323232, 0.65);
+}
+
+/* hover */
+EosActionButton:hover {
+ border-color: alpha(#323232, 0.8);
+ box-shadow: 1px 1px 1px alpha(black, 0.8) inset;
+}
+
+EosActionButton GtkImage:hover {
+ color: alpha(#282828, 0.8);
+}
+
+EosActionButton GtkLabel:hover {
+ color: alpha(#1E1E1E, 0.8);
+}
+
+/* pressed */
+EosActionButton:active {
+ border-color: alpha(#323232, 0.65);
+ box-shadow: 1px 1px 1px alpha(black, 0.8) inset;
+}
+
+EosActionButton GtkImage:active {
+ color: alpha(#282828, 0.65);
+}
+
+EosActionButton GtkLabel:active {
+ color: alpha(#1E1E1E, 0.8);
+}
+
+/* insensitive, just in case */
+EosActionButton:insensitive,
+EosActionButton:inconsistent {
+ border-color: alpha(#888888, 0.50);
+ box-shadow: none;
+}
+
+/* Endless action button: dark background */
+
+/* normal */
+.dark EosActionButton,
+.dark EosActionButton:selected,
+.dark EosActionButton:focused {
+ border-color: alpha(#E6E6E6, 0.5);
+ box-shadow: 1px 1px 1px alpha(black, 0.95) inset,
+ 0px -1px 1px alpha(white, 0.5) inset;
+}
+
+.dark EosActionButton GtkImage,
+.dark EosActionButton GtkImage:selected,
+.dark EosActionButton GtkImage:selected,
+.dark EosActionButton GtkLabel,
+.dark EosActionButton GtkLabel:selected,
+.dark EosActionButton GtkLabel:focused {
+ color: alpha(#E6E6E6, 0.5);
+}
+
+/* hover */
+.dark EosActionButton:hover {
+ border-color: alpha(white, 0.8);
+ box-shadow: 1px 1px 1px alpha(black, 0.95) inset,
+ 0px -1px 1px alpha(white, 0.85) inset;
+}
+
+.dark EosActionButton GtkImage:hover,
+.dark EosActionButton GtkLabel:hover {
+ color: alpha(white, 0.8);
+}
+
+/* pressed */
+.dark EosActionButton:active {
+ border-color: alpha(white, 0.65);
+ box-shadow: 1px 1px 1px alpha(black, 0.95) inset,
+ 0px -1px 1px alpha(white, 0.7) inset;
+}
+
+.dark EosActionButton GtkImage:active {
+ color: alpha(white, 0.65);
+}
+
+.dark EosActionButton GtkLabel:active {
+ color: alpha(white, 0.8);
+}