widget HScrollbar {
	[hexpand hfill] new HBox {
		shape = Rectangle;
		style.normal = {
			background = solid(rgba(0.26, 0.26, 0.26, 1));
		}
		
		new ScrollbarButton button1 {
			arrowDir = 2;
		}
		
		[hexpand hfill] new HWidgetSlider slider {
			new Graphic {
				size = 17 17;
				style.normal = {
					image = grid("themes/default/img/scrollhandle.png", hline(3, 14), vline(3, 14));
					background = solid(white);
					border = 1 rgba(.1, .1, .1, .8);
				}
			}
			
			handleSize = .2;
			skip = false;
		}

		new ScrollbarButton button2 {
			arrowDir = 0;
		}
	}
	
	handleSize = prop(slider.handleSize);
	position = prop(slider.position);
	skipSize = prop(slider.skipSize);

	button1 = sub(button1);
	button2 = sub(button2);
	slider = sub(slider);
}



widget VScrollbar {
	[vexpand vfill] new VBox {
		shape = Rectangle;
		style.normal = {
			background = solid(rgba(0.26, 0.26, 0.26, 1));
		}

		new ScrollbarButton button1 {
			arrowDir = 1;
		}
		
		[vexpand vfill] new VWidgetSlider slider {
			new Graphic {
				size = 17 17;
				style.normal = {
					image = grid("themes/default/img/scrollhandle.png", hline(3, 14), vline(3, 14));
					background = solid(white);
					border = 1 rgba(.1, .1, .1, .8);
				}
			}
			
			handleSize = .2;
			skip = false;
		}

		new ScrollbarButton button2 {
			arrowDir = 3;
		}
	}

	handleSize = prop(slider.handleSize);
	position = prop(slider.position);
	skipSize = prop(slider.skipSize);

	button1 = sub(button1);
	button2 = sub(button2);
	slider = sub(slider);
}