initial commit

.gitignore

@@ -0,0 +1,5 @@
+# ignore my random reference screenshots
+element_screenies/
+# ignore gtk theme files i just have for reference
+gtk-widgets.css
+widgets/

elements

@@ -0,0 +1,27 @@
+- dropdown menu (w/ dividers)
+- toolbar icon button
+combo box entry (enabled/disabled)
+combo box (enabled/disabled)
+entry (enabled/disabled)
+- integer entry (w/ + and - buttons)
+- check buttons (checked/unchecked + enabled/disabled)
+- radio buttons (checked/unchecked + enabled/disabled)
+- frames
+- tabs
+- text button (enabled/disabled)
+toggle button (enabled/disabled)
+- font select button
+- color picker button
+- color picker
+file chooser button
+- file chooser menu
+I/O button (slide switch)
+link button w/ tooltip
+icon button
+- progress bar (w/ text)
+- sliders
+- table (w/ named columns + scrollbars)
+- label
+tooltip
+spinner
+- scrollbar (vertical + horizontal)

gtk-3.0/colors.css

@@ -0,0 +1,44 @@
+/**
+ * Color definitions.
+ *
+ * Each color defined in this file is usable as a symbolic color
+ * in all files included after it.
+ *
+ * Color definitions have the format `@define-color <name> <value>;',
+ * where <name> is a name you choose, and <value> is a color definition.
+ * Defined colors can be used in rules with the syntax `@<name>'
+ *
+ * The most common color definition is a html color code: #rrbbgg
+ * For more information see (1) or (2).
+ *
+ * (1) file:///usr/share/devhelp/books/gtk3/GtkCssProvider.html#gtkcssprovider-symbolic-colors
+ * (2) http://developer.gnome.org/gtk3/3.1/GtkCssProvider.html#gtkcssprovider-symbolic-colors
+ */
+
+/* Some common color definitions
+ *
+ * @define-color base-color #ff00ff;
+ * @define-color background-color #ff00ff;
+ * @define-color forground-color #ff00ff;
+ * @define-color text-color #ff00ff;
+ */
+@define-color color-0 #000000;
+@define-color color-1 #111111;
+@define-color color-2 #222222;
+@define-color color-3 #333333;
+@define-color color-4 #444444;
+@define-color color-5 #555555;
+@define-color color-6 #666666;
+@define-color color-7 #777777;
+@define-color color-8 #888888;
+@define-color color-9 #999999;
+@define-color color-a #aaaaaa;
+@define-color color-b #bbbbbb;
+@define-color color-c #cccccc;
+@define-color color-d #dddddd;
+@define-color color-e #eeeeee;
+@define-color color-f #ffffff;
+
+@define-color color-blue-bright #0099cc;
+@define-color color-blue #006699;
+@define-color color-blue-dark #003366;

gtk-3.0/gtk.css

@@ -0,0 +1,362 @@
+/**
+ * Theme name: <aweseome-theme>
+ * Author    : <you@domain.tld>
+ * License   : Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported 
+ *             (CC BY-NC-SA 3.0)
+ *             http://creativecommons.org/licenses/by-nc-sa/3.0/
+ */
+
+@import url("colors.css");
+
+.background {
+	background-color: @color-e;
+	color: @color-0;
+}
+
+menubar {
+	background-color: @color-d;
+	margin: 1px 0px 1px 0px;
+	box-shadow: 0px -1px @color-0,
+		0px 1px @color-0;
+	border-top: 1px solid @color-f;
+	border-bottom: 1px solid @color-9;
+}
+menuitem window.background {
+	background-color: transparent;
+}
+menuitem menu {
+	padding: 2px 2px 2px 1px;
+	background-color: @color-d;
+	background-clip: content-box;
+	border-image-slice: 4;
+	border-image-width: 4px;
+	border-image-source: url("assets/menubar_bg.png");
+}
+menubar menuitem:hover {
+	color: @color-f;
+	background-color: @color-blue;
+}
+menubar > menuitem {
+	padding: 1px 7px;
+}
+menubar > menuitem:hover {
+	box-shadow: 0px -1px @color-blue-bright,
+		0px 1px @color-blue-dark;
+}
+menubar menu menuitem {
+	padding: 2px 0px 2px 0px;
+}
+menubar menu menuitem:hover {
+	border-image-slice: 1;
+	border-image-width: 1px;
+	border-image-source: url("assets/menubar_bg_active.png");
+}
+menubar menu menuitem:first-child {
+	border-image-source: url("assets/menubar_bg_active_top.png");
+}
+menubar menu menuitem:last-child {
+	border-image-source: url("assets/menubar_bg_active_bottom.png");
+}
+
+separator.vertical {
+	border-left: 1px solid @color-8;
+	border-right: 1px solid @color-f;
+}
+separator.horizontal {
+	border-top: 1px solid @color-8;
+	border-bottom: 1px solid @color-f;
+}
+menu separator {
+	margin: 3px 0px 2px 0px;
+	border-top: 1px solid @color-8;
+	border-bottom: 1px solid @color-f;
+}
+
+entry {
+	background-color: @color-f;
+	color: @color-0;
+	margin: 2px;
+	padding: 4px;
+	border: @color-0 solid 1px;
+	box-shadow: 1px 1px @color-f,
+		1px 0px @color-f,
+		0px 1px @color-f,
+		-1px -1px @color-8,
+		0px -1px @color-8,
+		-1px 0px @color-8;
+}
+entry:disabled {
+	color: @color-5;
+	border: @color-5 solid 1px;
+	box-shadow: 0px 0px 0px 1px @color-d;
+}
+entry:focus {
+	box-shadow: 0px 1px 0px 1px @color-blue-bright,
+		0px -1px 0px 1px @color-blue-bright,
+		1px 0px 0px 1px @color-blue-bright,
+		-1px 0px 0px 1px @color-blue-bright;
+}
+
+combobox button {
+	background-color: @color-d;
+	padding: 1px;
+	border-image-slice: 3;
+	border-image-width: 3px;
+	border-image-source: url("assets/combo_active.png");
+}
+combobox button:checked {
+	background-color: @color-6;
+}
+combobox arrow {
+	min-width: 24px;
+	border-image-slice: 3;
+	border-image-width: 3px;
+	border-image-source: url("assets/combo_arrow_bg_active.png");
+	background-image: url("assets/combo_arrow_active.png");
+	background-repeat: no-repeat;
+	background-position: 9px center;
+}
+combobox button:checked arrow {
+	border-image-source: url("assets/combo_arrow_bg_pressed.png");
+	background-image: url("assets/combo_arrow_pressed.png");
+}
+combobox arrow:disabled {
+	border-image-source: url("assets/combo_arrow_bg_inactive.png");
+	background-image: url("assets/combo_arrow_inactive.png");
+}
+/* there's a lot of hackiness here to align the popup items properly */
+combobox box cellview {
+	padding: 1px 2px;
+}
+combobox menu {
+	padding: 2px 22px 0px 0px;
+}
+combobox .background {
+	background-color: rgba(0,0,0,0);
+}
+combobox menuitem {
+	padding: 3px 0px 3px 0px;
+	background-color: @color-d;
+	background-clip: content-box;
+	border-image-slice: 4;
+	border-image-width: 4px;
+	border-image-source: url("assets/combo_unselected.png");
+}
+combobox menuitem:first-child {
+	border-image-source: url("assets/combo_unselected_top.png");
+}
+combobox menuitem:last-child {
+	border-image-source: url("assets/combo_unselected_bottom.png");
+}
+combobox menuitem:hover {
+	color: @color-f;
+	background-color: @color-blue;
+	border-image-source: url("assets/combo_selected.png");
+}
+combobox menuitem:hover:first-child {
+	border-image-source: url("assets/combo_selected_top.png");
+}
+combobox menuitem:hover:last-child {
+	border-image-source: url("assets/combo_selected_bottom.png");
+}
+combobox menu cellview {
+	margin-left: 5px;
+	margin-right: 6px;
+}
+
+combobox entry {
+	margin: 2px;
+}
+combobox button:nth-child(2) {
+	background-color: transparent;
+	margin: 1px 1px 1px 0px;
+	border-image-slice: 5;
+	border-image-width: 5px;
+	border-image-source: url("assets/comboentry_button_active.png");
+}
+combobox button:nth-child(2):checked {
+	background-color: transparent;
+	border-image-source: url("assets/comboentry_button_pressed.png");
+}
+combobox button:nth-child(2):disabled {
+	border-image-source: url("assets/comboentry_button_inactive.png");
+}
+combobox button:nth-child(2) arrow {
+	background-color: @color-d;
+	background-clip: content-box;
+	min-width: 16px;
+	padding: 4px;
+	border-image-source: none;
+	background-position: 8px center;
+}
+combobox button:nth-child(2):checked arrow {
+	background-color: @color-6;
+}
+
+button {
+	background-color: @color-d;
+	background-clip: content-box;
+	color: @color-0;
+	padding: 4px;
+	border-image-slice: 4;
+	border-image-width: 4px;
+	border-image-source: url("assets/button_active.png");
+}
+button:active, button:checked:active {
+	background-color: @color-6;
+	color: @color-f;
+	border-image-source: url("assets/button_pressed.png");
+	-gtk-icon-effect: highlight;
+}
+button:checked {
+	background-color: @color-8;
+	color: @color-f;
+	border-image-source: url("assets/button_toggled.png");
+	-gtk-icon-effect: highlight;
+}
+button:disabled {
+	color: @color-7;
+	border-image-source: url("assets/button_inactive.png");
+	-gtk-icon-effect: dim;
+}
+
+toolbar toolbutton button {
+	padding: 0px;
+	background-clip: border-box;
+	border-image-source: none;
+	border-width: 1px 0px 1px 1px;
+	border-style: solid;
+	border-color: @color-0;
+}
+toolbar toolbutton:last-child button {
+	border-width: 1px 1px 1px 0px;
+}
+toolbar toolbutton button box {
+	padding: 3px;
+	border-image-slice: 2;
+	border-image-width: 2px;
+	border-image-source: url("assets/toolbar_button_active.png");
+}
+toolbar toolbutton button:active {
+	border-image-source: none;
+}
+toolbar toolbutton button:active box {
+	border-image-source: url("assets/toolbar_button_pressed.png");
+}
+toolbar toolbutton button:disabled {
+	border-width: 1px;
+	border-image-source: none;
+}
+toolbar toolbutton button:disabled box {
+	border-image-source: none;
+	background-color: @color-d;
+}
+
+radio {
+	padding: 0px;
+	border: none;
+	margin: 5px;
+	min-width: 12px;
+	min-height: 12px;
+	-gtk-icon-source: url("assets/radio_button_active.png");
+}
+radio:checked {
+	-gtk-icon-source: url("assets/radio_button_toggled.png");
+}
+radio:disabled {
+	-gtk-icon-source: url("assets/radio_button_inactive.png");
+}
+radio:disabled:checked {
+	-gtk-icon-source: url("assets/radio_button_toggled_inactive.png");
+}
+
+check {
+	padding: 0px;
+	border: none;
+	margin: 5px;
+	min-width: 14px;
+	min-height: 12px;
+	-gtk-icon-source: url("assets/checkbox_active.png");
+}
+check:checked {
+	-gtk-icon-source: url("assets/checkbox_toggled.png");
+}
+check:disabled {
+	-gtk-icon-source: url("assets/checkbox_inactive.png");
+}
+check:disabled:checked {
+	-gtk-icon-source: url("assets/checkbox_toggled_inactive.png");
+}
+
+spinbutton.horizontal entry {
+	margin-right: 0px;
+}
+spinbutton.horizontal button {
+	margin: 2px 0px;
+	background-color: @color-d;
+	background-clip: border-box;
+	border-image-slice: 3;
+	border-image-width: 3px;
+}
+spinbutton.horizontal button.down {
+	border-image-source: url("assets/spinbutton_horizontal_down_active.png");
+	box-shadow: 0px 1px @color-f,
+		0px -1px @color-8;
+}
+spinbutton.horizontal button.up {
+	border-image-source: url("assets/spinbutton_horizontal_up_active.png");
+	box-shadow: -1px 2px 0px -1px @color-f,
+		0px 2px 0px -1px @color-f,
+		inset 0px -1px 0px 0px @color-f,
+		2px 0px 0px -1px @color-f,
+		-1px -2px 0px -1px @color-8,
+		0px -2px 0px -1px @color-8,
+		inset 0px 1px 0px 0px @color-8;
+}
+spinbutton.horizontal button:active {
+	background-color: @color-6;
+}
+spinbutton.horizontal button.down:active {
+	border-image-source: url("assets/spinbutton_horizontal_down_pressed.png");
+}
+spinbutton.horizontal button.up:active {
+	border-image-source: url("assets/spinbutton_horizontal_up_pressed.png");
+}
+spinbutton.horizontal button.down:disabled {
+	border-image-source: url("assets/spinbutton_horizontal_down_inactive_in_active.png");
+}
+spinbutton.horizontal button.up:disabled {
+	border-image-source: url("assets/spinbutton_horizontal_up_inactive_in_active.png");
+}
+spinbutton.horizontal:disabled button.down {
+	border-image-source: url("assets/spinbutton_horizontal_down_inactive_in_inactive.png");
+	box-shadow: 0px 1px @color-d,
+		0px -1px @color-d;
+}
+spinbutton.horizontal:disabled button.up {
+	border-image-source: url("assets/spinbutton_horizontal_up_inactive_in_inactive.png");
+	box-shadow: -1px 2px 0px -1px @color-d,
+		0px 2px 0px -1px @color-d,
+		inset 0px -1px 0px 0px @color-d,
+		2px 0px 0px -1px @color-d,
+		-1px -2px 0px -1px @color-d,
+		0px -2px 0px -1px @color-d,
+		inset 0px 1px 0px 0px @color-d;
+}
+spinbutton.horizontal:focus button.down {
+	box-shadow: 0px -2px 0px 0px @color-blue-bright,
+		0px 2px 0px 0px @color-blue-bright;
+}
+spinbutton.horizontal:focus button.up {
+	box-shadow: 0px -2px @color-blue-bright,
+		1px -2px @color-blue-bright,
+		1px 0px 0px 1px @color-blue-bright,
+		inset 0px 0px 0px 1px @color-blue-bright,
+		0px 2px @color-blue-bright,
+		1px 2px @color-blue-bright;
+}
+
+.scrollbar {
+	-GtkScrollbar-has-backward-stepper: 1;
+	-GtkScrollbar-has-forward-stepper: 1;
+}

index.theme

@@ -0,0 +1,11 @@
+[X-GNOME-Metatheme]
+Name=ratintosh
+Comment=Mac OS 9 theme
+
+Type=X-GNOME-Metatheme
+Encoding=UTF-8
+#GtkTheme=<yourawesometheme>
+#MetacityTheme=<yourawesometheme>
+#IconTheme=<name_of_icon_theme>
+#CursorTheme=<name_of_cursor_theme>
+#CursorSize=<24>

notes

@@ -0,0 +1,2 @@
+- combobox items are taller than macintosh
+- entry combo popup is just kinda hanging off to the bottom (not attached)