how many times do I have to revamp config

Signed-off-by: syeyoung <cyoung06@naver.com>

11 files changed, 561 insertions, 4 deletions

diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/config/categoryitem.gui b/mod/src/main/resources/assets/dungeonsguide/gui/config/categoryitem.gui
new file mode 100644
index 00000000..41521764
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/config/categoryitem.gui
@@ -0,0 +1,95 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<padding left="5" right="5" top="5" bottom="5">
+
+    <AbstractButton on:click="click" disabled="false">
+        <RoundRect radius="5" backgroundColor="#FF11294d">
+            <col mainAlign="START" crossAlign="STRETCH">
+                <padding left="5" right="5" top="5" bottom="5">
+                    <IntrinsicHeight>
+                        <row mainAlign="START" crossAlign="CENTER">
+                            <aspectRatio width="1" height="1">
+                                <Stencil>
+                                    <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                                    <RoundRect radius="3" slot="stencil"/>
+                                </Stencil>
+                            </aspectRatio>
+                            <size width="5" height="0"/>
+                            <flexible><Text bind:text="name" color="#FFFFFFFF" size="12"/></flexible>
+                        </row>
+                    </IntrinsicHeight>
+                </padding>
+                <flexible>
+                    <padding left="5" bottom="5" right="5" top="3">
+                        <Text bind:text="description" color="#FFAAAAAA"/>
+                    </padding>
+                </flexible>
+            </col>
+        </RoundRect>
+        <RoundRect radius="5" backgroundColor="#FF1d4481" slot="hovered">
+            <col mainAlign="START" crossAlign="STRETCH">
+                <padding left="5" right="5" top="5" bottom="5">
+                    <IntrinsicHeight>
+                        <row mainAlign="START" crossAlign="CENTER">
+
+                            <aspectRatio width="1" height="1">
+                                <Stencil>
+                                    <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                                    <RoundRect radius="3" slot="stencil"/>
+                                </Stencil>
+                            </aspectRatio>
+                            <size width="5" height="0"/>
+                            <flexible><Text bind:text="name" color="#FFFFFFFF" size="12"/></flexible>
+                        </row>
+                    </IntrinsicHeight>
+                </padding>
+                <flexible>
+                    <padding left="5" bottom="5" right="5" top="3">
+                        <Text bind:text="description" color="#FFAAAAAA"/>
+                    </padding>
+                </flexible>
+            </col>
+        </RoundRect>
+        <RoundRect radius="5" backgroundColor="#FF34578e" slot="pressed">
+            <col mainAlign="START" crossAlign="STRETCH">
+                <padding left="5" right="5" top="5" bottom="5">
+                    <IntrinsicHeight>
+                        <row mainAlign="START" crossAlign="CENTER">
+
+                            <aspectRatio width="1" height="1">
+                                <Stencil>
+                                    <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                                    <RoundRect radius="3" slot="stencil"/>
+                                </Stencil>
+                            </aspectRatio>
+                            <size width="5" height="0"/>
+                            <flexible><Text bind:text="name" color="#FFFFFFFF" size="12"/></flexible>
+                        </row>
+                    </IntrinsicHeight>
+                </padding>
+                <flexible>
+                    <padding left="5" bottom="5" right="5" top="3">
+                        <Text bind:text="description" color="#FFAAAAAA"/>
+                    </padding>
+                </flexible>
+            </col>
+        </RoundRect>
+        <size slot="disabled" width="0" height="0"/>
+    </AbstractButton>
+</padding>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/config/categorypage.gui b/mod/src/main/resources/assets/dungeonsguide/gui/config/categorypage.gui
new file mode 100644
index 00000000..6abf4b80
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/config/categorypage.gui
@@ -0,0 +1,40 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<bgcolor backgroundColor="#FF111111">
+    <ScrollablePanel direction="VERTICAL">
+        <padding top="5" left="5" bottom="5" right="5">
+            <col crossAlign="STRETCH" mainAlign="START">
+                <SelectiveContainer bind:visible="categoryShow">
+                    <col crossAlign="STRETCH" mainAlign="START" slot="show">
+                        <padding top="5" left="5" right="5">
+                            <Text text="Categories" size="16" color="#FFFFFFFF"/>
+                        </padding>
+                        <WrapGrid minimumWidth="160" gap="5" bind:_="categories"/>
+                        <size width="0" height="5"/>
+                    </col>
+                    <size width="0" height="0" slot="hide"/>
+                </SelectiveContainer>
+                <padding top="5" left="5" right="5">
+                    <Text text="Features" size="16" color="#FFFFFFFF"/>
+                </padding>
+                <col mainAlign="START" crossAlign="STRETCH" bind:_="items"/>
+            </col>
+        </padding>
+    </ScrollablePanel>
+</bgcolor>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/config/featureitem.gui b/mod/src/main/resources/assets/dungeonsguide/gui/config/featureitem.gui
new file mode 100644
index 00000000..a18bf5e1
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/config/featureitem.gui
@@ -0,0 +1,78 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<padding left="5" right="5" top="5">
+    <col>
+        <line color="#FFFFFFFF"/>
+        <size width="0" height="5"/>
+        <IntrinsicHeight>
+            <row>
+                <aspectRatio width="1" height="1">
+                    <Stencil>
+                        <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                        <RoundRect radius="10" slot="stencil"/>
+                    </Stencil>
+                </aspectRatio>
+                <flexible>
+                    <col mainAlign="START" crossAlign="START">
+                        <padding left="5" right="5" top="5" bottom="5">
+                            <row crossAlign="END">
+                                <flexible>
+                                    <Text bind:text="name" color="#FFFFFFFF" size="12"/>
+                                </flexible>
+                                <SelectiveContainer bind:visible="guiRelocate">
+                                    <size width="0" height="0" slot="hide"/>
+                                    <size width="60" height="12" slot="show">
+                                        <padding left="5">
+                                            <RoundButton on:click="relocate" hPadding="1"
+                                                         text="Relocate"
+                                            />
+                                        </padding>
+                                    </size>
+                                </SelectiveContainer>
+                                <SelectiveContainer bind:visible="configure">
+                                    <size width="0" height="0" slot="hide"/>
+                                    <size width="60" height="12" slot="show">
+                                        <padding left="5">
+                                            <RoundButton on:click="configure" hPadding="1"
+                                                         text="Configure"
+                                            />
+                                        </padding>
+                                    </size>
+                                </SelectiveContainer>
+                                <SelectiveContainer bind:visible="enable">
+                                    <size width="0" height="0" slot="hide"/>
+                                    <size width="45" height="14" slot="show">
+                                        <padding left="5">
+                                            <SimpleToggleButton bind:enabled="isEnabled"/>
+                                        </padding>
+                                    </size>
+                                </SelectiveContainer>
+                            </row>
+                        </padding>
+                        <col crossAlign="START">
+                            <padding left="5" bottom="5" right="5" top="3">
+                                <Text bind:text="description" color="#FFAAAAAA"/>
+                            </padding>
+                        </col>
+                    </col>
+                </flexible>
+            </row>
+        </IntrinsicHeight>
+    </col>
+</padding>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/config/mainpage.gui b/mod/src/main/resources/assets/dungeonsguide/gui/config/mainpage.gui
new file mode 100644
index 00000000..966ed1f0
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/config/mainpage.gui
@@ -0,0 +1,52 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<ScrollablePanel direction="VERTICAL">
+    <padding left="5" top="5" right="5" bottom="5">
+        <col mainAlign="CENTER" crossAlign="CENTER">
+            <size height="30"/>
+            <row mainAlign="CENTER">
+                <Text text="Welcome to" color="#FF747474" size="16"/>
+                <Text text=" Dungeons Guide" color="#FF74A0C6" size="16"/>
+                <Text text="!" color="#FF747474" size="16"/>
+            </row>
+            <size height="3"/>
+            <row mainAlign="CENTER">
+                <Text text="The most " color="#FF747474" size="8"/>
+                <Text text="intelligent" color="#FFFFFF00" size="8"/>
+                <Text text=" skyblock mod" color="#FF747474" size="8"/>
+            </row>
+            <size height="20"/>
+            <line color="#FF747474"/>
+            <size height="5"/>
+            <WrapGrid minimumWidth="160" gap="5" bind:_="categories"/>
+            <size height="5"/>
+            <line color="#FF747474"/>
+            <size height="20"/>
+            <row mainAlign="CENTER">
+                <size height="32" width="32">
+                    <ResourceImage location="dungeonsguide:textures/config/discord.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                </size>
+                <size width="10" height="0"/>
+                <size height="32" width="32">
+                    <ResourceImage location="dungeonsguide:textures/config/github.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                </size>
+            </row>
+        </col>
+    </padding>
+</ScrollablePanel>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/config/menuitem.gui b/mod/src/main/resources/assets/dungeonsguide/gui/config/menuitem.gui
new file mode 100644
index 00000000..a75f08a3
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/config/menuitem.gui
@@ -0,0 +1,68 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+
+<AbstractButton on:click="click" disabled="false">
+    <padding left="10" right="5" top="5" bottom="5">
+        <IntrinsicHeight>
+            <row mainAlign="START" crossAlign="CENTER">
+                <aspectRatio width="1" height="1">
+                    <Stencil>
+                        <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                        <RoundRect radius="3" slot="stencil"/>
+                    </Stencil>
+                </aspectRatio>
+                <size width="5" height="0"/>
+                <Text bind:text="category" color="#FFFFFFFF"/>
+            </row>
+        </IntrinsicHeight>
+    </padding>
+    <bgcolor backgroundColor="#FF356091" slot="hovered">
+        <padding left="10" right="5" top="5" bottom="5">
+            <IntrinsicHeight>
+                <row mainAlign="START" crossAlign="CENTER">
+                    <aspectRatio width="1" height="1">
+                        <Stencil>
+                            <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                            <RoundRect radius="3" slot="stencil"/>
+                        </Stencil>
+                    </aspectRatio>
+                    <size width="5" height="0"/>
+                    <Text bind:text="category" color="#FFFFFFFF"/>
+                </row>
+            </IntrinsicHeight>
+        </padding>
+    </bgcolor>
+    <bgcolor backgroundColor="#FF50799E" slot="pressed">
+        <padding left="10" right="5" top="5" bottom="5">
+            <IntrinsicHeight>
+                <row mainAlign="START" crossAlign="CENTER">
+                    <aspectRatio width="1" height="1">
+                        <Stencil>
+                            <ResourceImage location="dungeonsguide:textures/dglogox128.png" width="128" height="128" textureWidth="128" textureHeight="128"/>
+                            <RoundRect radius="3" slot="stencil"/>
+                        </Stencil>
+                    </aspectRatio>
+                    <size width="5" height="0"/>
+                    <Text bind:text="category" color="#FFFFFFFF"/>
+                </row>
+            </IntrinsicHeight>
+        </padding>
+    </bgcolor>
+    <size slot="disabled" width="0" height="0"/>
+</AbstractButton>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/config/normalconfig.gui b/mod/src/main/resources/assets/dungeonsguide/gui/config/normalconfig.gui
new file mode 100644
index 00000000..6381664f
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/config/normalconfig.gui
@@ -0,0 +1,89 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<align vAlign="CENTER" hAlign="CENTER">
+    <ConstrainedBox maxWidth="700" maxHeight="500">
+        <bgcolor backgroundColor="0xFF111111">
+            <col>
+                <size height="19">
+                    <bgcolor backgroundColor="0xFF1E4684">
+                        <row>
+                            <aspectRatio width="1" height="1">
+                                <ColorButton on:click="back" hPadding="1"
+                                             backgroundColor="#FF1C376E"          textColor="#FFFFFFFF"
+                                             hoveredBackgroundColor="#FF1C5692"   hoveredTextColor="#FFFFFFFF"
+                                             disabledBackgroundColor="0"  disabledTextColor="0"
+                                             pressedBackgroundColor="#FF1D5F9C"   pressedTextColor="#FFFFFFFF"
+                                             text="&lt;"
+                                />
+                            </aspectRatio>
+                            <padding left="5" top="5" bottom="5" right="5">
+                                <Text text="Dungeons Guide v4.0 By syeyoung" color="0xFFFFFFFF"/>
+                            </padding>
+                            <size width="5"/>
+                            <flexible>
+                                <align hAlign="END">
+                                    <ConstrainedBox maxWidth="150">
+                                        <size height="19">
+                                            <TextField/>
+                                        </size>
+                                    </ConstrainedBox>
+                                </align>
+                            </flexible>
+                            <aspectRatio width="1" height="1">
+                                <ColorButton on:click="back" hPadding="1"
+                                             backgroundColor="#FF1C376E"          textColor="#FFFFFFFF"
+                                             hoveredBackgroundColor="#FF1C5692"   hoveredTextColor="#FFFFFFFF"
+                                             disabledBackgroundColor="0"  disabledTextColor="0"
+                                             pressedBackgroundColor="#FF1D5F9C"   pressedTextColor="#FFFFFFFF"
+                                             text="?"
+                                />
+                            </aspectRatio>
+                        </row>
+                    </bgcolor>
+                </size>
+                <line color="#FFFFFFFF"/>
+                <flexible>
+                    <row>
+                        <ConstrainedBox maxWidth="100">
+                            <bgcolor backgroundColor="0xFF000000">
+                                <padding left="0" top="5" bottom="5" right="5">
+                                    <col>
+                                        <col bind:_="menu">
+                                        </col>
+                                        <padding top="4" bottom="4">
+                                            <line color="#FFFFFFFF"/>
+                                        </padding>
+                                        <slot bind:_="relocate"/>
+                                    </col>
+                                </padding>
+                            </bgcolor>
+                        </ConstrainedBox>
+                        <line dir="VERTICAL" color="#FFFFFFFF"/>
+                        <flexible>
+                            <Navigator>
+                                <!-- default page-->
+                                <slot bind:_="mainpage"/>
+                            </Navigator>
+                        </flexible>
+                    </row>
+                </flexible>
+            </col>
+        </bgcolor>
+    </ConstrainedBox>
+</align>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/elements/dgButton.gui b/mod/src/main/resources/assets/dungeonsguide/gui/elements/dgButton.gui
new file mode 100644
index 00000000..c4c52b66
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/elements/dgButton.gui
@@ -0,0 +1,52 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+<wrapper disabled="false" hPadding="0" vPadding="0"
+         backgroundColor="#FF1E387A" hoveredBackgroundColor="#FF356091" disabledBackgroundColor="#FF2E2D2C" pressedBackgroundColor="#FF50799E"
+         textColor="#FFFFFFFF" hoveredTextColor="#FFFFFFFF" disabledTextColor="#FF484848" pressedTextColor="#FFFFFFFF"
+         radius="4">
+    <AbstractButton bind:click="click" bind:disabled="disabled">
+        <RoundRect bind:backgroundColor="backgroundColor" bind:radius="radius">
+            <align vAlign="CENTER" hAlign="CENTER">
+                <padding bind:left="hPadding" bind:right="hPadding" bind:top="vPadding" bind:bottom="vPadding">
+                    <Text bind:text="text" bind:color="textColor" align="CENTER"/>
+                </padding>
+            </align>
+        </RoundRect>
+        <RoundRect slot="hovered" bind:backgroundColor="hoveredBackgroundColor" bind:radius="radius">
+            <align vAlign="CENTER" hAlign="CENTER">
+                <padding bind:left="hPadding" bind:right="hPadding" bind:top="vPadding" bind:bottom="vPadding">
+                    <Text bind:text="text" bind:color="hoveredTextColor" align="CENTER"/>
+                </padding>
+            </align>
+        </RoundRect>
+        <RoundRect slot="disabled" bind:backgroundColor="disabledBackgroundColor" bind:radius="radius">
+            <align vAlign="CENTER" hAlign="CENTER">
+                <padding bind:left="hPadding" bind:right="hPadding" bind:top="vPadding" bind:bottom="vPadding">
+                    <Text bind:text="text" bind:color="disabledTextColor" align="CENTER"/>
+                </padding>
+            </align>
+        </RoundRect>
+        <RoundRect slot="pressed" bind:backgroundColor="pressedBackgroundColor" bind:radius="radius">
+            <align vAlign="CENTER" hAlign="CENTER">
+                <padding bind:left="hPadding" bind:right="hPadding" bind:top="vPadding" bind:bottom="vPadding">
+                    <Text bind:text="text" bind:color="pressedTextColor" align="CENTER"/>
+                </padding>
+            </align>
+        </RoundRect>
+    </AbstractButton>
+</wrapper>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleHorizontalScrollBar.gui b/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleHorizontalScrollBar.gui
index 010cfa6e..3a900a21 100644
--- a/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleHorizontalScrollBar.gui
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleHorizontalScrollBar.gui
@@ -24,12 +24,12 @@
             <bgcolor slot="track" bind:backgroundColor="backgroundColor"/>
             <align slot="thumb">
                 <size height="4">
-                    <ColorButton
+                    <RoundButton
                             bind:backgroundColor="thumbColor"          textColor="#FFFFFFFF"
                             bind:hoveredBackgroundColor="thumbHoverColor"   hoveredTextColor="#FFFFFFFF"
                             disabledBackgroundColor="#00000000"  disabledTextColor="#FFFFFFFF"
                             bind:pressedBackgroundColor="thumbActiveColor"   pressedTextColor="#FFFFFFFF"
-                            text=""
+                            text="" radius="2"
                     />
                 </size>
             </align>
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleToggleButton.gui b/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleToggleButton.gui
new file mode 100644
index 00000000..dba52108
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleToggleButton.gui
@@ -0,0 +1,77 @@
+<!--
+  ~ Dungeons Guide - The most intelligent Hypixel Skyblock Dungeons Mod
+  ~ Copyright (C) 2023  cyoung06 (syeyoung)
+  ~
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU Affero General Public License as published
+  ~ by the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU Affero General Public License for more details.
+  ~
+  ~ You should have received a copy of the GNU Affero General Public License
+  ~ along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+<wrapper>
+    <CircularRect backgroundColor="#FF151515">
+        <padding left="1" top="1" right="1" bottom="1">
+            <AbstractToggleButton bind:enabled="enabled">
+                <CircularRect slot="on" backgroundColor="#FF333333">
+                    <row>
+                        <aspectRatio width="1" height="2" fit="TIGHT"><size/></aspectRatio>
+                        <flexible>
+                            <align vAlign="CENTER" hAlign="START">
+                                <Text text="on" align="LEFT" color="#FFFFFFFF"/>
+                            </align>
+                        </flexible>
+                        <aspectRatio width="1" height="1" fit="TIGHT">
+                            <CircularRect backgroundColor="#FF00FF00" />
+                        </aspectRatio>
+                    </row>
+                </CircularRect>
+                <CircularRect slot="off" backgroundColor="#FF333333">
+                    <row>
+                        <aspectRatio width="1" height="1" fit="TIGHT">
+                            <CircularRect backgroundColor="#FFFF0000" />
+                        </aspectRatio>
+                        <flexible>
+                            <align vAlign="CENTER" hAlign="END">
+                                <Text text="off" align="RIGHT" color="#FFFFFFFF"/>
+                            </align>
+                        </flexible>
+                        <aspectRatio width="1" height="2" fit="TIGHT"><size/></aspectRatio>
+                    </row>
+                </CircularRect>
+                <CircularRect slot="hoverOn" backgroundColor="#FF555555">
+                    <row>
+                        <aspectRatio width="1" height="2" fit="TIGHT"><size/></aspectRatio>
+                        <flexible>
+                            <align vAlign="CENTER" hAlign="START">
+                                <Text text="on" align="LEFT" color="#FFFFFFFF"/>
+                            </align>
+                        </flexible>
+                        <aspectRatio width="1" height="1" fit="TIGHT">
+                            <CircularRect backgroundColor="#FF00FF00" />
+                        </aspectRatio>
+                    </row>
+                </CircularRect>
+                <CircularRect slot="hoverOff" backgroundColor="#FF555555">
+                    <row>
+                        <aspectRatio width="1" height="1" fit="TIGHT">
+                            <CircularRect backgroundColor="#FFFF0000" />
+                        </aspectRatio>
+                        <flexible>
+                            <align vAlign="CENTER" hAlign="END">
+                                <Text text="off" align="RIGHT" color="#FFFFFFFF"/>
+                            </align>
+                        </flexible>
+                        <aspectRatio width="1" height="2" fit="TIGHT"><size/></aspectRatio>
+                    </row>
+                </CircularRect>
+            </AbstractToggleButton>
+        </padding>
+    </CircularRect>
+</wrapper>
\ No newline at end of file
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleVerticalScrollBar.gui b/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleVerticalScrollBar.gui
index 9242a05c..a20533c6 100644
--- a/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleVerticalScrollBar.gui
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/elements/simpleVerticalScrollBar.gui
@@ -24,12 +24,12 @@
             <bgcolor slot="track" bind:backgroundColor="backgroundColor"/>
             <align slot="thumb">
                 <size width="4">
-                    <ColorButton
+                    <RoundButton
                             bind:backgroundColor="thumbColor"          textColor="#FFFFFFFF"
                             bind:hoveredBackgroundColor="thumbHoverColor"   hoveredTextColor="#FFFFFFFF"
                             disabledBackgroundColor="#00000000"  disabledTextColor="#FFFFFFFF"
                             bind:pressedBackgroundColor="thumbActiveColor"   pressedTextColor="#FFFFFFFF"
-                            text=""
+                            text="" radius="2"
                     />
                 </size>
             </align>
diff --git a/mod/src/main/resources/assets/dungeonsguide/gui/elements/toggleButton.gui b/mod/src/main/resources/assets/dungeonsguide/gui/elements/toggleButton.gui
new file mode 100644
index 00000000..551c6baa
--- /dev/null
+++ b/mod/src/main/resources/assets/dungeonsguide/gui/elements/toggleButton.gui
@@ -0,0 +1,6 @@
+<multi>
+    <slot bind:child="wgtOn" bind:ref="refOn"/>
+    <slot bind:child="wgtOff" bind:ref="refOff"/>
+    <slot bind:child="wgtHoverOn" bind:ref="refHoverOn"/>
+    <slot bind:child="wgtHoverOff" bind:ref="refHoverOff"/>
+</multi>
\ No newline at end of file