Merge pull request #3081 from psikoi/obsidian-redesign-v2

Skilling Calculators - Obsidian Redesign

runelite-client/src/main/java/net/runelite/client/game/SkillIconManager.java

@@ -35,11 +35,12 @@ import net.runelite.api.Skill;
 @Slf4j
 public class SkillIconManager
 {
-	private final BufferedImage[] imgCache = new BufferedImage[Skill.values().length];
+	// * 2 to account for the small version of each icon
+	private final BufferedImage[] imgCache = new BufferedImage[Skill.values().length * 2];
 
-	public BufferedImage getSkillImage(Skill skill)
+	public BufferedImage getSkillImage(Skill skill, boolean small)
 	{
-		int skillIdx = skill.ordinal();
+		int skillIdx = skill.ordinal() + (small ? Skill.values().length : 0);
 		BufferedImage skillImage = null;
 
 		if (imgCache[skillIdx] != null)
@@ -49,7 +50,8 @@ public class SkillIconManager
 
 		try
 		{
-			String skillIconPath = "/skill_icons/" + skill.getName().toLowerCase() + ".png";
+			String skillIconPath = (small ? "/skill_icons_small/" : "/skill_icons/")
+				+ skill.getName().toLowerCase() + ".png";
 			log.debug("Loading skill icon from {}", skillIconPath);
 			synchronized (ImageIO.class)
 			{
@@ -64,4 +66,10 @@ public class SkillIconManager
 
 		return skillImage;
 	}
+
+	public BufferedImage getSkillImage(Skill skill)
+	{
+		return getSkillImage(skill, false);
+	}
+
 }

runelite-client/src/main/java/net/runelite/client/plugins/skillcalculator/SkillCalculator.java

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018, Kruithne <kruithne@gmail.com>
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -25,6 +26,8 @@
 package net.runelite.client.plugins.skillcalculator;
 
 import java.awt.BorderLayout;
+import java.awt.Color;
+import java.awt.Dimension;
 import java.awt.event.MouseAdapter;
 import java.awt.event.MouseEvent;
 import java.text.DecimalFormat;
@@ -32,6 +35,7 @@ import java.text.NumberFormat;
 import java.util.ArrayList;
 import java.util.List;
 import javax.swing.BorderFactory;
+import javax.swing.Box;
 import javax.swing.BoxLayout;
 import javax.swing.JCheckBox;
 import javax.swing.JLabel;
@@ -43,6 +47,8 @@ import net.runelite.client.game.SpriteManager;
 import net.runelite.client.plugins.skillcalculator.beans.SkillData;
 import net.runelite.client.plugins.skillcalculator.beans.SkillDataBonus;
 import net.runelite.client.plugins.skillcalculator.beans.SkillDataEntry;
+import net.runelite.client.ui.ColorScheme;
+import net.runelite.client.ui.FontManager;
 
 class SkillCalculator extends JPanel
 {
@@ -75,11 +81,20 @@ class SkillCalculator extends JPanel
 		this.uiInput = uiInput;
 
 		setLayout(new BoxLayout(this, BoxLayout.Y_AXIS));
-		setBorder(BorderFactory.createLineBorder(getBackground().brighter()));
 
-		// Register listeners on the input fields..
+		// Register listeners on the input fields and then move on to the next related text field
-		uiInput.uiFieldCurrentLevel.addActionListener(e -> onFieldCurrentLevelUpdated());
+		uiInput.uiFieldCurrentLevel.addActionListener(e ->
-		uiInput.uiFieldCurrentXP.addActionListener(e -> onFieldCurrentXPUpdated());
+		{
+			onFieldCurrentLevelUpdated();
+			uiInput.uiFieldTargetLevel.requestFocusInWindow();
+		});
+
+		uiInput.uiFieldCurrentXP.addActionListener(e ->
+		{
+			onFieldCurrentXPUpdated();
+			uiInput.uiFieldTargetXP.requestFocusInWindow();
+		});
+
 		uiInput.uiFieldTargetLevel.addActionListener(e -> onFieldTargetLevelUpdated());
 		uiInput.uiFieldTargetXP.addActionListener(e -> onFieldTargetXPUpdated());
 	}
@@ -110,6 +125,8 @@ class SkillCalculator extends JPanel
 		// Create action slots for the skill actions.
 		renderActionSlots();
 
+		add(Box.createRigidArea(new Dimension(0, 15)));
+
 		// Update the input fields.
 		updateInputFields();
 	}
@@ -142,7 +159,7 @@ class SkillCalculator extends JPanel
 		if (neededXP > 0)
 			actionCount = (int) Math.ceil(neededXP / xp);
 
-		combinedActionSlot.setText(formatXPActionString(xp, actionCount));
+		combinedActionSlot.setText(formatXPActionString(xp, actionCount, "exp - "));
 	}
 
 	private void clearCombinedSlots()
@@ -163,15 +180,21 @@ class SkillCalculator extends JPanel
 				JLabel uiLabel = new JLabel(bonus.name);
 				JCheckBox uiCheckbox = new JCheckBox();
 
-				// Adding an empty 8-pixel border on the left gives us nice padding.
+				uiLabel.setForeground(Color.WHITE);
-				uiOption.setBorder(BorderFactory.createEmptyBorder(0, 8, 0, 0));
+				uiLabel.setFont(FontManager.getRunescapeSmallFont());
+
+				uiOption.setBorder(BorderFactory.createEmptyBorder(3, 7, 3, 0));
+				uiOption.setBackground(ColorScheme.DARKER_GRAY_COLOR);
 
 				// Adjust XP bonus depending on check-state of the boxes.
 				uiCheckbox.addActionListener(e -> adjustXPBonus(uiCheckbox.isSelected(), bonus.value));
+				uiCheckbox.setBackground(ColorScheme.MEDIUM_GRAY_COLOR);
 
 				uiOption.add(uiLabel, BorderLayout.WEST);
 				uiOption.add(uiCheckbox, BorderLayout.EAST);
+
 				add(uiOption);
+				add(Box.createRigidArea(new Dimension(0, 5)));
 			}
 		}
 	}
@@ -186,6 +209,8 @@ class SkillCalculator extends JPanel
 		{
 			UIActionSlot slot = new UIActionSlot(action);
 			uiActionSlots.add(slot); // Keep our own reference.
+
+			add(Box.createRigidArea(new Dimension(0, 5)));
 			add(slot); // Add component to the panel.
 
 			slot.addMouseListener(new MouseAdapter()
@@ -223,15 +248,15 @@ class SkillCalculator extends JPanel
 			if (neededXP > 0)
 				actionCount = (int) Math.ceil(neededXP / xp);
 
-			slot.setText(formatXPActionString(xp, actionCount));
+			slot.setText("Lvl. " + slot.action.level + " (" + formatXPActionString(xp, actionCount, "exp) - "));
 			slot.setAvailable(currentLevel >= slot.action.level);
 			slot.value = xp;
 		}
 	}
 
-	private String formatXPActionString(double xp, int actionCount)
+	private String formatXPActionString(double xp, int actionCount, String expExpression)
 	{
-		return XP_FORMAT.format(xp) + "xp - " + NumberFormat.getIntegerInstance().format(actionCount) + (actionCount > 1 ? " actions" : " action");
+		return XP_FORMAT.format(xp) + expExpression + NumberFormat.getIntegerInstance().format(actionCount) + (actionCount > 1 ? " actions" : " action");
 	}
 
 	private void updateInputFields()

runelite-client/src/main/java/net/runelite/client/plugins/skillcalculator/SkillCalculatorPanel.java

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018, Kruithne <kruithne@gmail.com>
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -25,96 +26,108 @@
 
 package net.runelite.client.plugins.skillcalculator;
 
-import java.awt.Dimension;
+import java.awt.Color;
 import java.awt.GridBagConstraints;
 import java.awt.GridBagLayout;
-import java.awt.Insets;
+import java.awt.GridLayout;
-import java.awt.image.BufferedImage;
+import java.awt.event.MouseAdapter;
-import javax.swing.BorderFactory;
+import java.awt.event.MouseEvent;
-import javax.swing.Box;
+import java.awt.event.MouseListener;
-import javax.swing.BoxLayout;
 import javax.swing.ImageIcon;
-import javax.swing.JButton;
+import javax.swing.JLabel;
-import javax.swing.JPanel;
+import javax.swing.JScrollPane;
+import javax.swing.SwingConstants;
+import javax.swing.border.EmptyBorder;
 import net.runelite.api.Client;
 import net.runelite.client.game.SkillIconManager;
 import net.runelite.client.ui.ColorScheme;
 import net.runelite.client.ui.PluginPanel;
+import net.runelite.client.ui.components.materialtabs.MaterialTab;
+import net.runelite.client.ui.components.materialtabs.MaterialTabGroup;
 
 class SkillCalculatorPanel extends PluginPanel
 {
-	private JButton activeButton;
-	private int uiButtonIndex = 0;
 	private final SkillCalculator uiCalculator;
 	private final SkillIconManager iconManager;
-	private final JPanel uiButtonGrid = new JPanel();
+	private final MaterialTabGroup tabGroup;
-	private final GridBagLayout uiButtonGridLayout = new GridBagLayout();
+
-	private final GridBagConstraints uiButtonGridConstraints = new GridBagConstraints();
+	private final MouseListener tabHoverListener;
 
 	SkillCalculatorPanel(SkillIconManager iconManager, Client client)
 	{
 		super();
+		getScrollPane().setVerticalScrollBarPolicy(JScrollPane.VERTICAL_SCROLLBAR_ALWAYS);
+
+		tabHoverListener = new MouseAdapter()
+		{
+			@Override
+			public void mouseEntered(MouseEvent e)
+			{
+				MaterialTab tab = (MaterialTab) e.getSource();
+				tab.setBackground(ColorScheme.DARKER_GRAY_HOVER_COLOR);
+			}
+
+			@Override
+			public void mouseExited(MouseEvent e)
+			{
+				MaterialTab tab = (MaterialTab) e.getSource();
+				tab.setBackground(ColorScheme.DARKER_GRAY_COLOR);
+			}
+		};
+
 		this.iconManager = iconManager;
 
-		BoxLayout layout = new BoxLayout(this, BoxLayout.Y_AXIS);
+		setBorder(new EmptyBorder(10, 10, 0, 10));
-		setLayout(layout);
+		setLayout(new GridBagLayout());
 
-		uiButtonGridConstraints.fill = GridBagConstraints.BOTH;
+		GridBagConstraints c = new GridBagConstraints();
-		uiButtonGridConstraints.weightx = 1;
+		c.fill = GridBagConstraints.HORIZONTAL;
-		uiButtonGridConstraints.ipady = 12;
+		c.weightx = 1;
-		uiButtonGridConstraints.insets = new Insets(2, 2, 2, 2);
+		c.gridx = 0;
+		c.gridy = 0;
+
+		tabGroup = new MaterialTabGroup();
+		tabGroup.setLayout(new GridLayout(0, 6, 7, 7));
 
-		uiButtonGrid.setLayout(uiButtonGridLayout);
-		uiButtonGrid.setBackground(ColorScheme.DARK_GRAY_COLOR);
-		uiButtonGrid.setBorder(BorderFactory.createEmptyBorder(3, 3, 3, 3));
 		addCalculatorButtons();
 
 		final UICalculatorInputArea uiInput = new UICalculatorInputArea();
+		uiInput.setBorder(new EmptyBorder(15, 0, 15, 0));
 		uiInput.setBackground(ColorScheme.DARK_GRAY_COLOR);
 
 		uiCalculator = new SkillCalculator(client, uiInput);
 
-		add(uiButtonGrid);
+		JLabel title = new JLabel("Skilling Calculator");
-		add(Box.createRigidArea(new Dimension(0, 8)));
+		title.setBorder(new EmptyBorder(0, 1, 8, 0));
-		add(uiInput);
+		title.setForeground(Color.WHITE);
-		add(Box.createRigidArea(new Dimension(0, 14)));
+
-		add(uiCalculator);
+		add(title, c);
+		c.gridy++;
+
+		add(tabGroup, c);
+		c.gridy++;
+
+		add(uiInput, c);
+		c.gridy++;
+
+		add(uiCalculator, c);
+		c.gridy++;
 	}
 
 	private void addCalculatorButtons()
 	{
 		for (CalculatorType calculatorType : CalculatorType.values())
 		{
-			final JButton uiButton = new JButton();
+			MaterialTab tab = new MaterialTab("", tabGroup, null);
-			final BufferedImage icon = iconManager.getSkillImage(calculatorType.getSkill());
+			tab.setOpaque(true);
-			uiButton.addActionListener(e -> openCalculator(calculatorType, uiButton));
+			tab.setVerticalAlignment(SwingConstants.CENTER);
+			tab.setHorizontalAlignment(SwingConstants.CENTER);
+			tab.setBackground(ColorScheme.DARKER_GRAY_COLOR);
+			tab.setIcon(new ImageIcon(iconManager.getSkillImage(calculatorType.getSkill(), true)));
+			tab.setOnSelectEvent(() -> uiCalculator.openCalculator(calculatorType));
+			tab.addMouseListener(tabHoverListener);
 
-			uiButton.setIcon(new ImageIcon(icon));
+			tabGroup.addTab(tab);
-			uiButton.setToolTipText(calculatorType.getSkill().getName());
-			uiButton.setFocusPainted(false);
-
-			uiButtonGridConstraints.gridx = uiButtonIndex % 4;
-			uiButtonGridLayout.setConstraints(uiButton, uiButtonGridConstraints);
-			uiButtonGrid.add(uiButton);
-			uiButtonIndex++;
 		}
 	}
-
-	private void openCalculator(CalculatorType calculatorType, JButton button)
-	{
-		// Remove highlight from existing button..
-		if (activeButton != null)
-			activeButton.setSelected(false);
-
-		// Set the new button as selected..
-		button.setSelected(true);
-		activeButton = button;
-
-		// Invoke the calculator component..
-		uiCalculator.openCalculator(calculatorType);
-
-		// Refresh rendering..
-		revalidate();
-		repaint();
-	}
 }

runelite-client/src/main/java/net/runelite/client/plugins/skillcalculator/UIActionSlot.java

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018, Kruithne <kruithne@gmail.com>
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -29,15 +30,30 @@ import java.awt.BorderLayout;
 import java.awt.Color;
 import java.awt.Dimension;
 import java.awt.GridLayout;
+import java.awt.event.MouseAdapter;
+import java.awt.event.MouseEvent;
+import java.awt.event.MouseListener;
 import javax.swing.BorderFactory;
 import javax.swing.JLabel;
 import javax.swing.JPanel;
+import javax.swing.border.Border;
+import javax.swing.border.CompoundBorder;
+import javax.swing.border.EmptyBorder;
 import net.runelite.client.plugins.skillcalculator.beans.SkillDataEntry;
+import net.runelite.client.ui.ColorScheme;
 import net.runelite.client.ui.FontManager;
 import net.runelite.client.ui.components.shadowlabel.JShadowedLabel;
 
 class UIActionSlot extends JPanel
 {
+	private static final Border GREEN_BORDER = new CompoundBorder(
+		BorderFactory.createMatteBorder(0, 4, 0, 0, (ColorScheme.PROGRESS_COMPLETE_COLOR).darker()),
+		BorderFactory.createEmptyBorder(7, 12, 7, 7));
+
+	private static final Border RED_BORDER = new CompoundBorder(
+		BorderFactory.createMatteBorder(0, 4, 0, 0, (ColorScheme.PROGRESS_ERROR_COLOR).darker()),
+		BorderFactory.createEmptyBorder(7, 12, 7, 7));
+
 	SkillDataEntry action;
 	private JShadowedLabel uiLabelActions;
 	private static final Dimension ICON_SIZE = new Dimension(32, 32);
@@ -52,11 +68,32 @@ class UIActionSlot extends JPanel
 	{
 		this.action = action;
 
-		BorderLayout layout = new BorderLayout();
+		setLayout(new BorderLayout());
-		layout.setHgap(8);
+		setBorder(RED_BORDER);
-		setLayout(layout);
+		setBackground(ColorScheme.DARKER_GRAY_COLOR);
 
-		setBorder(BorderFactory.createEmptyBorder(4, 4, 4, 4));
+		MouseListener hoverListener = new MouseAdapter()
+		{
+			@Override
+			public void mouseEntered(MouseEvent mouseEvent)
+			{
+				if (!isSelected)
+				{
+					setBackground(ColorScheme.DARKER_GRAY_HOVER_COLOR);
+				}
+			}
+
+			@Override
+			public void mouseExited(MouseEvent mouseEvent)
+			{
+				if (!isSelected)
+				{
+					updateBackground();
+				}
+			}
+		};
+
+		addMouseListener(hoverListener);
 
 		JLabel uiIcon = new JLabel();
 
@@ -69,17 +106,22 @@ class UIActionSlot extends JPanel
 		uiIcon.setMaximumSize(ICON_SIZE);
 		uiIcon.setPreferredSize(ICON_SIZE);
 		uiIcon.setHorizontalAlignment(JLabel.CENTER);
-		add(uiIcon, BorderLayout.LINE_START);
 
 		uiInfo = new JPanel(new GridLayout(2, 1));
+		uiInfo.setBackground(ColorScheme.DARKER_GRAY_COLOR);
+		uiInfo.setBorder(new EmptyBorder(0, 5, 0, 0));
 
 		JShadowedLabel uiLabelName = new JShadowedLabel(action.name);
-		uiInfo.add(uiLabelName);
+		uiLabelName.setForeground(Color.WHITE);
 
 		uiLabelActions = new JShadowedLabel("Unknown");
 		uiLabelActions.setFont(FontManager.getRunescapeSmallFont());
+		uiLabelActions.setForeground(ColorScheme.LIGHT_GRAY_COLOR);
+
+		uiInfo.add(uiLabelName);
 		uiInfo.add(uiLabelActions);
 
+		add(uiIcon, BorderLayout.LINE_START);
 		add(uiInfo, BorderLayout.CENTER);
 	}
 
@@ -102,11 +144,17 @@ class UIActionSlot extends JPanel
 
 	private void updateBackground()
 	{
-		if (isSelected)
+		setBorder(isAvailable ? GREEN_BORDER : RED_BORDER);
-			this.setBackground(isAvailable ? Color.GREEN : Color.RED);
+		setBackground(isSelected ? ColorScheme.DARKER_GRAY_HOVER_COLOR.brighter() : ColorScheme.DARKER_GRAY_COLOR);
-		else
+	}
-			this.setBackground(isAvailable ? Color.GREEN.darker() : Color.RED.darker());
 
-		uiInfo.setBackground(getBackground());
+	@Override
+	public void setBackground(Color color)
+	{
+		super.setBackground(color);
+		if (uiInfo != null)
+		{
+			uiInfo.setBackground(color);
+		}
 	}
 }

runelite-client/src/main/java/net/runelite/client/plugins/skillcalculator/UICalculatorInputArea.java

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018, Kruithne <kruithne@gmail.com>
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -24,21 +25,19 @@
  */
 package net.runelite.client.plugins.skillcalculator;
 
-import java.awt.GridBagConstraints;
+import java.awt.BorderLayout;
-import java.awt.GridBagLayout;
+import java.awt.Color;
-import java.awt.Insets;
+import java.awt.GridLayout;
 import javax.swing.JLabel;
 import javax.swing.JPanel;
 import javax.swing.JTextField;
+import javax.swing.border.EmptyBorder;
+import net.runelite.client.ui.ColorScheme;
+import net.runelite.client.ui.FontManager;
+import net.runelite.client.ui.components.FlatTextField;
 
 class UICalculatorInputArea extends JPanel
 {
-	private final GridBagLayout uiLayout;
-	private final GridBagConstraints uiConstraints;
-
-	private int gridX = 0;
-	private int gridY = 0;
-
 	JTextField uiFieldCurrentLevel;
 	JTextField uiFieldCurrentXP;
 	JTextField uiFieldTargetLevel;
@@ -46,15 +45,11 @@ class UICalculatorInputArea extends JPanel
 
 	UICalculatorInputArea()
 	{
-		uiLayout = new GridBagLayout();
+		setLayout(new GridLayout(2, 2, 7, 7));
-		uiConstraints = new GridBagConstraints();
-		uiConstraints.insets = new Insets(3, 9, 3, 9);
-		setLayout(uiLayout);
-
 		uiFieldCurrentLevel = addComponent("Current Level");
-		uiFieldCurrentXP = addComponent("Current XP");
+		uiFieldCurrentXP = addComponent("Current Experience");
 		uiFieldTargetLevel = addComponent("Target Level");
-		uiFieldTargetXP = addComponent("Target XP");
+		uiFieldTargetXP = addComponent("Target Experience");
 	}
 
 	int getCurrentLevelInput()
@@ -116,26 +111,25 @@ class UICalculatorInputArea extends JPanel
 
 	private JTextField addComponent(String label)
 	{
+		final JPanel container = new JPanel();
+		container.setLayout(new BorderLayout());
+
 		final JLabel uiLabel = new JLabel(label);
-		final JTextField uiField = new JTextField(6);
+		final FlatTextField uiInput = new FlatTextField();
 
-		uiConstraints.gridx = gridX;
+		uiInput.setBackground(ColorScheme.DARKER_GRAY_COLOR);
-		uiConstraints.gridy = gridY;
+		uiInput.setHoverBackgroundColor(ColorScheme.DARK_GRAY_HOVER_COLOR);
+		uiInput.setBorder(new EmptyBorder(5, 7, 5, 7));
 
-		uiLayout.setConstraints(uiLabel, uiConstraints);
+		uiLabel.setFont(FontManager.getRunescapeSmallFont());
-		add(uiLabel);
+		uiLabel.setBorder(new EmptyBorder(0, 0, 4, 0));
+		uiLabel.setForeground(Color.WHITE);
 
-		uiConstraints.gridy++;
+		container.add(uiLabel, BorderLayout.NORTH);
-		uiLayout.setConstraints(uiField, uiConstraints);
+		container.add(uiInput, BorderLayout.CENTER);
-		add(uiField);
 
-		gridX++;
+		add(container);
-		if (gridX % 2 == 0)
-		{
-			gridY += 2;
-			gridX = 0;
-		}
 
-		return uiField;
+		return uiInput.getTextField();
 	}
 }

runelite-client/src/main/java/net/runelite/client/plugins/skillcalculator/UICombinedActionSlot.java

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018, Kruithne <kruithne@gmail.com>
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -32,6 +33,8 @@ import java.awt.GridLayout;
 import javax.swing.BorderFactory;
 import javax.swing.JLabel;
 import javax.swing.JPanel;
+import javax.swing.border.EmptyBorder;
+import net.runelite.client.ui.ColorScheme;
 import net.runelite.client.ui.FontManager;
 import net.runelite.client.ui.components.shadowlabel.JShadowedLabel;
 
@@ -44,13 +47,12 @@ class UICombinedActionSlot extends JPanel
 
 	UICombinedActionSlot()
 	{
-		BorderLayout layout = new BorderLayout();
+		setLayout(new BorderLayout());
-		layout.setHgap(8);
+		setBackground(ColorScheme.DARKER_GRAY_COLOR);
-		setLayout(layout);
+		setBorder(BorderFactory.createEmptyBorder(7, 7, 7, 7));
-
-		setBorder(BorderFactory.createEmptyBorder(4, 4, 4, 4));
 
 		JLabel uiIcon = new JLabel();
+		uiIcon.setBorder(new EmptyBorder(0, 0, 0, 5));
 		SkillCalculator.spriteManager.addSpriteTo(uiIcon, 582, 0);
 
 		uiIcon.setMinimumSize(ICON_SIZE);
@@ -60,16 +62,18 @@ class UICombinedActionSlot extends JPanel
 		add(uiIcon, BorderLayout.LINE_START);
 
 		JPanel uiInfo = new JPanel(new GridLayout(2, 1));
-		uiInfo.setBackground(Color.ORANGE);
+		uiInfo.setBackground(ColorScheme.DARKER_GRAY_COLOR);
 
 		uiLabelTitle = new JShadowedLabel("No Action Selected");
-		uiInfo.add(uiLabelTitle);
+		uiLabelTitle.setForeground(Color.WHITE);
 
 		uiLabelActions = new JShadowedLabel("Shift-click to select multiple");
 		uiLabelActions.setFont(FontManager.getRunescapeSmallFont());
+		uiLabelActions.setForeground(ColorScheme.LIGHT_GRAY_COLOR);
+
+		uiInfo.add(uiLabelTitle);
 		uiInfo.add(uiLabelActions);
 
-		setBackground(Color.orange);
 		add(uiInfo, BorderLayout.CENTER);
 	}
 

runelite-client/src/main/java/net/runelite/client/ui/ColorScheme.java

@@ -41,6 +41,8 @@ public class ColorScheme
 	public static final Color DARK_GRAY_COLOR = new Color(40, 40, 40);
 	public static final Color MEDIUM_GRAY_COLOR = new Color(77, 77, 77);
 	public static final Color LIGHT_GRAY_COLOR = new Color(165, 165, 165);
+
+	public static final Color DARKER_GRAY_HOVER_COLOR = new Color(60,  60 , 60);
 	public static final Color DARK_GRAY_HOVER_COLOR = new Color(35, 35, 35);
 
 	/* The color for the green progress bar (used in ge offers, farming tracker, etc)*/

runelite-client/src/main/java/net/runelite/client/ui/components/FlatTextField.java

@@ -0,0 +1,170 @@
+/*
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ *  Redistributions of source code must retain the above copyright notice, this
+ *   list of conditions and the following disclaimer.
+ *
+ *  Redistributions in binary form must reproduce the above copyright notice,
+ *   this list of conditions and the following disclaimer in the documentation
+ *   and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+ * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+ * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+ * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+ * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+ * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+package net.runelite.client.ui.components;
+
+import java.awt.BorderLayout;
+import java.awt.Color;
+import java.awt.event.ActionListener;
+import java.awt.event.KeyListener;
+import java.awt.event.MouseAdapter;
+import java.awt.event.MouseEvent;
+import javax.swing.JPanel;
+import javax.swing.JTextField;
+import javax.swing.border.EmptyBorder;
+import javax.swing.text.Document;
+import lombok.Getter;
+import net.runelite.client.ui.ColorScheme;
+
+/**
+ * This component is a JTextField with a flat design look.
+ */
+public class FlatTextField extends JPanel
+{
+	@Getter
+	private final JTextField textField;
+
+	//the default background color, this needs to be stored for hover effects
+	@Getter
+	private Color backgroundColor = ColorScheme.DARKER_GRAY_COLOR;
+
+	//the default hover background color, this needs to be stored for hover effects
+	@Getter
+	private Color hoverBackgroundColor;
+
+	// the input can be blocked (no clicking, no editing, no hover effects)
+	@Getter
+	private boolean blocked;
+
+	public FlatTextField()
+	{
+		setLayout(new BorderLayout());
+		setBorder(new EmptyBorder(0, 10, 0, 0));
+
+		this.textField = new JTextField();
+		this.textField.setBorder(null);
+		this.textField.setOpaque(false);
+		this.textField.setSelectedTextColor(Color.WHITE);
+		this.textField.setSelectionColor(ColorScheme.BRAND_ORANGE_TRANSPARENT);
+
+		add(textField, BorderLayout.CENTER);
+
+		textField.addMouseListener(new MouseAdapter()
+		{
+			@Override
+			public void mouseEntered(MouseEvent mouseEvent)
+			{
+				if (blocked)
+				{
+					return;
+				}
+
+				if (hoverBackgroundColor != null)
+				{
+					setBackground(hoverBackgroundColor, false);
+				}
+			}
+
+			@Override
+			public void mouseExited(MouseEvent mouseEvent)
+			{
+				setBackground(backgroundColor);
+			}
+		});
+	}
+
+	public void addActionListener(ActionListener actionListener)
+	{
+		textField.addActionListener(actionListener);
+	}
+
+	public String getText()
+	{
+		return textField.getText();
+	}
+
+	public void setText(String text)
+	{
+		textField.setText(text);
+	}
+
+	public void addInputKeyListener(KeyListener l)
+	{
+		textField.addKeyListener(l);
+	}
+
+	public void removeInputKeyListener(KeyListener l)
+	{
+		textField.removeKeyListener(l);
+	}
+
+	@Override
+	public void setBackground(Color color)
+	{
+		setBackground(color, true);
+	}
+
+	public void setBackground(Color color, boolean saveColor)
+	{
+		if (color == null)
+		{
+			return;
+		}
+
+		super.setBackground(color);
+		
+		if (saveColor)
+		{
+			this.backgroundColor = color;
+		}
+	}
+
+	public void setHoverBackgroundColor(Color color)
+	{
+		if (color == null)
+		{
+			return;
+		}
+
+		this.hoverBackgroundColor = color;
+	}
+
+	public void setEditable(boolean editable)
+	{
+		this.blocked = !editable;
+		textField.setEditable(editable);
+		textField.setFocusable(editable);
+		if (!editable)
+		{
+			super.setBackground(backgroundColor);
+		}
+	}
+
+	public Document getDocument()
+	{
+		return textField.getDocument();
+	}
+
+}

runelite-client/src/main/java/net/runelite/client/ui/components/IconTextField.java

@@ -1,6 +1,6 @@
 /*
  * Copyright (c) 2017, Adam <Adam@sigterm.info>
- * Copyright (c) 2018, Psikoi <Adam@sigterm.info>
+ * Copyright (c) 2018, Psikoi <https://github.com/psikoi>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -33,31 +33,23 @@ import java.awt.event.ActionListener;
 import java.awt.event.KeyListener;
 import java.awt.event.MouseAdapter;
 import java.awt.event.MouseEvent;
+import java.awt.event.MouseListener;
 import javax.swing.ImageIcon;
 import javax.swing.JLabel;
 import javax.swing.JPanel;
 import javax.swing.JTextField;
 import javax.swing.text.Document;
-import net.runelite.client.ui.ColorScheme;
 
 /**
- * This component is a JTextField with an icon on its left side.
+ * This component is a FlatTextField with an icon on its left side.
  */
 public class IconTextField extends JPanel
 {
-	private final JTextField textField;
+	private final FlatTextField textField;
 
 	//to support gifs, the icon needs to be wrapped in a JLabel
 	private final JLabel iconWrapperLabel;
 
-	//the default background color, this needs to be stored for hover effects
-	private Color backgroundColor = ColorScheme.DARKER_GRAY_COLOR;
-	//the default hover background color, this needs to be stored for hover effects
-	private Color hoverBackgroundColor;
-
-	// the input can be blocked (no clicking, no editing, no hover effects)
-	private boolean blocked;
-
 	public IconTextField()
 	{
 		setLayout(new BorderLayout());
@@ -67,35 +59,44 @@ public class IconTextField extends JPanel
 		this.iconWrapperLabel.setVerticalAlignment(JLabel.CENTER);
 		this.iconWrapperLabel.setHorizontalAlignment(JLabel.CENTER);
 
-		this.textField = new JTextField();
+		textField = new FlatTextField();
-		this.textField.setBorder(null);
+		textField.setBorder(null);
-		this.textField.setOpaque(false);
 
-		add(iconWrapperLabel, BorderLayout.WEST);
+		JTextField innerTxt = textField.getTextField();
-		add(textField, BorderLayout.CENTER);
+		innerTxt.removeMouseListener(innerTxt.getMouseListeners()[innerTxt.getMouseListeners().length - 1]);
 
-		textField.addMouseListener(new MouseAdapter()
+		MouseListener hoverEffect = new MouseAdapter()
 		{
 			@Override
 			public void mouseEntered(MouseEvent mouseEvent)
 			{
-				if (blocked)
+				if (textField.isBlocked())
 				{
 					return;
 				}
 
-				if (hoverBackgroundColor != null)
+				Color hoverColor = textField.getHoverBackgroundColor();
+
+				if (hoverColor != null)
 				{
-					IconTextField.super.setBackground(hoverBackgroundColor);
+					IconTextField.super.setBackground(hoverColor);
+					textField.setBackground(hoverColor, false);
 				}
+
 			}
 
 			@Override
 			public void mouseExited(MouseEvent mouseEvent)
 			{
-				IconTextField.super.setBackground(backgroundColor);
+				setBackground(textField.getBackgroundColor());
 			}
-		});
+		};
+
+		textField.addMouseListener(hoverEffect);
+		innerTxt.addMouseListener(hoverEffect);
+
+		add(iconWrapperLabel, BorderLayout.WEST);
+		add(textField, BorderLayout.CENTER);
 	}
 
 	public void addActionListener(ActionListener actionListener)
@@ -125,8 +126,23 @@ public class IconTextField extends JPanel
 		{
 			return;
 		}
+
 		super.setBackground(color);
-		this.backgroundColor = color;
+
+		if (textField != null)
+		{
+			textField.setBackground(color);
+		}
+	}
+
+	public void setHoverBackgroundColor(Color hoverBackgroundColor)
+	{
+		if (hoverBackgroundColor == null)
+		{
+			return;
+		}
+
+		this.textField.setHoverBackgroundColor(hoverBackgroundColor);
 	}
 
 	public void addInputKeyListener(KeyListener l)
@@ -139,23 +155,12 @@ public class IconTextField extends JPanel
 		textField.removeKeyListener(l);
 	}
 
-	public void setHoverBackgroundColor(Color hoverBackgroundColor)
-	{
-		if (hoverBackgroundColor == null)
-		{
-			return;
-		}
-		this.hoverBackgroundColor = hoverBackgroundColor;
-	}
-
 	public void setEditable(boolean editable)
 	{
-		this.blocked = !editable;
 		textField.setEditable(editable);
-		textField.setFocusable(editable);
 		if (!editable)
 		{
-			super.setBackground(backgroundColor);
+			super.setBackground(textField.getBackgroundColor());
 		}
 	}
 

runelite-client/src/main/java/net/runelite/client/ui/components/materialtabs/MaterialTab.java

@@ -48,7 +48,7 @@ public class MaterialTab extends JLabel
 {
 	private static final Border SELECTED_BORDER = new CompoundBorder(
 		BorderFactory.createMatteBorder(0, 0, 1, 0, ColorScheme.BRAND_ORANGE),
-		BorderFactory.createEmptyBorder(5, 10, 5, 10));
+		BorderFactory.createEmptyBorder(5, 10, 4, 10));
 
 	private static final Border UNSELECTED_BORDER = BorderFactory
 		.createEmptyBorder(5, 10, 5, 10);

runelite-client/src/main/java/net/runelite/client/ui/components/materialtabs/MaterialTabGroup.java

@@ -58,11 +58,19 @@ public class MaterialTabGroup extends JPanel
 	public MaterialTabGroup(JPanel display)
 	{
 		this.display = display;
-		this.display.setLayout(new BorderLayout());
+		if (display != null)
+		{
+			this.display.setLayout(new BorderLayout());
+		}
 		setLayout(new FlowLayout(FlowLayout.CENTER, 8, 0));
 		setOpaque(false);
 	}
 
+	public MaterialTabGroup()
+	{
+		this(null);
+	}
+
 	/* Returns the tab on a certain index. */
 	public MaterialTab getTab(int index)
 	{
@@ -93,16 +101,22 @@ public class MaterialTabGroup extends JPanel
 			return false;
 		}
 
-		display.removeAll();
+		if (display != null)
+		{
+			display.removeAll();
+		}
 
 		for (MaterialTab tab : tabs)
 		{
 			if (tab.equals(selectedTab))
 			{
 				tab.select();
-				display.add(tab.getContent());
+				if (display != null)
-				display.revalidate();
+				{
-				display.repaint();
+					display.add(tab.getContent());
+					display.revalidate();
+					display.repaint();
+				}
 			}
 			else
 			{