pondering all over again

src/main/java/com/simibubi/create/compat/jei/category/BlockzapperUpgradeCategory.java

@@ -88,7 +88,7 @@ public class BlockzapperUpgradeCategory extends CreateRecipeCategory<Blockzapper
 		font.drawWithShadow(matrixStack, textComponent, (BLOCKZAPPER_UPGRADE_RECIPE.width - font.getStringWidth(textComponent.getString())) / 2f, 57, 0x8B8B8B);
 
 		GuiGameElement.of(recipe.getRecipeOutput())
-				.at(90, 0)
+				.<GuiGameElement.GuiRenderBuilder>at(90, 0)
 				.scale(3.5)
 				.render(matrixStack);
 	}

src/main/java/com/simibubi/create/compat/jei/category/PolishingCategory.java

@@ -73,7 +73,7 @@ public class PolishingCategory extends CreateRecipeCategory<SandPaperPolishingRe
 		tag.put("Polishing", matchingStacks[0].serializeNBT());
 		tag.putBoolean("JEI", true);
 		GuiGameElement.of(renderedSandpaper)
-				.at(getBackground().getWidth() / 2 - 16, 0, 0)
+				.<GuiGameElement.GuiRenderBuilder>at(getBackground().getWidth() / 2 - 16, 0, 0)
 				.scale(2)
 				.render(matrixStack);
 	}

src/main/java/com/simibubi/create/content/contraptions/goggles/GoggleConfigScreen.java

@@ -8,7 +8,7 @@ import com.simibubi.create.AllItems;
 import com.simibubi.create.foundation.config.AllConfigs;
 import com.simibubi.create.foundation.gui.AbstractSimiScreen;
 import com.simibubi.create.foundation.gui.GuiGameElement;
-import com.simibubi.create.foundation.gui.UIRenderHelper;
+import com.simibubi.create.foundation.ponder.ui.PonderButton;
 import com.simibubi.create.foundation.utility.Lang;
 
 import net.minecraft.client.Minecraft;
@@ -23,6 +23,8 @@ public class GoggleConfigScreen extends AbstractSimiScreen {
 	private int offsetY;
 	private final List<ITextComponent> tooltip;
 
+	private PonderButton w1, w2, w3;
+
 	public GoggleConfigScreen() {
 		ITextComponent componentSpacing = new StringTextComponent("    ");
 		tooltip = new ArrayList<>();
@@ -47,6 +49,16 @@ public class GoggleConfigScreen extends AbstractSimiScreen {
 
 		offsetX = AllConfigs.CLIENT.overlayOffsetX.get();
 		offsetY = AllConfigs.CLIENT.overlayOffsetY.get();
+
+		widgets.clear();
+		widgets.add(w1 = new PonderButton(50, 50)
+				.enableFade(0, 5));
+
+		widgets.add(w2 = new PonderButton(100, 50)
+				.enableFade(0, 5));
+
+		widgets.add(w3 = new PonderButton(150, 50));
+
 	}
 
 	@Override
@@ -80,6 +92,17 @@ public class GoggleConfigScreen extends AbstractSimiScreen {
 		int posY = this.height / 2 + offsetY;
 		renderTooltip(ms, tooltip, posX, posY);
 
+		w1.fade().setValue(0.5);
+		w1.fade().setValue(0.5);
+
+		w2.fade().setValue(0.75);
+		w2.fade().setValue(0.75);
+
+		w1.flash();
+		w2.flash();
+		w3.flash();
+
+
 		//UIRenderHelper.breadcrumbArrow(ms, 50, 50, 100, 50, 20, 10, 0x80aa9999, 0x10aa9999);
 		//UIRenderHelper.breadcrumbArrow(ms, 100, 80, 0, -50, 20, -10, 0x80aa9999, 0x10aa9999);
 

src/main/java/com/simibubi/create/content/contraptions/relays/advanced/sequencer/SequencedGearshiftScreen.java

@@ -153,7 +153,7 @@ public class SequencedGearshiftScreen extends AbstractSimiScreen {
 			0xffffff);
 
 		GuiGameElement.of(renderedItem)
-			.at(guiLeft + background.width + 10, guiTop + 100, -150)
+			.<GuiGameElement.GuiRenderBuilder>at(guiLeft + background.width + 10, guiTop + 100, -150)
 			.scale(5)
 			.render(matrixStack);
 	}

src/main/java/com/simibubi/create/content/curiosities/symmetry/SymmetryWandScreen.java

@@ -123,7 +123,7 @@ public class SymmetryWandScreen extends AbstractSimiScreen {
 
 		renderBlock(matrixStack);
 		GuiGameElement.of(wand)
-			.at(guiLeft + 190, guiTop + 420, -150)
+			.<GuiGameElement.GuiRenderBuilder>at(guiLeft + 190, guiTop + 420, -150)
 			.scale(4)
 			.rotate(-70, 20, 20)
 			.render(matrixStack);

src/main/java/com/simibubi/create/content/curiosities/zapper/ZapperScreen.java

@@ -133,7 +133,7 @@ public class ZapperScreen extends AbstractSimiScreen {
 
 	protected void renderZapper(MatrixStack matrixStack) {
 		GuiGameElement.of(zapper)
-			.at((this.width - this.sWidth) / 2 + 200, this.height / 2 - this.sHeight / 4 + 25, -150)
+			.<GuiGameElement.GuiRenderBuilder>at((this.width - this.sWidth) / 2 + 200, this.height / 2 - this.sHeight / 4 + 25, -150)
 			.scale(4)
 			.render(matrixStack);
 	}

src/main/java/com/simibubi/create/content/logistics/block/inventories/AdjustableCrateScreen.java

@@ -97,7 +97,7 @@ public class AdjustableCrateScreen extends AbstractSimiContainerScreen<Adjustabl
 		}
 
 		GuiGameElement.of(renderedItem)
-				.at(guiLeft + ADJUSTABLE_CRATE.width + 110, guiTop + 70, -150)
+				.<GuiGameElement.GuiRenderBuilder>at(guiLeft + ADJUSTABLE_CRATE.width + 110, guiTop + 70, -150)
 				.scale(5)
 				.render(matrixStack);
 	}

src/main/java/com/simibubi/create/content/logistics/block/redstone/StockpileSwitchScreen.java

@@ -1,5 +1,7 @@
 package com.simibubi.create.content.logistics.block.redstone;
 
+import static com.simibubi.create.foundation.gui.AllGuiTextures.STOCKSWITCH;
+
 import com.mojang.blaze3d.matrix.MatrixStack;
 import com.simibubi.create.AllBlocks;
 import com.simibubi.create.content.logistics.packet.ConfigureStockswitchPacket;
@@ -13,13 +15,12 @@ import com.simibubi.create.foundation.networking.AllPackets;
 import com.simibubi.create.foundation.utility.Lang;
 import com.simibubi.create.foundation.utility.animation.LerpedFloat;
 import com.simibubi.create.foundation.utility.animation.LerpedFloat.Chaser;
+
 import net.minecraft.client.Minecraft;
 import net.minecraft.item.ItemStack;
 import net.minecraft.util.text.ITextComponent;
 import net.minecraft.util.text.StringTextComponent;
 
-import static com.simibubi.create.foundation.gui.AllGuiTextures.STOCKSWITCH;
-
 public class StockpileSwitchScreen extends AbstractSimiScreen {
 
 	private ScrollInput offBelow;
@@ -125,7 +126,7 @@ public class StockpileSwitchScreen extends AbstractSimiScreen {
 
 		matrixStack.push();
 		GuiGameElement.of(renderedItem)
-				.at(guiLeft + STOCKSWITCH.width + 15, guiTop + 40, -250)
+				.<GuiGameElement.GuiRenderBuilder>at(guiLeft + STOCKSWITCH.width + 15, guiTop + 40, -250)
 				.scale(5)
 				.render(matrixStack);
 		matrixStack.pop();

src/main/java/com/simibubi/create/content/logistics/item/filter/AbstractFilterScreen.java

@@ -1,5 +1,11 @@
 package com.simibubi.create.content.logistics.item.filter;
 
+import static com.simibubi.create.foundation.gui.AllGuiTextures.PLAYER_INVENTORY;
+import static net.minecraft.util.text.TextFormatting.GRAY;
+
+import java.util.Collections;
+import java.util.List;
+
 import com.google.common.collect.ImmutableList;
 import com.mojang.blaze3d.matrix.MatrixStack;
 import com.simibubi.create.content.logistics.item.filter.FilterScreenPacket.Option;
@@ -13,6 +19,7 @@ import com.simibubi.create.foundation.gui.widgets.Indicator.State;
 import com.simibubi.create.foundation.item.ItemDescription.Palette;
 import com.simibubi.create.foundation.item.TooltipHelper;
 import com.simibubi.create.foundation.networking.AllPackets;
+
 import net.minecraft.client.gui.widget.Widget;
 import net.minecraft.client.renderer.Rectangle2d;
 import net.minecraft.client.resources.I18n;
@@ -20,12 +27,6 @@ import net.minecraft.entity.player.PlayerInventory;
 import net.minecraft.util.text.IFormattableTextComponent;
 import net.minecraft.util.text.ITextComponent;
 
-import java.util.Collections;
-import java.util.List;
-
-import static com.simibubi.create.foundation.gui.AllGuiTextures.PLAYER_INVENTORY;
-import static net.minecraft.util.text.TextFormatting.GRAY;
-
 public abstract class AbstractFilterScreen<F extends AbstractFilterContainer> extends AbstractSimiContainerScreen<F> {
 
 	protected AllGuiTextures background;
@@ -68,7 +69,7 @@ public abstract class AbstractFilterScreen<F extends AbstractFilterContainer> ex
 		textRenderer.draw(ms, I18n.format(container.filterItem.getTranslationKey()), x + 15, y + 3, 0xdedede);
 
 		GuiGameElement.of(container.filterItem)
-				.at(x + background.width, guiTop + background.height - 60)
+				.<GuiGameElement.GuiRenderBuilder>at(x + background.width, guiTop + background.height - 60)
 				.scale(5)
 				.render(ms);
 

src/main/java/com/simibubi/create/content/schematics/block/SchematicTableScreen.java

@@ -1,5 +1,12 @@
 package com.simibubi.create.content.schematics.block;
 
+import static com.simibubi.create.foundation.gui.AllGuiTextures.SCHEMATIC_TABLE;
+import static com.simibubi.create.foundation.gui.AllGuiTextures.SCHEMATIC_TABLE_PROGRESS;
+
+import java.nio.file.Paths;
+import java.util.ArrayList;
+import java.util.List;
+
 import com.mojang.blaze3d.matrix.MatrixStack;
 import com.mojang.blaze3d.systems.RenderSystem;
 import com.simibubi.create.AllBlocks;
@@ -14,6 +21,7 @@ import com.simibubi.create.foundation.gui.widgets.Label;
 import com.simibubi.create.foundation.gui.widgets.ScrollInput;
 import com.simibubi.create.foundation.gui.widgets.SelectionScrollInput;
 import com.simibubi.create.foundation.utility.Lang;
+
 import net.minecraft.client.gui.IHasContainer;
 import net.minecraft.client.renderer.Rectangle2d;
 import net.minecraft.entity.player.PlayerInventory;
@@ -23,13 +31,6 @@ import net.minecraft.util.math.MathHelper;
 import net.minecraft.util.text.ITextComponent;
 import net.minecraft.util.text.StringTextComponent;
 
-import java.nio.file.Paths;
-import java.util.ArrayList;
-import java.util.List;
-
-import static com.simibubi.create.foundation.gui.AllGuiTextures.SCHEMATIC_TABLE;
-import static com.simibubi.create.foundation.gui.AllGuiTextures.SCHEMATIC_TABLE_PROGRESS;
-
 public class SchematicTableScreen extends AbstractSimiContainerScreen<SchematicTableContainer>
 	implements IHasContainer<SchematicTableContainer> {
 
@@ -121,7 +122,7 @@ public class SchematicTableScreen extends AbstractSimiContainerScreen<SchematicT
 			textRenderer.drawWithShadow(matrixStack, noSchematics, mainLeft + 54, mainTop + 26, 0xd3d3d3);
 
 		GuiGameElement.of(renderedItem)
-			.at(mainLeft + 217, mainTop + 50, -150)
+			.<GuiGameElement.GuiRenderBuilder>at(mainLeft + 217, mainTop + 50, -150)
 			.scale(3)
 			.render(matrixStack);
 

src/main/java/com/simibubi/create/content/schematics/block/SchematicannonScreen.java

@@ -262,7 +262,7 @@ public class SchematicannonScreen extends AbstractSimiContainerScreen<Schematica
 			renderBlueprintHighlight(matrixStack);
 
 		GuiGameElement.of(renderedItem)
-			.at(guiLeft + 230, guiTop + 110, -200)
+			.<GuiGameElement.GuiRenderBuilder>at(guiLeft + 230, guiTop + 110, -200)
 			.scale(5)
 			.render(matrixStack);
 
@@ -274,7 +274,7 @@ public class SchematicannonScreen extends AbstractSimiContainerScreen<Schematica
 		if (te.missingItem != null) {
 			stringWidth += 15;
 			GuiGameElement.of(te.missingItem)
-				.at(guiLeft + 150, guiTop + 46, 100)
+				.<GuiGameElement.GuiRenderBuilder>at(guiLeft + 150, guiTop + 46, 100)
 				.scale(1)
 				.render(matrixStack);
 		}

src/main/java/com/simibubi/create/content/schematics/client/SchematicEditScreen.java

@@ -152,7 +152,7 @@ public class SchematicEditScreen extends AbstractSimiScreen {
 			x + 93 - textRenderer.getStringWidth(handler.getCurrentSchematicName()) / 2, y + 3, 0xffffff);
 
 		GuiGameElement.of(AllItems.SCHEMATIC.asStack())
-				.at(guiLeft + 200, guiTop + 82, 0)
+				.<GuiGameElement.GuiRenderBuilder>at(guiLeft + 200, guiTop + 82, 0)
 				.scale(3)
 				.render(matrixStack);
 	}

src/main/java/com/simibubi/create/foundation/config/ui/ConfigScreen.java

@@ -27,21 +27,15 @@ public abstract class ConfigScreen extends AbstractSimiScreen {
 
 	/*
 	 *
-	 * TODO
 	 * zelo's list for configUI
+	 * TODO
 	 *
-	 * adjust transition animation of screens -> disabled for now
+	 * replace java's awt color with something mutable
-	 * move config button's animations to ponder button or a new superclass
-	 * get some proper icons for reset button and enum cycle
-	 *
-	 * some color themes maybe?
-	 * at least a helper class to unite colors throughout different uis
 	 *
 	 * FIXME
 	 *
-	 * tooltip are hidden underneath the scrollbar, if the bar is near the middle
+	 * tooltips are hidden underneath the scrollbar, if the bar is near the middle
-	 * misalignment of the label-streak and textboxes/enum stuff
+	 * framebuffer blending is incorrect -> wait for jozu's changes to merge
-	 * framebuffer blending is incorrect
 	 *
 	 * */
 

src/main/java/com/simibubi/create/foundation/config/ui/ConfigScreenList.java

@@ -43,6 +43,8 @@ public class ConfigScreenList extends ExtendedList<ConfigScreenList.Entry> {
 
 		UIRenderHelper.angledGradient(ms, 90, left + width / 2, top, width, 5, 0x60_000000, 0x0);
 		UIRenderHelper.angledGradient(ms, -90, left + width / 2, bottom, width, 5, 0x60_000000, 0x0);
+		UIRenderHelper.angledGradient(ms, 0, left, top + height / 2, height, 5, 0x60_000000, 0x0);
+		UIRenderHelper.angledGradient(ms, 180, right, top + height / 2, height, 5, 0x60_000000, 0x0);
 
 		super.render(ms, mouseX, mouseY, partialTicks);
 	}

src/main/java/com/simibubi/create/foundation/config/ui/SubMenuConfigScreen.java

@@ -23,6 +23,7 @@ import com.simibubi.create.foundation.gui.Theme;
 import com.simibubi.create.foundation.gui.UIRenderHelper;
 import com.simibubi.create.foundation.gui.widgets.BoxWidget;
 import com.simibubi.create.foundation.item.TooltipHelper;
+import com.simibubi.create.foundation.networking.AllPackets;
 
 import net.minecraft.client.Minecraft;
 import net.minecraft.client.gui.IGuiEventListener;
@@ -78,6 +79,9 @@ public class SubMenuConfigScreen extends ConfigScreen {
 		changes.forEach((path, value) -> {
 			ForgeConfigSpec.ConfigValue configValue = values.get(path);
 			configValue.set(value);
+			if (type == ModConfig.Type.SERVER) {
+				AllPackets.channel.sendToServer(new CConfigureConfigPacket<>(path, value));
+			}
 		});
 		clearChanges();
 	}

src/main/java/com/simibubi/create/foundation/config/ui/entries/EnumEntry.java

@@ -1,6 +1,8 @@
 package com.simibubi.create.foundation.config.ui.entries;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
+import com.simibubi.create.foundation.gui.AllIcons;
+import com.simibubi.create.foundation.gui.DelegatedStencilElement;
 import com.simibubi.create.foundation.gui.TextStencilElement;
 import com.simibubi.create.foundation.gui.Theme;
 import com.simibubi.create.foundation.gui.UIRenderHelper;
@@ -23,12 +25,18 @@ public class EnumEntry extends ValueEntry<Enum<?>> {
 		valueText = new TextStencilElement(Minecraft.getInstance().fontRenderer, "YEP").centered(true, true);
 		valueText.withElementRenderer((ms, width, height, alpha) -> UIRenderHelper.angledGradient(ms, 0 ,0, height/2, height, width, Theme.i(Theme.Key.TEXT_1), Theme.i(Theme.Key.TEXT_2)));
 
-		TextStencilElement l = new TextStencilElement(Minecraft.getInstance().fontRenderer, "<").centered(true, true);
+		DelegatedStencilElement l = AllIcons.I_CONFIG_PREV.asStencil();
-		cycleLeft = new BoxWidget(0, 0, 22, 22).showingElement(l).withCallback(() -> cycleValue(-1));
+		cycleLeft = new BoxWidget(0, 0, 22, 22)
+				.showingElement(l)
+				.rescaleElement(16, 16)
+				.withCallback(() -> cycleValue(-1));
 		l.withElementRenderer(BoxWidget.gradientFactory.apply(cycleLeft));
 
-		TextStencilElement r = new TextStencilElement(Minecraft.getInstance().fontRenderer, ">").centered(true, true);
+		DelegatedStencilElement r = AllIcons.I_CONFIG_NEXT.asStencil();
-		cycleRight = new BoxWidget(0, 0, 22, 22).showingElement(r).withCallback(() -> cycleValue(1));
+		cycleRight = new BoxWidget(0, 0, 22, 22)
+				.showingElement(r)
+				.rescaleElement(16, 16)
+				.withCallback(() -> cycleValue(1));
 		r.withElementRenderer(BoxWidget.gradientFactory.apply(cycleRight));
 
 		listeners.add(cycleLeft);
@@ -66,16 +74,16 @@ public class EnumEntry extends ValueEntry<Enum<?>> {
 		super.render(ms, index, y, x, width, height, mouseX, mouseY, p_230432_9_, partialTicks);
 
 		cycleLeft.x = x + getLabelWidth(width) + 2;
-		cycleLeft.y = y + 10;
+		cycleLeft.y = y + 12;
 		cycleLeft.render(ms, mouseX, mouseY, partialTicks);
 
 		valueText
-				.at(cycleLeft.x - 2 + cycleWidth, y + 10, 0)
+				.at(cycleLeft.x - 4 + cycleWidth, y + 12, 0)
-				.withBounds(width - getLabelWidth(width) - 2 * cycleWidth - resetWidth, 30)
+				.withBounds(width - getLabelWidth(width) - 2 * cycleWidth - resetWidth - 4, 22)
 				.render(ms);
 
 		cycleRight.x = x + width - cycleWidth - resetWidth + 2;
-		cycleRight.y = y + 10;
+		cycleRight.y = y + 12;
 		cycleRight.render(ms, mouseX, mouseY, partialTicks);
 
 	}

src/main/java/com/simibubi/create/foundation/config/ui/entries/NumberEntry.java

@@ -38,7 +38,7 @@ public abstract class NumberEntry<T extends Number> extends ValueEntry<T> {
 
 	public NumberEntry(String label, ForgeConfigSpec.ConfigValue<T> value, ForgeConfigSpec.ValueSpec spec) {
 		super(label, value, spec);
-		textField = new ConfigTextField(Minecraft.getInstance().fontRenderer, 0, 0, 200, 30, unit);
+		textField = new ConfigTextField(Minecraft.getInstance().fontRenderer, 0, 0, 200, 26, unit);
 		textField.setText(String.valueOf(getValue()));
 
 		Object range = spec.getRange();
@@ -54,13 +54,13 @@ public abstract class NumberEntry<T extends Number> extends ValueEntry<T> {
 			if (!min.equals(getTypeMin())) {
 				StringTextComponent t = new StringTextComponent(formatBound(min) + " < ");
 				minText = new TextStencilElement(font, t).centered(true, false);
-				minText.withElementRenderer((ms, width, height, alpha) -> UIRenderHelper.angledGradient(ms, 0 ,0, height/2, height, width, Theme.c(Theme.Key.TEXT_ACCENT_1).darker().getRGB(), Theme.c(Theme.Key.TEXT_ACCENT_2).darker().getRGB()));
+				minText.withElementRenderer((ms, width, height, alpha) -> UIRenderHelper.angledGradient(ms, 0 ,0, height/2, height, width, Theme.c(Theme.Key.TEXT_1).darker().getRGB(), Theme.c(Theme.Key.TEXT_2).darker().getRGB()));
 				minOffset = font.getWidth(t);
 			}
 			if (!max.equals(getTypeMax())) {
 				StringTextComponent t = new StringTextComponent(" < " + formatBound(max));
 				maxText = new TextStencilElement(font, t).centered(true, false);
-				maxText.withElementRenderer((ms, width, height, alpha) -> UIRenderHelper.angledGradient(ms, 0 ,0, height/2, height, width, Theme.c(Theme.Key.TEXT_ACCENT_1).darker().getRGB(), Theme.c(Theme.Key.TEXT_ACCENT_2).darker().getRGB()));
+				maxText.withElementRenderer((ms, width, height, alpha) -> UIRenderHelper.angledGradient(ms, 0 ,0, height/2, height, width, Theme.c(Theme.Key.TEXT_1).darker().getRGB(), Theme.c(Theme.Key.TEXT_2).darker().getRGB()));
 				maxOffset = font.getWidth(t);
 			}
 		} catch (NoSuchFieldException | IllegalAccessException | ClassCastException | NullPointerException ignored) {
@@ -126,7 +126,7 @@ public abstract class NumberEntry<T extends Number> extends ValueEntry<T> {
 		textField.x = x + getLabelWidth(width) + minOffset;
 		textField.y = y + 10;
 		textField.setWidth(width - getLabelWidth(width) - resetWidth - minOffset - maxOffset);
-		textField.setHeight(30);
+		textField.setHeight(26);
 		textField.render(ms, mouseX, mouseY, partialTicks);
 
 		if (minText != null)

src/main/java/com/simibubi/create/foundation/gui/AllIcons.java

@@ -132,7 +132,9 @@ public class AllIcons implements IScreenRenderable {
 		I_CONFIG_DISCARD = next(),
 		I_CONFIG_SAVE = next(),
 		I_CONFIG_RESET = next(),
-		I_CONFIG_BACK = next();
+		I_CONFIG_BACK = next(),
+		I_CONFIG_PREV = next(),
+		I_CONFIG_NEXT = next();
 
 	public AllIcons(int x, int y) {
 		iconX = x * 16;

src/main/java/com/simibubi/create/foundation/gui/BoxElement.java

@@ -6,6 +6,7 @@ import org.lwjgl.opengl.GL11;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
 import com.mojang.blaze3d.systems.RenderSystem;
+import com.simibubi.create.foundation.utility.ColorHelper;
 
 import net.minecraft.client.renderer.BufferBuilder;
 import net.minecraft.client.renderer.Tessellator;
@@ -85,10 +86,11 @@ public class BoxElement extends RenderElement {
 		RenderSystem.enableBlend();
 		RenderSystem.defaultBlendFunc();
 		RenderSystem.shadeModel(GL11.GL_SMOOTH);
-		RenderSystem.color4f(1, 1, 1, alpha);
 
 		int f = borderOffset;
-		Color c1 = background, c2 = borderTop, c3 = borderBot;
+		Color c1 = ColorHelper.applyAlpha(background, alpha);
+		Color c2 = ColorHelper.applyAlpha(borderTop, alpha);
+		Color c3 = ColorHelper.applyAlpha(borderBot, alpha);
 		Tessellator tessellator = Tessellator.getInstance();
 		BufferBuilder b = tessellator.getBuffer();
 		Matrix4f model = ms.peek().getModel();
@@ -146,6 +148,5 @@ public class BoxElement extends RenderElement {
 		RenderSystem.shadeModel(GL11.GL_FLAT);
 		RenderSystem.disableBlend();
 		RenderSystem.enableTexture();
-		RenderSystem.color4f(1, 1, 1, 1);
 	}
 }

src/main/java/com/simibubi/create/foundation/gui/ConfirmationScreen.java

@@ -176,7 +176,7 @@ public class ConfirmationScreen extends AbstractSimiScreen {
 		//ms.scale(1, 1, 0.01f);
 		//todo wait for jozu's framebuffer capabilities on the other branch and use them here
 		UIRenderHelper.framebuffer.bindFramebuffer(true);
-		source.render(ms, mouseX, mouseY, partialTicks);
+		source.render(ms, mouseX, mouseY, 10);
 		UIRenderHelper.framebuffer.unbindFramebuffer();
 		Minecraft.getInstance().getFramebuffer().bindFramebuffer(true);
 		ms.pop();

src/main/java/com/simibubi/create/foundation/gui/GuiGameElement.java

@@ -63,22 +63,22 @@ public class GuiGameElement {
 			.with(FlowingFluidBlock.LEVEL, 0));
 	}
 
-	public static abstract class GuiRenderBuilder {
+	public static abstract class GuiRenderBuilder extends RenderElement {
-		double xBeforeScale, yBeforeScale, zBeforeScale = 0;
+		//double xBeforeScale, yBeforeScale, zBeforeScale = 0;
-		double x, y, z;
+		double xLocal, yLocal, zLocal;
 		double xRot, yRot, zRot;
 		double scale = 1;
 		int color = 0xFFFFFF;
 		Vector3d rotationOffset = Vector3d.ZERO;
 
 		public GuiRenderBuilder atLocal(double x, double y, double z) {
-			this.x = x;
+			this.xLocal = x;
-			this.y = y;
+			this.yLocal = y;
-			this.z = z;
+			this.zLocal = z;
 			return this;
 		}
 
-		public GuiRenderBuilder at(double x, double y) {
+		/*public GuiRenderBuilder at(double x, double y) {
 			this.xBeforeScale = x;
 			this.yBeforeScale = y;
 			return this;
@@ -89,7 +89,7 @@ public class GuiGameElement {
 			this.yBeforeScale = y;
 			this.zBeforeScale = z;
 			return this;
-		}
+		}*/
 
 		public GuiRenderBuilder rotate(double xRot, double yRot, double zRot) {
 			this.xRot = xRot;
@@ -136,9 +136,9 @@ public class GuiGameElement {
 
 		@Deprecated
 		protected void transform() {
-			RenderSystem.translated(xBeforeScale, yBeforeScale, 0);
+			RenderSystem.translated(x, y, 0);
 			RenderSystem.scaled(scale, scale, scale);
-			RenderSystem.translated(x, y, z);
+			RenderSystem.translated(xLocal, yLocal, zLocal);
 			RenderSystem.scaled(1, -1, 1);
 			RenderSystem.translated(rotationOffset.x, rotationOffset.y, rotationOffset.z);
 			RenderSystem.rotatef((float) zRot, 0, 0, 1);
@@ -148,9 +148,9 @@ public class GuiGameElement {
 		}
 
 		protected void transformMatrix(MatrixStack matrixStack) {
-			matrixStack.translate(xBeforeScale, yBeforeScale, zBeforeScale);
-			matrixStack.scale((float) scale, (float) scale, (float) scale);
 			matrixStack.translate(x, y, z);
+			matrixStack.scale((float) scale, (float) scale, (float) scale);
+			matrixStack.translate(xLocal, yLocal, zLocal);
 			matrixStack.scale(1, -1, 1);
 			matrixStack.translate(rotationOffset.x, rotationOffset.y, rotationOffset.z);
 			matrixStack.multiply(Vector3f.POSITIVE_Z.getDegreesQuaternion((float) zRot));

src/main/java/com/simibubi/create/foundation/gui/RenderElement.java

@@ -8,6 +8,10 @@ public abstract class RenderElement implements IScreenRenderable {
 
 	public static RenderElement EMPTY = new RenderElement() {@Override public void render(MatrixStack ms) {}};
 
+	public static RenderElement of(IScreenRenderable renderable) {
+		return new SimpleRenderElement(renderable);
+	}
+
 	protected int width = 16, height = 16;
 	protected float x = 0, y = 0, z = 0;
 	protected float alpha = 1f;
@@ -48,6 +52,18 @@ public abstract class RenderElement implements IScreenRenderable {
 		return height;
 	}
 
+	public float getX() {
+		return x;
+	}
+
+	public float getY() {
+		return y;
+	}
+
+	public float getZ() {
+		return z;
+	}
+
 	public abstract void render(MatrixStack ms);
 
 	@Override
@@ -59,4 +75,18 @@ public abstract class RenderElement implements IScreenRenderable {
 	public void draw(MatrixStack ms, int x, int y) {
 		this.at(x, y).render(ms);
 	}
+
+	public static class SimpleRenderElement extends RenderElement {
+
+		private IScreenRenderable renderable;
+
+		public SimpleRenderElement(IScreenRenderable renderable) {
+			this.renderable = renderable;
+		}
+
+		@Override
+		public void render(MatrixStack ms) {
+			renderable.draw(ms, (int) x, (int) y);
+		}
+	}
 }

src/main/java/com/simibubi/create/foundation/gui/widgets/AbstractSimiWidget.java

@@ -14,6 +14,7 @@ import net.minecraft.util.text.StringTextComponent;
 
 public abstract class AbstractSimiWidget extends Widget {
 
+	protected float z;
 	protected boolean wasHovered = false;
 	protected List<ITextComponent> toolTip = new LinkedList<>();
 	protected BiConsumer<Integer, Integer> onClick = (_$, _$$) -> {};
@@ -40,6 +41,12 @@ public abstract class AbstractSimiWidget extends Widget {
 		return withCallback((_$, _$$) -> cb.run());
 	}
 
+	public <T extends AbstractSimiWidget> T atZLevel(float z) {
+		this.z = z;
+		//noinspection unchecked
+		return (T) this;
+	}
+
 	public List<ITextComponent> getToolTip() {
 		return toolTip;
 	}

src/main/java/com/simibubi/create/foundation/gui/widgets/BoxWidget.java

@@ -23,8 +23,8 @@ public class BoxWidget extends ElementWidget {
 	protected Color customBorderBot;
 	protected boolean animateColors = true;
 	protected LerpedFloat colorAnimation = LerpedFloat.linear();
-	protected Color gradientColor1 = Theme.c(Theme.Key.BUTTON_IDLE_1), gradientColor2 = Theme.c(Theme.Key.BUTTON_IDLE_2);
+	protected Color gradientColor1, gradientColor2;
-	private Color colorTarget1, colorTarget2;
+	private Color colorTarget1 = Theme.c(Theme.Key.BUTTON_IDLE_1), colorTarget2 = Theme.c(Theme.Key.BUTTON_IDLE_2);
 	private Color previousColor1, previousColor2;
 
 	public BoxWidget() {
@@ -34,28 +34,40 @@ public class BoxWidget extends ElementWidget {
 	public BoxWidget(int x, int y) {
 		this(x, y, 16, 16);
 	}
+
 	public BoxWidget(int x, int y, int width, int height) {
 		super(x, y, width, height);
 		box = new BoxElement()
 				.at(x, y)
 				.withBounds(width, height);
+		gradientColor1 = colorTarget1;
+		gradientColor2 = colorTarget2;
 	}
 
-	public BoxWidget withBounds(int width, int height) {
+	public <T extends BoxWidget> T withBounds(int width, int height) {
 		this.width = width;
 		this.height = height;
-		return this;
+		//noinspection unchecked
+		return (T) this;
 	}
 
-	public BoxWidget withBorderColors(Color top, Color bot) {
+	public <T extends BoxWidget> T withBorderColors(Color top, Color bot) {
 		this.customBorderTop = top;
 		this.customBorderBot = bot;
 		updateColorsFromState();
-		return this;
+		//noinspection unchecked
+		return (T) this;
+	}
+
+	public <T extends BoxWidget> T animateColors(boolean b) {
+		this.animateColors = b;
+		//noinspection unchecked
+		return (T) this;
 	}
 
 	@Override
 	public void tick() {
+		super.tick();
 		colorAnimation.tickChaser();
 	}
 
@@ -68,23 +80,6 @@ public class BoxWidget extends ElementWidget {
 		startGradientAnimation(getColorForState(true), getColorForState(false), true, 0.15);
 	}
 
-	@Override
-	public void renderButton(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
-		float fadeValue = fade.getValue(partialTicks);
-		if (fadeValue < .1f)
-			return;
-
-		box.withBackground(ColorHelper.applyAlpha(0xdd000000, fadeValue))
-				.gradientBorder(gradientColor1, gradientColor2)
-				.at(x, y)
-				.withBounds(width, height)
-				.render(ms);
-
-		super.renderButton(ms, mouseX, mouseY, partialTicks);
-
-		wasHovered = hovered;
-	}
-
 	@Override
 	protected void beforeRender(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
 		super.beforeRender(ms, mouseX, mouseY, partialTicks);
@@ -97,7 +92,10 @@ public class BoxWidget extends ElementWidget {
 			);
 		}
 
-		if (!colorAnimation.settled()) {
+		if (colorAnimation.settled()) {
+			gradientColor1 = colorTarget1;
+			gradientColor2 = colorTarget2;
+		} else {
 			float animationValue = 1 - Math.abs(colorAnimation.getValue(partialTicks));
 			gradientColor1 = ColorHelper.mixColors(previousColor1, colorTarget1, animationValue);
 			gradientColor2 = ColorHelper.mixColors(previousColor2, colorTarget2, animationValue);
@@ -105,6 +103,24 @@ public class BoxWidget extends ElementWidget {
 
 	}
 
+	@Override
+	public void renderButton(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
+		float fadeValue = fade.getValue(partialTicks);
+		if (fadeValue < .1f)
+			return;
+
+		box.withAlpha(fadeValue);
+		box.withBackground(Theme.c(Theme.Key.PONDER_BACKGROUND))
+				.gradientBorder(gradientColor1, gradientColor2)
+				.at(x, y, z)
+				.withBounds(width, height)
+				.render(ms);
+
+		super.renderButton(ms, mouseX, mouseY, partialTicks);
+
+		wasHovered = hovered;
+	}
+
 	@Override
 	public boolean isMouseOver(double mX, double mY) {
 		if (!active || !visible)
@@ -122,8 +138,8 @@ public class BoxWidget extends ElementWidget {
 	}
 
 	public void updateColorsFromState() {
-		gradientColor1 = getColorForState(true);
+		colorTarget1 = getColorForState(true);
-		gradientColor2 = getColorForState(false);
+		colorTarget2 = getColorForState(false);
 	}
 
 	public void animateGradientFromState() {
@@ -135,8 +151,12 @@ public class BoxWidget extends ElementWidget {
 	}
 
 	private void startGradientAnimation(Color c1, Color c2, boolean positive, double expSpeed) {
+		if (!animateColors)
+			return;
+
 		colorAnimation.startWithValue(positive ? 1 : -1);
 		colorAnimation.chase(0, expSpeed, LerpedFloat.Chaser.EXP);
+		colorAnimation.tickChaser();
 
 		previousColor1 = gradientColor1;
 		previousColor2 = gradientColor2;

src/main/java/com/simibubi/create/foundation/gui/widgets/ElementWidget.java

@@ -6,6 +6,7 @@ import java.util.function.UnaryOperator;
 import javax.annotation.Nonnull;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
+import com.simibubi.create.foundation.gui.IScreenRenderable;
 import com.simibubi.create.foundation.gui.RenderElement;
 import com.simibubi.create.foundation.utility.animation.LerpedFloat;
 
@@ -36,6 +37,10 @@ public class ElementWidget extends AbstractSimiWidget {
 		return (T) this;
 	}
 
+	public <T extends ElementWidget> T showing(IScreenRenderable renderable) {
+		return this.showingElement(RenderElement.of(renderable));
+	}
+
 	public <T extends ElementWidget> T modifyElement(Consumer<RenderElement> consumer) {
 		if (element != null)
 			consumer.accept(element);
@@ -66,6 +71,16 @@ public class ElementWidget extends AbstractSimiWidget {
 		return (T) this;
 	}
 
+	public LerpedFloat fade() {
+		return fade;
+	}
+
+	public <T extends ElementWidget> T fade(float target) {
+		fade.chase(target, 0.1, LerpedFloat.Chaser.EXP);
+		//noinspection unchecked
+		return (T) this;
+	}
+
 	public <T extends ElementWidget> T rescaleElement(float rescaleSizeX, float rescaleSizeY) {
 		this.rescaleElement = true;
 		this.rescaleSizeX = rescaleSizeX;
@@ -80,21 +95,39 @@ public class ElementWidget extends AbstractSimiWidget {
 		return (T) this;
 	}
 
+	@Override
+	public void tick() {
+		super.tick();
+		fade.tickChaser();
+	}
+
 	@Override
 	protected void beforeRender(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
 		super.beforeRender(ms, mouseX, mouseY, partialTicks);
 
-		//todo fade
+		float fadeValue = fade.getValue(partialTicks);
+		element.withAlpha(fadeValue);
+		if (fadeValue < 1) {
+			ms.translate((1 - fadeValue) * fadeModX, (1 - fadeValue) * fadeModY, 0);
+		}
 	}
 
 	@Override
 	public void renderButton(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
 		ms.push();
-		ms.translate(x, y, 0);
+		ms.translate(x, y, z);
+		//element x/y get treated as a border around the element
+		float eX = element.getX();
+		float eY = element.getY();
+		float eWidth = width - 2 * eX;
+		float eHeight = height - 2 * eY;
 		if (rescaleElement) {
-			ms.scale(width / rescaleSizeX, height / rescaleSizeY, 1);
+			float xScale = eWidth / rescaleSizeX;
+			float yScale = eHeight / rescaleSizeY;
+			ms.scale(xScale, yScale, 1);
+			element.at(eX / xScale, eY / yScale);
 		}
-		element.withBounds(width, height).render(ms);
+		element.withBounds((int) eWidth, (int) eHeight).render(ms);
 		ms.pop();
 	}
 

src/main/java/com/simibubi/create/foundation/ponder/NavigatableSimiScreen.java

@@ -13,6 +13,7 @@ import com.mojang.blaze3d.systems.RenderSystem;
 import com.simibubi.create.foundation.gui.AbstractSimiScreen;
 import com.simibubi.create.foundation.gui.IScreenRenderable;
 import com.simibubi.create.foundation.gui.ScreenOpener;
+import com.simibubi.create.foundation.gui.Theme;
 import com.simibubi.create.foundation.gui.UIRenderHelper;
 import com.simibubi.create.foundation.ponder.content.PonderTagScreen;
 import com.simibubi.create.foundation.ponder.ui.PonderButton;
@@ -77,9 +78,9 @@ public abstract class NavigatableSimiScreen extends AbstractSimiScreen {
 		if (screen instanceof PonderTagScreen)
 			icon = ((PonderTagScreen) screen).getTag();
 
-		widgets.add(backTrack = new PonderButton(31, height - 31 - PonderButton.SIZE, () -> {
+		widgets.add(backTrack = new PonderButton(31, height - 31 - 20)
-			ScreenOpener.openPreviousScreen(this, Optional.empty());
+				.enableFade(0, 5)
-		}).fade(0, -1));
+				.withCallback(() -> ScreenOpener.openPreviousScreen(this, Optional.empty())));
 		backTrack.fade(1);
 
 		if (icon != null)
@@ -98,7 +99,7 @@ public abstract class NavigatableSimiScreen extends AbstractSimiScreen {
 		ms.push();
 		ms.translate(0, 0, 500);
 		if (backTrack.isHovered()) {
-			textRenderer.draw(ms, Lang.translate(THINK_BACK), 15, height - 16, 0xffa3a3a3);
+			textRenderer.draw(ms, Lang.translate(THINK_BACK), 15, height - 16, Theme.i(Theme.Key.TEXT_2));
 			if (MathHelper.epsilonEquals(arrowAnimation.getValue(), arrowAnimation.getChaseTarget())) {
 				arrowAnimation.setValue(1);
 				arrowAnimation.setValue(1);//called twice to also set the previous value to 1
@@ -109,6 +110,17 @@ public abstract class NavigatableSimiScreen extends AbstractSimiScreen {
 
 	@Override
 	protected void renderWindowBackground(MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
+		if (backTrack != null) {
+			int x = (int) MathHelper.lerp(arrowAnimation.getValue(partialTicks), -9, 21);
+			int maxX = backTrack.x + backTrack.getWidth();
+
+			if (x + 30 < backTrack.x)
+				UIRenderHelper.breadcrumbArrow(ms, x + 30, height - 51, 0, maxX - (x + 30), 20, 5, 0x70aa9999, 0x30aa9999);
+
+			UIRenderHelper.breadcrumbArrow(ms, x, height - 51, 0, 30, 20, 5, 0x70aa9999, 0x30aa9999);
+			UIRenderHelper.breadcrumbArrow(ms, x - 30, height - 51, 0, 30, 20, 5, 0x70aa9999, 0x30aa9999);
+		}
+
 		if (transition.getChaseTarget() == 0 || transition.settled()) {
 			renderBackground(ms);
 			return;
@@ -164,17 +176,6 @@ public abstract class NavigatableSimiScreen extends AbstractSimiScreen {
 		ms.translate(depthPointX, depthPointY, 0);
 		ms.scale((float) scale, (float) scale, 1);
 		ms.translate(-depthPointX, -depthPointY, 0);
-
-		if (backTrack != null) {
-			int x = (int) MathHelper.lerp(arrowAnimation.getValue(partialTicks), -9, 21);
-			int maxX = backTrack.x + backTrack.getWidth();
-
-			if (x + 30 < backTrack.x)
-				UIRenderHelper.breadcrumbArrow(ms, x + 30, height - 51, 0, maxX - (x + 30), 20, 5, 0x40aa9999, 0x10aa9999);
-
-			UIRenderHelper.breadcrumbArrow(ms, x, height - 51, 0, 30, 20, 5, 0x40aa9999, 0x10aa9999);
-			UIRenderHelper.breadcrumbArrow(ms, x - 30, height - 51, 0, 30, 20, 5, 0x40aa9999, 0x10aa9999);
-		}
 	}
 
 	@Override

src/main/java/com/simibubi/create/foundation/ponder/PonderProgressBar.java

@@ -1,7 +1,12 @@
 package com.simibubi.create.foundation.ponder;
 
+import javax.annotation.Nonnull;
+
+import org.antlr.v4.runtime.misc.IntegerList;
+
 import com.mojang.blaze3d.matrix.MatrixStack;
-import com.mojang.blaze3d.systems.RenderSystem;
+import com.simibubi.create.foundation.gui.BoxElement;
+import com.simibubi.create.foundation.gui.Theme;
 import com.simibubi.create.foundation.gui.widgets.AbstractSimiWidget;
 import com.simibubi.create.foundation.utility.AnimationTickHolder;
 import com.simibubi.create.foundation.utility.ColorHelper;
@@ -12,9 +17,6 @@ import net.minecraft.client.audio.SoundHandler;
 import net.minecraft.client.gui.FontRenderer;
 import net.minecraftforge.fml.client.gui.GuiUtils;
 
-import javax.annotation.Nonnull;
-import org.antlr.v4.runtime.misc.IntegerList;
-
 public class PonderProgressBar extends AbstractSimiWidget {
 
 	LerpedFloat progress;
@@ -116,9 +118,16 @@ public class PonderProgressBar extends AbstractSimiWidget {
 		*   gradients have to be in front of the box so z>+100
 		* */
 
-		ms.push();
+		new BoxElement()
-		PonderUI.renderBox(ms, x, y, width, height, false);
+				.withBackground(0xff000000)
-		ms.pop();
+				.gradientBorder(Theme.i(Theme.Key.PONDER_IDLE_1), Theme.i(Theme.Key.PONDER_IDLE_2))
+				.at(x, y, 100)
+				.withBounds(width, height)
+				.render(ms);
+
+		//ms.push();
+		//PonderUI.renderBox(ms, x, y, width, height, false);
+		//ms.pop();
 
 		ms.push();
 		ms.translate(x - 2, y - 2, 0);

src/main/java/com/simibubi/create/foundation/ponder/PonderUI.java

@@ -8,7 +8,6 @@ import java.util.List;
 import java.util.Random;
 import java.util.stream.IntStream;
 
-import org.apache.commons.lang3.mutable.MutableBoolean;
 import org.lwjgl.opengl.GL11;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
@@ -16,8 +15,10 @@ import com.mojang.blaze3d.systems.RenderSystem;
 import com.simibubi.create.foundation.config.AllConfigs;
 import com.simibubi.create.foundation.gui.AllGuiTextures;
 import com.simibubi.create.foundation.gui.AllIcons;
+import com.simibubi.create.foundation.gui.BoxElement;
 import com.simibubi.create.foundation.gui.GuiGameElement;
 import com.simibubi.create.foundation.gui.ScreenOpener;
+import com.simibubi.create.foundation.gui.Theme;
 import com.simibubi.create.foundation.gui.UIRenderHelper;
 import com.simibubi.create.foundation.ponder.PonderScene.SceneTransform;
 import com.simibubi.create.foundation.ponder.content.DebugScenes;
@@ -43,14 +44,12 @@ import net.minecraft.client.MainWindow;
 import net.minecraft.client.Minecraft;
 import net.minecraft.client.gui.FontRenderer;
 import net.minecraft.client.gui.widget.Widget;
-import net.minecraft.client.settings.KeyBinding;
 import net.minecraft.item.ItemStack;
 import net.minecraft.util.Direction;
 import net.minecraft.util.ResourceLocation;
 import net.minecraft.util.math.BlockPos;
 import net.minecraft.util.math.MathHelper;
 import net.minecraft.util.math.MutableBoundingBox;
-import net.minecraft.util.math.vector.Matrix4f;
 import net.minecraft.util.math.vector.Vector3d;
 import net.minecraft.util.math.vector.Vector3f;
 import net.minecraft.util.text.IFormattableTextComponent;
@@ -166,13 +165,16 @@ public class PonderUI extends NavigatableSimiScreen {
 			int i = tagButtons.size();
 			int x = 31;
 			int y = 81 + i * 30;
-			PonderButton b = new PonderButton(x, y, (mouseX, mouseY) -> {
-				centerScalingOn(mouseX, mouseY);
-				ScreenOpener.transitionTo(new PonderTagScreen(t));
-			}).showing(t);
 
-			widgets.add(b);
+			PonderButton b2 = new PonderButton(x, y)
-			tagButtons.add(b);
+					.showing(t)
+					.withCallback((mX, mY) -> {
+						centerScalingOn(mX, mY);
+						ScreenOpener.transitionTo(new PonderTagScreen(t));
+					});
+
+			widgets.add(b2);
+			tagButtons.add(b2);
 
 			LerpedFloat chase = LerpedFloat.linear()
 				.startWithValue(0)
@@ -181,10 +183,10 @@ public class PonderUI extends NavigatableSimiScreen {
 
 		});
 
-		if (chapter != null) {
+		/*if (chapter != null) {
 			widgets.add(chap = new PonderButton(width - 31 - 24, 31, () -> {
 			}).showing(chapter));
-		}
+		}*/
 
 		GameSettings bindings = client.gameSettings;
 		int spacing = 8;
@@ -193,53 +195,63 @@ public class PonderUI extends NavigatableSimiScreen {
 
 		{
 			int pX = (width / 2) - 110;
-			int pY = bY + PonderButton.SIZE + 4;
+			int pY = bY + 20 + 4;
 			int pW = width - 2 * pX;
 			widgets.add(progressBar = new PonderProgressBar(this, pX, pY, pW, 1));
 		}
 
-		widgets.add(scan = new PonderButton(bX, bY, () -> {
+		widgets.add(scan = new PonderButton(bX, bY)
+				.withShortcut(bindings.keyBindDrop)
+				.showing(AllIcons.I_MTD_SCAN)
+				.enableFade(0, 5)
+				.withCallback(() -> {
 					identifyMode = !identifyMode;
 					if (!identifyMode)
 						scenes.get(index)
 								.deselect();
 					else
 						ponderPartialTicksPaused = client.getRenderPartialTicks();
-		}).showing(AllIcons.I_MTD_SCAN)
+				}));
-			.shortcut(bindings.keyBindDrop)
-			.fade(0, -1));
 
-		widgets.add(slowMode = new PonderButton(width - 20 - 31, bY, () -> {
+		widgets.add(slowMode = new PonderButton(width - 20 - 31, bY)
-			setComfyReadingEnabled(!isComfyReadingEnabled());
+				.showing(AllIcons.I_MTD_SLOW_MODE)
-		}).showing(AllIcons.I_MTD_SLOW_MODE)
+				.enableFade(0, 5)
-			.fade(0, -1));
+				.withCallback(() -> setComfyReadingEnabled(!isComfyReadingEnabled())));
 		
 		if (PonderIndex.EDITOR_MODE) {
-			widgets.add(userMode = new PonderButton(width - 50 - 31, bY, () -> {
+			widgets.add(userMode = new PonderButton(width - 50 - 31, bY)
-				userViewMode = !userViewMode;
+					.showing(AllIcons.I_MTD_USER_MODE)
-			}).showing(AllIcons.I_MTD_USER_MODE)
+					.enableFade(0, 5)
-				.fade(0, -1));
+					.withCallback(() -> userViewMode = !userViewMode));
 		}
 
 		bX += 50 + spacing;
-		widgets.add(left = new PonderButton(bX, bY, () -> this.scroll(false)).showing(AllIcons.I_MTD_LEFT)
+		widgets.add(left = new PonderButton(bX, bY)
-			.shortcut(bindings.keyBindLeft)
+				.withShortcut(bindings.keyBindLeft)
-			.fade(0, -1));
+				.showing(AllIcons.I_MTD_LEFT)
+				.enableFade(0, 5)
+				.withCallback(() -> this.scroll(false)));
 
 		bX += 20 + spacing;
-		widgets.add(close = new PonderButton(bX, bY, this::onClose).showing(AllIcons.I_MTD_CLOSE)
+		widgets.add(close = new PonderButton(bX, bY)
-			.shortcut(bindings.keyBindInventory)
+				.withShortcut(bindings.keyBindInventory)
-			.fade(0, -1));
+				.showing(AllIcons.I_MTD_CLOSE)
+				.enableFade(0, 5)
+				.withCallback(this::onClose));
 
 		bX += 20 + spacing;
-		widgets.add(right = new PonderButton(bX, bY, () -> this.scroll(true)).showing(AllIcons.I_MTD_RIGHT)
+		widgets.add(right = new PonderButton(bX, bY)
-			.shortcut(bindings.keyBindRight)
+				.withShortcut(bindings.keyBindRight)
-			.fade(0, -1));
+				.showing(AllIcons.I_MTD_RIGHT)
+				.enableFade(0, 5)
+				.withCallback(() -> this.scroll(true)));
 
 		bX += 50 + spacing;
-		widgets.add(replay = new PonderButton(bX, bY, this::replay).showing(AllIcons.I_MTD_REPLAY)
+		widgets.add(replay = new PonderButton(bX, bY)
-			.shortcut(bindings.keyBindBack)
+				.withShortcut(bindings.keyBindBack)
-			.fade(0, -1));
+				.showing(AllIcons.I_MTD_REPLAY)
+				.enableFade(0, 5)
+				.withCallback(this::replay));
 	}
 
 	@Override
@@ -544,10 +556,17 @@ public class PonderUI extends NavigatableSimiScreen {
 			int streakHeight = 35 - 9 + wordWrappedHeight;
 			UIRenderHelper.streak(ms, 0, x - 4, y - 12 + streakHeight / 2, streakHeight, (int) (150 * fade), 0x101010);
 			UIRenderHelper.streak(ms, 180, x - 4, y - 12 + streakHeight / 2, streakHeight, (int) (30 * fade), 0x101010);
-			renderBox(ms, 21, 21, 30, 30, false);
+			//renderBox(ms, 21, 21, 30, 30, false);
+			new BoxElement()
+					.withBackground(0xff000000)
+					.gradientBorder(Theme.i(Theme.Key.PONDER_IDLE_1), Theme.i(Theme.Key.PONDER_IDLE_2))
+					.at(21, 21, 100)
+					.withBounds(30, 30)
+					.render(ms);
+
 
 			GuiGameElement.of(stack)
-				.at(x - 39, y - 11)
+				.<GuiGameElement.GuiRenderBuilder>at(x - 39, y - 11)
 				.scale(2)
 				.render(ms);
 
@@ -640,15 +659,14 @@ public class PonderUI extends NavigatableSimiScreen {
 		// Widgets
 		widgets.forEach(w -> {
 			if (w instanceof PonderButton) {
-				PonderButton mtdButton = (PonderButton) w;
+				((PonderButton) w).fade().startWithValue(fade);
-				mtdButton.fade(fade);
 			}
 		});
 
 		if (index == 0 || index == 1 && lazyIndexValue < index)
-			left.fade(lazyIndexValue);
+			left.fade().startWithValue(lazyIndexValue);
 		if (index == scenes.size() - 1 || index == scenes.size() - 2 && lazyIndexValue > index)
-			right.fade(scenes.size() - lazyIndexValue - 1);
+			right.fade().startWithValue(scenes.size() - lazyIndexValue - 1);
 
 		boolean finished = activeScene.isFinished();
 		if (finished)
@@ -718,7 +736,7 @@ public class PonderUI extends NavigatableSimiScreen {
 		ms.pop();
 	}
 
-	protected void lowerButtonGroup(MatrixStack ms, int index, int mouseX, int mouseY, float fade, AllIcons icon, KeyBinding key) {
+	/*protected void lowerButtonGroup(MatrixStack ms, int index, int mouseX, int mouseY, float fade, AllIcons icon, KeyBinding key) {
 		int bWidth = 20;
 		int bHeight = 20;
 		int bX = (width - bWidth) / 2 + (index - 1) * (bWidth + 8);
@@ -732,7 +750,7 @@ public class PonderUI extends NavigatableSimiScreen {
 		icon.draw(ms, bX + 2, bY + 2);
 		drawCenteredText(ms, textRenderer, key.getBoundKeyLocalizedText(), bX + bWidth / 2 + 8, bY + bHeight - 6, 0xff606060);
 		ms.pop();
-	}
+	}*/
 
 	private void renderOverlay(MatrixStack ms, int i, float partialTicks) {
 		if (identifyMode)
@@ -745,7 +763,7 @@ public class PonderUI extends NavigatableSimiScreen {
 
 	@Override
 	public boolean mouseClicked(double x, double y, int button) {
-		MutableBoolean handled = new MutableBoolean(false);
+		/*MutableBoolean handled = new MutableBoolean(false);
 		widgets.forEach(w -> {
 			if (handled.booleanValue())
 				return;
@@ -760,7 +778,7 @@ public class PonderUI extends NavigatableSimiScreen {
 		});
 
 		if (handled.booleanValue())
-			return true;
+			return true;*/
 
 		if (identifyMode && hoveredBlockPos != null && PonderIndex.EDITOR_MODE) {
 			long handle = client.getWindow()
@@ -845,9 +863,9 @@ public class PonderUI extends NavigatableSimiScreen {
 		return hovered;
 	}
 
-	public static void renderBox(MatrixStack ms, int x, int y, int w, int h, boolean highlighted) {
+	/*public static void renderBox(MatrixStack ms, int x, int y, int w, int h, boolean highlighted) {
 		renderBox(ms, x, y, w, h, 0xff000000, highlighted ? 0xf0ffeedd : 0x40ffeedd, highlighted ? 0x60ffeedd : 0x20ffeedd);
-	}
+	}*/
 
 	public static void renderSpeechBox(MatrixStack ms, int x, int y, int w, int h, boolean highlighted, Pointing pointing,
 		boolean returnWithLocalTransform) {
@@ -895,7 +913,18 @@ public class PonderUI extends NavigatableSimiScreen {
 			break;
 		}
 
-		renderBox(ms, boxX, boxY, w, h, highlighted);
+		//renderBox(ms, boxX, boxY, w, h, highlighted);
+		BoxElement box = new BoxElement()
+				.withBackground(0xff000000)
+				.at(boxX, boxY, 100)
+				.withBounds(w, h);
+
+		if (highlighted)
+			box.gradientBorder(Theme.i(Theme.Key.PONDER_IDLE_1), Theme.i(Theme.Key.PONDER_IDLE_2));
+		else
+			box.gradientBorder(Theme.i(Theme.Key.PONDER_HIGHLIGHT_1), Theme.i(Theme.Key.PONDER_HIGHLIGHT_2));
+
+		box.render(ms);
 
 		ms.push();
 		AllGuiTextures toRender = highlighted ? AllGuiTextures.SPEECH_TOOLTIP_HIGHLIGHT : AllGuiTextures.SPEECH_TOOLTIP;
@@ -914,7 +943,7 @@ public class PonderUI extends NavigatableSimiScreen {
 
 	}
 
-	public static void renderBox(MatrixStack ms, int x, int y, int w, int h, int backgroundColor, int borderColorStart,
+	/*public static void renderBox(MatrixStack ms, int x, int y, int w, int h, int backgroundColor, int borderColorStart,
 		int borderColorEnd) {
 		int z = 100;
 		Matrix4f model = ms.peek().getModel();
@@ -927,7 +956,7 @@ public class PonderUI extends NavigatableSimiScreen {
 		GuiUtils.drawGradientRect(model, z, x + w + 2, y - 3 + 1, x + w + 3, y + h + 3 - 1, borderColorStart, borderColorEnd);
 		GuiUtils.drawGradientRect(model, z, x - 3, y - 3, x + w + 3, y - 3 + 1, borderColorStart, borderColorStart);
 		GuiUtils.drawGradientRect(model, z, x - 3, y + h + 2, x + w + 3, y + h + 3, borderColorEnd, borderColorEnd);
-	}
+	}*/
 
 	public ItemStack getHoveredTooltipItem() {
 		return hoveredTooltipItem;

src/main/java/com/simibubi/create/foundation/ponder/content/PonderIndexScreen.java

@@ -5,8 +5,6 @@ import java.util.List;
 import java.util.Objects;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
-import org.apache.commons.lang3.mutable.MutableBoolean;
-
 import com.simibubi.create.AllBlocks;
 import com.simibubi.create.content.contraptions.components.crank.ValveHandleBlock;
 import com.simibubi.create.foundation.gui.ScreenOpener;
@@ -106,17 +104,17 @@ public class PonderIndexScreen extends NavigatableSimiScreen {
 		int itemCenterY = (int) (height * itemYmult);
 
 		for (Item item : items) {
-			PonderButton button =
+			PonderButton b = new PonderButton(itemCenterX + layout.getX() + 4, itemCenterY + layout.getY() + 4)
-				new PonderButton(itemCenterX + layout.getX() + 4, itemCenterY + layout.getY() + 4, (x, y) -> {
+					.showing(new ItemStack(item))
+					.withCallback((x, y) -> {
 						if (!PonderRegistry.all.containsKey(item.getRegistryName()))
 							return;
 
 						centerScalingOn(x, y);
 						ScreenOpener.transitionTo(PonderUI.of(new ItemStack(item)));
-				}).showing(new ItemStack(item));
+					});
 
-			button.fade(1);
+			widgets.add(b);
-			widgets.add(button);
 			layout.next();
 		}
 
@@ -189,7 +187,7 @@ public class PonderIndexScreen extends NavigatableSimiScreen {
 		ms.pop();
 	}
 
-	@Override
+	/*@Override
 	public boolean mouseClicked(double x, double y, int button) {
 		MutableBoolean handled = new MutableBoolean(false);
 		widgets.forEach(w -> {
@@ -207,7 +205,7 @@ public class PonderIndexScreen extends NavigatableSimiScreen {
 		if (handled.booleanValue())
 			return true;
 		return super.mouseClicked(x, y, button);
-	}
+	}*/
 
 	@Override
 	public boolean isEquivalentTo(NavigatableSimiScreen other) {

src/main/java/com/simibubi/create/foundation/ponder/content/PonderTagScreen.java

@@ -1,15 +1,16 @@
 package com.simibubi.create.foundation.ponder.content;
 
+import java.awt.Color;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.Objects;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
-import org.apache.commons.lang3.mutable.MutableBoolean;
-
 import com.mojang.blaze3d.systems.RenderSystem;
 import com.simibubi.create.Create;
+import com.simibubi.create.foundation.gui.BoxElement;
 import com.simibubi.create.foundation.gui.ScreenOpener;
+import com.simibubi.create.foundation.gui.Theme;
 import com.simibubi.create.foundation.gui.UIRenderHelper;
 import com.simibubi.create.foundation.ponder.NavigatableSimiScreen;
 import com.simibubi.create.foundation.ponder.PonderLocalization;
@@ -84,24 +85,26 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 		int itemCenterY = getItemsY();
 
 		for (Item i : items) {
-			final boolean canClick = PonderRegistry.all.containsKey(i.getRegistryName());
+			PonderButton b = new PonderButton(itemCenterX + layout.getX() + 4, itemCenterY + layout.getY() + 4)
-			PonderButton button =
+					.showing(new ItemStack(i));
-				new PonderButton(itemCenterX + layout.getX() + 4, itemCenterY + layout.getY() + 4, (mouseX, mouseY) -> {
+
-					if (!canClick)
+			if (PonderRegistry.all.containsKey(i.getRegistryName())) {
-						return;
+				b.withCallback((mouseX, mouseY) -> {
 					centerScalingOn(mouseX, mouseY);
 					ScreenOpener.transitionTo(PonderUI.of(new ItemStack(i), tag));
-				}).showing(new ItemStack(i));
+				});
-			if (!canClick)
+			} else {
 				if (i.getRegistryName()
 						.getNamespace()
 						.equals(Create.ID))
-					button.customColors(0x70984500, 0x70692400);
+					b.withBorderColors(new Color(0x70984500, true), new Color(0x70692400, true))
+							.animateColors(false);
 				else
-					button.customColors(0x505000FF, 0x50300077);
+					b.withBorderColors(new Color(0x505000FF, true), new Color(0x50300077, true))
+							.animateColors(false);
+			}
 
-			button.fade(1);
+			widgets.add(b);
-			widgets.add(button);
 			layout.next();
 		}
 
@@ -109,23 +112,26 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 			ResourceLocation registryName = tag.getMainItem()
 					.getItem()
 					.getRegistryName();
-			final boolean canClick = PonderRegistry.all.containsKey(registryName);
+
-			PonderButton button =
+			PonderButton b = new PonderButton(itemCenterX - layout.getTotalWidth() / 2 - 42, itemCenterY - 10)
-					new PonderButton(itemCenterX - layout.getTotalWidth() / 2 - 42, itemCenterY - 10, (mouseX, mouseY) -> {
+					.showing(tag.getMainItem());
-						if (!canClick)
+
-							return;
+			if (PonderRegistry.all.containsKey(registryName)) {
+				b.withCallback((mouseX, mouseY) -> {
 					centerScalingOn(mouseX, mouseY);
 					ScreenOpener.transitionTo(PonderUI.of(tag.getMainItem(), tag));
-					}).showing(tag.getMainItem());
+				});
-			if (!canClick)
+			} else {
 				if (registryName.getNamespace()
 						.equals(Create.ID))
-					button.customColors(0x70984500, 0x70692400);
+					b.withBorderColors(new Color(0x70984500, true), new Color(0x70692400, true))
+							.animateColors(false);
 				else
-					button.customColors(0x505000FF, 0x50300077);
+					b.withBorderColors(new Color(0x505000FF, true), new Color(0x50300077, true))
+							.animateColors(false);
+			}
 
-			button.fade(1);
+			widgets.add(b);
-			widgets.add(button);
 		}
 
 		// chapters
@@ -188,7 +194,13 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 
 		int streakHeight = 35;
 		UIRenderHelper.streak(ms, 0, x - 4, y - 12 + streakHeight / 2, streakHeight, 240, 0x101010);
-		PonderUI.renderBox(ms, 21, 21, 30, 30, false);
+		//PonderUI.renderBox(ms, 21, 21, 30, 30, false);
+		new BoxElement()
+				.withBackground(0xff000000)
+				.gradientBorder(Theme.i(Theme.Key.PONDER_IDLE_1), Theme.i(Theme.Key.PONDER_IDLE_2))
+				.at(21, 21, 100)
+				.withBounds(30, 30)
+				.render(ms);
 
 		textRenderer.draw(ms, Lang.translate(PonderUI.PONDERING), x, y - 6, 0xffa3a3a3);
 		y += 8;
@@ -214,7 +226,14 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 		int h = textRenderer.getWordWrappedHeight(desc, w);
 
 
-		PonderUI.renderBox(ms, x - 3, y - 3, w + 6, h + 6, false);
+		//PonderUI.renderBox(ms, x - 3, y - 3, w + 6, h + 6, false);
+		new BoxElement()
+				.withBackground(0xff000000)
+				.gradientBorder(Theme.i(Theme.Key.PONDER_IDLE_1), Theme.i(Theme.Key.PONDER_IDLE_2))
+				.at(x - 3, y - 3, 90)
+				.withBounds(w + 6, h + 6)
+				.render(ms);
+
 		ms.translate(0, 0, 100);
 		FontHelper.drawSplitString(ms, textRenderer, desc, x, y, w, 0xeeeeee);
 		ms.pop();
@@ -232,7 +251,14 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 
 		ms.push();
 		ms.translate(x, y, 0);
-		PonderUI.renderBox(ms, (sWidth - stringWidth) / 2 - 5, itemArea.getY() - 21, stringWidth + 10, 10, false);
+		//PonderUI.renderBox(ms, (sWidth - stringWidth) / 2 - 5, itemArea.getY() - 21, stringWidth + 10, 10, false);
+		new BoxElement()
+				.withBackground(0xff000000)
+				.gradientBorder(Theme.i(Theme.Key.PONDER_IDLE_1), Theme.i(Theme.Key.PONDER_IDLE_2))
+				.at((sWidth - stringWidth) / 2f - 5, itemArea.getY() - 21, 100)
+				.withBounds(stringWidth + 10, 10)
+				.render(ms);
+
 		ms.translate(0, 0, 200);
 
 //		UIRenderHelper.streak(0, itemArea.getX() - 10, itemArea.getY() - 20, 20, 180, 0x101010);
@@ -291,7 +317,7 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 		return hoveredItem;
 	}
 
-	@Override
+	/*@Override
 	public boolean mouseClicked(double x, double y, int button) {
 		MutableBoolean handled = new MutableBoolean(false);
 		widgets.forEach(w -> {
@@ -310,7 +336,7 @@ public class PonderTagScreen extends NavigatableSimiScreen {
 		if (handled.booleanValue())
 			return true;
 		return super.mouseClicked(x, y, button);
-	}
+	}*/
 
 	@Override
 	public boolean isEquivalentTo(NavigatableSimiScreen other) {

src/main/java/com/simibubi/create/foundation/ponder/elements/InputWindowElement.java

@@ -136,7 +136,7 @@ public class InputWindowElement extends AnimatedOverlayElement {
 
 		if (hasItem) {
 			GuiGameElement.of(item)
-				.at(keyWidth + (hasIcon ? 24 : 0), 0)
+				.<GuiGameElement.GuiRenderBuilder>at(keyWidth + (hasIcon ? 24 : 0), 0)
 				.scale(1.5)
 				.render(ms);
 			RenderSystem.disableDepthTest();

src/main/java/com/simibubi/create/foundation/ponder/elements/TextWindowElement.java

@@ -4,6 +4,7 @@ import java.util.List;
 import java.util.function.Supplier;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
+import com.simibubi.create.foundation.gui.BoxElement;
 import com.simibubi.create.foundation.ponder.PonderLocalization;
 import com.simibubi.create.foundation.ponder.PonderScene;
 import com.simibubi.create.foundation.ponder.PonderUI;
@@ -110,7 +111,14 @@ public class TextWindowElement extends AnimatedOverlayElement {
 		ms.push();
 		ms.translate(0, sceneToScreen.y, 400);
 
-		PonderUI.renderBox(ms, targetX - 10, 3, boxWidth, boxHeight - 1, 0xaa000000, 0x30eebb00, 0x10eebb00);
+		new BoxElement()
+				.withBackground(0xaa000000)
+				.gradientBorder(0x30eebb00, 0x10eebb00)
+				.at(targetX - 10, 3, 100)
+				.withBounds(boxWidth, boxHeight - 1)
+				.render(ms);
+
+		//PonderUI.renderBox(ms, targetX - 10, 3, boxWidth, boxHeight - 1, 0xaa000000, 0x30eebb00, 0x10eebb00);
 
 		int brighterColor = ColorHelper.mixAlphaColors(color, 0xFFffffdd, 1 / 2f);
 		if (vec != null) {

src/main/java/com/simibubi/create/foundation/ponder/ui/ChapterLabel.java

@@ -2,8 +2,9 @@ package com.simibubi.create.foundation.ponder.ui;
 
 import java.util.function.BiConsumer;
 
+import javax.annotation.Nonnull;
+
 import com.mojang.blaze3d.matrix.MatrixStack;
-import com.mojang.blaze3d.systems.RenderSystem;
 import com.simibubi.create.foundation.gui.UIRenderHelper;
 import com.simibubi.create.foundation.gui.widgets.AbstractSimiWidget;
 import com.simibubi.create.foundation.ponder.content.PonderChapter;
@@ -11,8 +12,6 @@ import com.simibubi.create.foundation.utility.Lang;
 
 import net.minecraft.client.Minecraft;
 
-import javax.annotation.Nonnull;
-
 public class ChapterLabel extends AbstractSimiWidget {
 
 	private final PonderChapter chapter;
@@ -21,7 +20,9 @@ public class ChapterLabel extends AbstractSimiWidget {
 	public ChapterLabel(PonderChapter chapter, int x, int y, BiConsumer<Integer, Integer> onClick) {
 		super(x, y, 175, 38);
 
-		this.button = new PonderButton(x + 4, y + 4, onClick, 30, 30).showing(chapter);
+		this.button = new PonderButton(x + 4, y + 4, 30, 30)
+				.showing(chapter)
+				.withCallback(onClick);
 		this.button.fade(1);
 
 		this.chapter = chapter;

src/main/java/com/simibubi/create/foundation/ponder/ui/PonderButton.java

@@ -1,191 +1,103 @@
 package com.simibubi.create.foundation.ponder.ui;
 
-import java.util.function.BiConsumer;
+import java.awt.Color;
+
+import javax.annotation.Nonnull;
 
 import com.mojang.blaze3d.matrix.MatrixStack;
-import com.mojang.blaze3d.systems.RenderSystem;
 import com.simibubi.create.foundation.gui.GuiGameElement;
-import com.simibubi.create.foundation.gui.IScreenRenderable;
+import com.simibubi.create.foundation.gui.RenderElement;
-import com.simibubi.create.foundation.gui.StencilElement;
+import com.simibubi.create.foundation.gui.Theme;
-import com.simibubi.create.foundation.gui.widgets.AbstractSimiWidget;
+import com.simibubi.create.foundation.gui.widgets.BoxWidget;
-import com.simibubi.create.foundation.ponder.PonderUI;
+import com.simibubi.create.foundation.gui.widgets.ElementWidget;
+import com.simibubi.create.foundation.utility.AnimationTickHolder;
 import com.simibubi.create.foundation.utility.ColorHelper;
-import com.simibubi.create.foundation.utility.Couple;
 import com.simibubi.create.foundation.utility.animation.LerpedFloat;
 
 import net.minecraft.client.Minecraft;
 import net.minecraft.client.settings.KeyBinding;
 import net.minecraft.item.ItemStack;
+import net.minecraft.util.math.MathHelper;
 
-import javax.annotation.Nonnull;
+public class PonderButton extends BoxWidget {
 
-public class PonderButton extends AbstractSimiWidget {
+	protected ItemStack item;
+	protected KeyBinding shortcut;
+	protected LerpedFloat flash = LerpedFloat.linear().startWithValue(0).chase(0, 0.1f, LerpedFloat.Chaser.EXP);
 
-	private IScreenRenderable icon;
+	public PonderButton(int x, int y) {
-	private boolean scaleIcon = true;
+		this(x, y, 20, 20);
-	private ItemStack item;
+	}
-	protected boolean pressed;
-	private int xFadeModifier;
-	private int yFadeModifier;
-	private float fade;
-	private KeyBinding shortcut;
-	private LerpedFloat flash;
-	private Couple<Integer> customPassiveBorder;
 
-	public static final int SIZE = 20;
+	public PonderButton(int x, int y, int width, int height) {
-
-	public PonderButton(int x, int y, BiConsumer<Integer, Integer> onClick, int width, int height) {
 		super(x, y, width, height);
-		this.onClick = onClick;
+		z = 400;
-		flash = LerpedFloat.linear()
-			.startWithValue(0);
 	}
 
-	public PonderButton(int x, int y, BiConsumer<Integer, Integer> onClick) {
+	public <T extends PonderButton> T withShortcut(KeyBinding key) {
-		this(x, y, onClick, SIZE, SIZE);
-	}
-
-	public PonderButton(int x, int y, Runnable onClick) {
-		this(x, y, ($, $$) -> onClick.run());
-	}
-
-	/**
-	 * @param icon the icon to be rendered. assumed to be 16x16px in size. will be scaled to fit the button size
-	 *
-	 */
-	public PonderButton showing(IScreenRenderable icon) {
-		this.icon = icon;
-		return this;
-	}
-
-	public PonderButton showingUnscaled(IScreenRenderable icon) {
-		this.icon = icon;
-		this.scaleIcon = false;
-		return this;
-	}
-
-	public PonderButton showing(ItemStack item) {
-		this.item = item;
-		return this;
-	}
-
-	public PonderButton customColors(int start, int end) {
-		this.customPassiveBorder = Couple.create(start, end);
-		return this;
-	}
-
-	public PonderButton shortcut(KeyBinding key) {
 		this.shortcut = key;
-		return this;
+		//noinspection unchecked
+		return (T) this;
 	}
 
-	public PonderButton fade(int xModifier, int yModifier) {
+	public <T extends PonderButton> T showing(ItemStack item) {
-		this.xFadeModifier = xModifier;
+		this.item = item;
-		this.yFadeModifier = yModifier;
+		return super.showingElement(GuiGameElement.of(item)
-		return this;
+				.scale(1.5f)
+				.at(-2, -2));
 	}
 
-	public void fade(float fade) {
+	@Override
-		this.fade = fade;
+	public <T extends ElementWidget> T showingElement(RenderElement element) {
+		return super.showingElement(element.at(2, 2));
 	}
 
 	public void flash() {
-		float value = flash.getValue();
+		flash.updateChaseTarget(1);
-		flash.setValue(value + (1 - value) * .2f);
 	}
 
 	public void dim() {
-		float value = flash.getValue();
+		flash.updateChaseTarget(0);
-		flash.setValue(value * .5f);
+	}
+
+	@Override
+	public void tick() {
+		super.tick();
+		flash.tickChaser();
+	}
+
+	@Override
+	protected void beforeRender(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
+		super.beforeRender(ms, mouseX, mouseY, partialTicks);
+
+		float flashValue = flash.getValue(partialTicks);
+		if (flashValue > .1f) {
+			float sin = 0.5f + 0.5f * MathHelper.sin((AnimationTickHolder.getTicks(true) + partialTicks) / 6f);
+			sin *= flashValue;
+			Color c1 = gradientColor1;
+			Color c2 = gradientColor2;
+			Color nc1 = new Color(c1.getRed(), c1.getGreen(), c1.getBlue(), MathHelper.clamp(c1.getAlpha() + 50, 0, 255));
+			Color nc2 = new Color(c2.getRed(), c2.getGreen(), c2.getBlue(), MathHelper.clamp(c2.getAlpha() + 50, 0, 255));
+			gradientColor1 = ColorHelper.mixColors(c1, nc1, sin);
+			gradientColor2 = ColorHelper.mixColors(c2, nc2, sin);
+		}
 	}
 
 	@Override
 	public void renderButton(@Nonnull MatrixStack ms, int mouseX, int mouseY, float partialTicks) {
-		if (!visible)
+		super.renderButton(ms, mouseX, mouseY, partialTicks);
-			return;
+		float fadeValue = fade.getValue();
-		if (fade < .1f)
+
+		if (fadeValue < .1f)
 			return;
 
-		hovered = isMouseOver(mouseX, mouseY) && fade > .75f;
+		if (shortcut != null) {
-
+			ms.translate(0, 0, z+50);
-		ms.push();
+			drawCenteredText(ms, Minecraft.getInstance().fontRenderer, shortcut.getBoundKeyLocalizedText(), x + width / 2 + 8, y + height - 6, ColorHelper.applyAlpha(Theme.i(Theme.Key.TEXT_2), fadeValue));
-		RenderSystem.disableDepthTest();
-		if (fade < 1)
-			ms.translate((1 - fade) * -5 * xFadeModifier, (1 - fade) * -5 * yFadeModifier, 0);
-
-		float flashValue = flash.getValue(partialTicks);
-		if (flashValue > .1f)
-			fade *= 3 * flashValue + Math.sin((PonderUI.ponderTicks + partialTicks) / 6);
-
-		int backgroundColor = ColorHelper.applyAlpha(0xdd000000, fade);
-		int borderColorStart = customPassiveBorder != null ? customPassiveBorder.getFirst() : hovered ? 0x70ffffff : 0x40aa9999;
-		int borderColorEnd = customPassiveBorder != null ? customPassiveBorder.getSecond() : hovered ? 0x30ffffff : 0x20aa9999;
-		borderColorStart = ColorHelper.applyAlpha(borderColorStart, fade);
-		borderColorEnd = ColorHelper.applyAlpha(borderColorEnd, fade);
-
-		ms.translate(0, 0, 300);
-		PonderUI.renderBox(ms, x, y, width, height, backgroundColor, borderColorStart, borderColorEnd);
-		ms.translate(0, 0, 100);
-
-		if (icon != null) {
-			RenderSystem.enableBlend();
-			RenderSystem.color4f(1, 1, 1, fade);
-			ms.push();
-			ms.translate(x + 2, y + 2, 0);
-			if (this.scaleIcon)
-				ms.scale((width - 4) / 16f, (height - 4) / 16f, 1);
-			else {
-				if (icon instanceof StencilElement){
-					((StencilElement) icon).withBounds(width - 4, height - 4);
 		}
 	}
 
-			icon.draw(ms, this, 0, 0);
-			ms.pop();
-		}
-		if (item != null) {
-			ms.push();
-			ms.translate(0, 0, -100);
-			GuiGameElement.of(item)
-				.at(x - 2, y - 2)
-				.scale(1.5f)
-				.render(ms);
-			ms.pop();
-		}
-		if (shortcut != null)
-			drawCenteredText(ms, Minecraft.getInstance().fontRenderer, shortcut.getBoundKeyLocalizedText(), x + width / 2 + 8,
-				y + height - 6, ColorHelper.applyAlpha(0xff606060, fade));
-
-		ms.pop();
-	}
-
-	@Override
-	public void onClick(double p_onClick_1_, double p_onClick_3_) {
-		super.onClick(p_onClick_1_, p_onClick_3_);
-		this.pressed = true;
-	}
-
-	@Override
-	public void onRelease(double p_onRelease_1_, double p_onRelease_3_) {
-		super.onRelease(p_onRelease_1_, p_onRelease_3_);
-		this.pressed = false;
-	}
-
-	/*public void setToolTip(String text) {
-		toolTip.clear();
-		toolTip.add(text);
-	}*/
-
 	public ItemStack getItem() {
 		return item;
 	}
-
-	@Override
-	public boolean isMouseOver(double x, double y) {
-		double m = 4;
-		x = Math.floor(x);
-		y = Math.floor(y);
-		return active && visible
-			&& !(x < this.x - m || x > this.x + width + m - 1 || y < this.y - m || y > this.y + height + m - 1);
-	}
 }

src/main/java/com/simibubi/create/foundation/utility/AnimationTickHolder.java

@@ -2,27 +2,35 @@ package com.simibubi.create.foundation.utility;
 
 import com.simibubi.create.foundation.ponder.PonderUI;
 import com.simibubi.create.foundation.ponder.PonderWorld;
-
 import com.simibubi.create.foundation.utility.worldWrappers.WrappedClientWorld;
+
 import net.minecraft.client.Minecraft;
 import net.minecraft.world.IWorld;
 
 public class AnimationTickHolder {
 
 	private static int ticks;
+	private static int paused_ticks;
 
 	public static void reset() {
 		ticks = 0;
+		paused_ticks = 0;
 	}
 
 	public static void tick() {
 		if (!Minecraft.getInstance().isGamePaused()) {
 			ticks = (ticks + 1) % 1_728_000; // wrap around every 24 hours so we maintain enough floating point precision
+		} else {
+			paused_ticks = (paused_ticks + 1) % 1_728_000;
 		}
 	}
 	
 	public static int getTicks() {
-		return ticks;
+		return getTicks(false);
+	}
+
+	public static int getTicks(boolean includePaused) {
+		return includePaused ? ticks + paused_ticks : ticks;
 	}
 
 	public static float getRenderTime() {

src/main/java/com/simibubi/create/foundation/utility/ColorHelper.java

@@ -42,6 +42,10 @@ public class ColorHelper {
 		return (color & 0xFFFFFF) | alphaChannel << 24;
 	}
 
+	public static Color applyAlpha(Color c, float alpha) {
+		return new Color(applyAlpha(c.getRGB(), alpha), true);
+	}
+
 	public static int mixColors(int color1, int color2, float w) {
 		int r1 = (color1 >> 16);
 		int g1 = (color1 >> 8) & 0xFF;