This repository has been archived on 2024-11-20. You can view files and clone it, but cannot push or open issues or pull requests.
colourmeok/ColourMeOKGame/Assets/UI/GameUI.uxml

274 lines
26 KiB
XML
Raw Normal View History

2024-11-19 22:13:53 +08:00
<ui:UXML xmlns:ui="UnityEngine.UIElements" xsi="http://www.w3.org/2001/XMLSchema-instance"
engine="UnityEngine.UIElements" editor="UnityEditor.UIElements"
noNamespaceSchemaLocation="../../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
<Style src="project://database/Assets/UI/GameUI.uss?fileID=7433441132597879392&amp;guid=2c7ff79f21a3e8e408e76d75944d575b&amp;type=3#GameUI"/>
<ui:VisualElement name="Root"
style="flex-grow: 1; background-color: rgb(208, 152, 194); justify-content: space-around; align-items: stretch; align-self: stretch; flex-direction: row;">
<ui:VisualElement name="SideView"
style="flex-grow: 0; background-color: rgb(15, 13, 27); flex-shrink: 0; width: 25%; justify-content: space-between;">
<ui:VisualElement name="Header"
style="flex-grow: 0; margin-top: 10%; margin-right: 10%; margin-bottom: 0; margin-left: 10%; justify-content: space-between; align-items: flex-start; flex-direction: column;">
<ui:Label tabindex="-1" text="Colour Me OK" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="Name"
style="color: rgb(208, 152, 194); -unity-font-style: bold; font-size: 58px; white-space: normal;"/>
<ui:Label tabindex="-1"
text="Color Me OK is a colour-matching game using the coordinates of the OKLCh colour model on the OKLab perceptually uniform colour space."
parse-escape-sequences="true" display-tooltip-when-elided="true" name="Description"
style="font-size: 16px; white-space: normal; text-overflow: clip; color: rgb(208, 152, 194);"/>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="Content"
style="flex-grow: 0; padding-right: 10%; padding-bottom: 10%; padding-left: 10%;">
<ui:Button text="Play ↗" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="PlayButton" style="display: none;"/>
<ui:Button text="Leaderboard ↗" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="LeaderboardButton" style="display: none;"/>
<ui:Button text="Account ↗" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="AccountButton" style="display: none;"/>
<ui:VisualElement name="AccountSection"
style="flex-grow: 0; border-top-color: rgb(208, 152, 194); margin-top: 0; border-top-width: 1px; margin-right: 0; margin-bottom: 0; margin-left: 0; border-bottom-color: rgb(208, 152, 194); padding-bottom: 12px; border-bottom-width: 1px; display: flex;">
<ui:VisualElement name="PlayerDetails"
style="flex-grow: 1; flex-direction: row; align-items: stretch; justify-content: space-between; font-size: 10px; align-self: stretch;">
<ui:VisualElement name="PlayerNameDetail" style="flex-grow: 1;">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Player" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="PlayerHeader"
style="-unity-font-style: normal; font-size: 14px; padding-bottom: 0; -unity-text-align: lower-left;"/>
<ui:Label tabindex="-1" text="Not Signed In" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="PlayerText"
style="-unity-font-style: normal; font-size: 18px; padding-top: 6px; text-overflow: clip;"/>
</ui:VisualElement>
<ui:VisualElement name="PlayerRatingDetail" style="flex-grow: 0;">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Rating" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="RatingHeader"
style="-unity-font-style: normal; font-size: 14px; padding-bottom: 0; -unity-text-align: lower-right;"/>
<ui:Label tabindex="-1" text="00.00%" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="RatingText"
style="-unity-font-style: normal; font-size: 18px; padding-top: 6px; -unity-text-align: upper-right; text-overflow: ellipsis;"/>
</ui:VisualElement>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="AccuracyDetails"
style="flex-grow: 1; flex-direction: row; align-items: stretch; justify-content: space-between; font-size: 10px; align-self: stretch; padding-top: 4px;">
<ui:VisualElement name="LightnessAccuracyDetail" style="flex-grow: 0;">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Lightness&#10;Accuracy" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="LightnessAccuracyHeader"
style="-unity-font-style: normal; font-size: 14px; padding-bottom: 0; -unity-text-align: lower-left; padding-top: 0;"/>
<ui:Label tabindex="-1" text="00.0%" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="LightnessAccuracyText"
style="-unity-font-style: normal; font-size: 18px; padding-top: 6px; padding-bottom: 0;"/>
</ui:VisualElement>
<ui:VisualElement name="ChromaAccuracyDetail" style="flex-grow: 0;">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Chroma&#10;Accuracy" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ChromaAccuracyHeader"
style="-unity-font-style: normal; font-size: 14px; padding-bottom: 0; -unity-text-align: lower-center; padding-top: 0;"/>
<ui:Label tabindex="-1" text="00.0%" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ChromaAccuracyText"
style="-unity-font-style: normal; font-size: 18px; padding-top: 6px; -unity-text-align: upper-center; padding-bottom: 0;"/>
</ui:VisualElement>
<ui:VisualElement name="HueAccuracyDetail" style="flex-grow: 0;">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Hue&#10;Accuracy" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="HueAccuracyHeader"
style="-unity-font-style: normal; font-size: 14px; padding-bottom: 0; -unity-text-align: lower-right; padding-top: 0;"/>
<ui:Label tabindex="-1" text="00.0%" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="HueAccuracyText"
style="-unity-font-style: normal; font-size: 18px; padding-top: 6px; -unity-text-align: upper-right; padding-bottom: 0;"/>
</ui:VisualElement>
</ui:VisualElement>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ConnectionStatus"
style="flex-grow: 0; border-top-color: rgb(208, 152, 194); margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; border-bottom-color: rgb(208, 152, 194); padding-bottom: 12px; display: flex; border-bottom-width: 1px;">
<ui:Label tabindex="-1" text="Status: Unknown" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ConnectionStatusText"
style="-unity-font-style: normal; font-size: 14px; padding-bottom: 0; -unity-text-align: lower-left; display: flex;"/>
2024-11-17 22:05:04 +08:00
</ui:VisualElement>
</ui:VisualElement>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="MainView"
style="flex-grow: 0; flex-shrink: 0; width: 75%; justify-content: space-between;">
<ui:VisualElement name="DefaultView"
style="flex-grow: 0; justify-content: space-around; height: 100%; align-self: stretch; display: none;">
<ui:VisualElement name="DemoResponseColour"
style="flex-grow: 1; background-color: rgb(0, 0, 0); align-self: stretch; justify-content: center;">
<ui:VisualElement name="DemoResponseSliderContainer"
style="flex-grow: 0; margin-top: 3.25%; margin-right: 3.25%; margin-bottom: 3.25%; margin-left: 3.25%; padding-top: 2%; padding-right: 2%; padding-bottom: 2%; padding-left: 2%; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; background-color: rgb(208, 152, 194);">
<ui:Slider label="Lightness" high-value="100" name="DemoResponseLightnessSlider"
class="lch-slider"/>
<ui:Slider label="Chroma" high-value="0.5" name="DemoResponseChromaSlider" class="lch-slider"/>
<ui:Slider label="Hue" high-value="360" name="DemoResponseHueSlider" class="lch-slider"/>
</ui:VisualElement>
</ui:VisualElement>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="GameView"
style="flex-grow: 0; margin-top: 3.25%; margin-right: 3.25%; margin-bottom: 3.25%; margin-left: 3.25%; justify-content: space-between; height: 100%; align-self: stretch; display: none;">
<ui:VisualElement name="GameHeader"
style="flex-grow: 0; flex-direction: row; justify-content: space-between; align-self: stretch;">
<ui:Label tabindex="-1" text="1/5" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="RoundText" style="font-size: 58px; -unity-font-style: normal;"/>
<ui:Label tabindex="-1" text="0.00s" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="TimeText"
style="-unity-text-align: lower-right; font-size: 58px;"/>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ColourPreview"
style="flex-grow: 0; height: 50%; background-color: rgb(255, 255, 255); border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; flex-direction: row; padding-top: 2%; padding-right: 2%; padding-bottom: 2%; padding-left: 2%; justify-content: space-between;">
<ui:VisualElement name="TemplatePreview"
style="flex-grow: 0; flex-shrink: 0; height: 100%; width: 49%;">
<ui:Label tabindex="-1" text="Template" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="TemplateText"
style="margin-bottom: 12px; margin-top: 0; -unity-font-style: normal;"/>
<ui:VisualElement name="TemplateColour"
style="flex-grow: 1; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; background-color: rgb(0, 0, 0);"/>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ResponsePreview"
style="flex-grow: 0; flex-shrink: 0; height: 100%; width: 49%;">
<ui:Label tabindex="-1" text="Response" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ResponseText"
style="margin-bottom: 12px; margin-top: 0; -unity-font-style: normal; -unity-text-align: upper-right;"/>
<ui:VisualElement name="ResponseColour"
style="flex-grow: 1; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; background-color: rgb(0, 0, 0);"/>
</ui:VisualElement>
</ui:VisualElement>
<ui:VisualElement name="ResponseSliders" style="flex-grow: 0; display: flex;">
2024-11-19 22:13:53 +08:00
<ui:Slider label="Lightness" high-value="100" name="ResponseLightnessSlider" class="lch-slider"/>
<ui:Slider label="Chroma" high-value="0.5" name="ResponseChromaSlider" class="lch-slider"/>
<ui:Slider label="Hue" high-value="360" name="ResponseHueSlider" class="lch-slider"/>
2024-11-17 07:29:22 +08:00
</ui:VisualElement>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ResultsView"
style="flex-grow: 1; display: none; margin-top: 3.25%; margin-right: 3.25%; margin-bottom: 3.25%; margin-left: 3.25%; justify-content: space-between;">
<ui:VisualElement name="ColourShowcase"
style="flex-grow: 1; background-color: rgb(255, 255, 255); border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; padding-top: 2%; padding-right: 2%; padding-bottom: 2%; padding-left: 2%; margin-bottom: 2%; margin-top: 0; margin-right: 0; margin-left: 0;">
<ui:Label tabindex="-1" text="Templates" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcaseTemplatesText"
style="-unity-text-align: upper-center; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 2%; padding-left: 0;"/>
<ui:VisualElement name="Gallery" style="flex-grow: 1; flex-direction: row;">
<ui:VisualElement name="ShowcasePair1" style="flex-grow: 1;">
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ShowcasePair1TemplateColour"
style="flex-grow: 1; background-color: rgb(15, 13, 27); border-top-left-radius: 8px; border-bottom-left-radius: 8px;"/>
<ui:Label tabindex="-1" text="100% 100% 100% (100%)" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcasePair1Info"
style="-unity-text-align: upper-center; font-size: 18px;"/>
<ui:VisualElement name="ShowcasePair1ResponseColour"
style="flex-grow: 1; border-bottom-left-radius: 8px; border-left-color: rgb(26, 22, 40); border-right-color: rgb(26, 22, 40); border-top-color: rgb(26, 22, 40); border-bottom-color: rgb(26, 22, 40); background-color: rgb(26, 22, 40); border-top-left-radius: 8px;"/>
</ui:VisualElement>
<ui:VisualElement name="ShowcasePair2" style="flex-grow: 1;">
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ShowcasePair2TemplateColour"
style="flex-grow: 1; background-color: rgb(42, 33, 56);"/>
<ui:Label tabindex="-1" text="100% 100% 100% (100%)" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcasePair2Info"
style="-unity-text-align: upper-center; font-size: 18px;"/>
<ui:VisualElement name="ShowcasePair2ResponseColour"
style="flex-grow: 1; background-color: rgb(63, 48, 76);"/>
</ui:VisualElement>
<ui:VisualElement name="ShowcasePair3" style="flex-grow: 1;">
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ShowcasePair3TemplateColour"
style="flex-grow: 1; background-color: rgb(63, 48, 76);"/>
<ui:Label tabindex="-1" text="100% 100% 100% (100%)" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcasePair3Info"
style="-unity-text-align: upper-center; font-size: 18px;"/>
<ui:VisualElement name="ShowcasePair3ResponseColour"
style="flex-grow: 1; background-color: rgb(89, 67, 100);"/>
</ui:VisualElement>
<ui:VisualElement name="ShowcasePair4" style="flex-grow: 1;">
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ShowcasePair4TemplateColour"
style="flex-grow: 1; background-color: rgb(89, 67, 100);"/>
<ui:Label tabindex="-1" text="100% 100% 100% (100%)" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcasePair4Info"
style="-unity-text-align: upper-center; font-size: 18px;"/>
<ui:VisualElement name="ShowcasePair4ResponseColour"
style="flex-grow: 1; background-color: rgb(122, 90, 126);"/>
</ui:VisualElement>
<ui:VisualElement name="ShowcasePair5" style="flex-grow: 1;">
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="ShowcasePair5TemplateColour"
style="flex-grow: 1; background-color: rgb(162, 118, 158); border-top-right-radius: 8px; border-bottom-right-radius: 8px;"/>
<ui:Label tabindex="-1" text="100% 100% 100% (100%)" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcasePair5Info"
style="-unity-text-align: upper-center; font-size: 18px;"/>
<ui:VisualElement name="ShowcasePair5ResponseColour"
style="flex-grow: 1; background-color: rgb(208, 152, 194); border-top-right-radius: 8px; border-bottom-right-radius: 8px;"/>
</ui:VisualElement>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Responses" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="ShowcaseResponsesText"
style="-unity-text-align: upper-center; padding-top: 1.5%; padding-right: 0; padding-bottom: 0; padding-left: 0; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0;"/>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1"
text="Over n rounds,&#10;you were 100.00% accurate.&#10;&#10;Lightness was 100.00% accurate. (+100.00% from your average)&#10;Chroma was 100.00% accurate. (+100.00% from your average)&#10;Hue was 100.00% accurate. (+100.00% from your average)&#10;&#10;Your RATING has increased by 100.00%."
parse-escape-sequences="true" display-tooltip-when-elided="true" name="ResultsText"
style="flex-grow: 0; margin-top: 2%; margin-right: 0; margin-bottom: 0; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0;"/>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="LeaderboardView"
style="flex-grow: 1; display: flex; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; margin-top: 3.25%; margin-right: 3.25%; margin-bottom: 3.25%; margin-left: 3.25%; flex-direction: column; justify-content: space-between;">
<ui:Label tabindex="-1" text="Leaderboard" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="LeaderboardHeader"
style="font-size: 58px; -unity-font-style: normal;"/>
2024-11-19 21:03:04 +08:00
<ui:VisualElement name="LeaderboardContent" style="height: 80%; flex-direction: column;">
<ui:VisualElement name="LeaderboardEntryHeader">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="Rank" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="EntryRankPosition"
style="white-space: nowrap; width: 10%;"/>
<ui:Label tabindex="-1" text="Username" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="EntryNameText"
style="white-space: nowrap; width: 70%;"/>
<ui:Label tabindex="-1" text="Rating" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="EntryRatingText"
style="white-space: nowrap; width: 20%; -unity-text-align: upper-right;"/>
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:ScrollView name="LeaderboardListContent" vertical-scroller-visibility="Hidden"
horizontal-scroller-visibility="Hidden">
2024-11-19 21:03:04 +08:00
<ui:VisualElement name="LeaderboardEntryReference" style="display: flex;">
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="#1" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="EntryRankPosition"
style="white-space: nowrap; width: 10%;"/>
<ui:Label tabindex="-1" text="Jitomi Monoe" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="EntryNameText"
style="white-space: nowrap; width: 70%;"/>
<ui:Label tabindex="-1" text="000.000" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="EntryRatingText"
style="white-space: nowrap; width: 20%; -unity-text-align: upper-right;"/>
2024-11-19 21:03:04 +08:00
</ui:VisualElement>
</ui:ScrollView>
</ui:VisualElement>
2024-11-17 07:29:22 +08:00
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="AccountView"
style="flex-grow: 1; display: none; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; margin-top: 3.25%; margin-right: 3.25%; margin-bottom: 3.25%; margin-left: 3.25%; flex-direction: column; justify-content: space-between;">
<ui:Label tabindex="-1" text="You are not signed in." parse-escape-sequences="true"
display-tooltip-when-elided="true" name="AccountHeader"
style="font-size: 58px; -unity-font-style: normal;"/>
2024-11-17 07:29:22 +08:00
<ui:VisualElement name="AccountFields" style="flex-grow: 0;">
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="UsernameContainer"
style="flex-grow: 1; flex-direction: row; justify-content: space-between;">
<ui:TextField picking-mode="Ignore" label="Username" name="UsernameField"/>
<ui:Button text="Update" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="UsernameUpdateButton"/>
2024-11-17 07:29:22 +08:00
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="EmailContainer"
style="flex-grow: 1; flex-direction: row; justify-content: space-between;">
<ui:TextField picking-mode="Ignore" label="Email" name="EmailField"
keyboard-type="EmailAddress"/>
<ui:Button text="Update" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="EmailUpdateButton"/>
2024-11-17 07:29:22 +08:00
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:VisualElement name="PasswordContainer"
style="flex-grow: 1; flex-direction: row; justify-content: space-between;">
<ui:TextField picking-mode="Ignore" label="Password" name="PasswordField" password="true"/>
<ui:Button text="Update" parse-escape-sequences="true" display-tooltip-when-elided="true"
name="PasswordUpdateButton"/>
2024-11-17 07:29:22 +08:00
</ui:VisualElement>
2024-11-19 22:13:53 +08:00
<ui:Label tabindex="-1" text="A verification email has been sent. Check your inbox."
parse-escape-sequences="true" display-tooltip-when-elided="true" name="AccompanyingText"
style="padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; margin-top: 1.5%; margin-right: 0; margin-bottom: 0.75%; margin-left: 0; -unity-text-align: upper-left; display: none;"/>
2024-11-17 07:29:22 +08:00
</ui:VisualElement>
<ui:VisualElement name="AccountButtons" style="flex-grow: 0; align-items: flex-start;">
2024-11-19 22:13:53 +08:00
<ui:Button text="Primary Action Button →" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="PrimaryActionButton"
style="-unity-text-align: middle-center; margin-bottom: 1%; margin-right: 1%; margin-top: 1%; -unity-font-style: bold;"/>
<ui:Button text="Secondary Action Button →" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="SecondaryActionButton"
style="-unity-text-align: middle-center; margin-bottom: 1%; margin-right: 1%; margin-top: 1%; -unity-font-style: bold;"/>
<ui:Button text="Tertiary Action Button →" parse-escape-sequences="true"
display-tooltip-when-elided="true" name="TertiaryActionButton"
style="margin-top: 1%; margin-right: 1%; -unity-font-style: bold;"/>
</ui:VisualElement>
</ui:VisualElement>
</ui:VisualElement>
</ui:VisualElement>
</ui:UXML>