[PLA-1779] darkmode fixes

[zlayine]

PR Type

Bug fix, Enhancement

---

Description

• Added dark mode support to QuestionMarkCircleIcon in multiple components.
• Reformatted Btn components in BeamsList.vue for better readability.
• Adjusted class for better alignment of dd element in ClaimBeamSlideover.vue.
• Added null checks for item.flags and item.claimConditions in DetailsBeamSlideover.vue.
• Fixed typo in GraphQL query name in GetCollectionIds.ts.
• Fixed typo in invalid credentials error message in index.ts.

---

Changes walkthrough 📝

	Relevant files
Enhancement	7 files SupportButton.vue Add dark mode support for `QuestionMarkCircleIcon`.            resources/js/components/SupportButton.vue Added dark mode support to QuestionMarkCircleIcon. +1/-1      BeamsList.vue Reformat `Btn` components for readability.                              resources/js/components/beam/BeamsList.vue Reformatted Btn components for better readability. +10/-2    CreateCollection.vue Add dark mode support for `QuestionMarkCircleIcon`.            resources/js/components/pages/create/CreateCollection.vue Added dark mode support to QuestionMarkCircleIcon. +1/-1      CreateFuelTank.vue Add dark mode support for `QuestionMarkCircleIcon`.            resources/js/components/pages/create/CreateFuelTank.vue Added dark mode support to QuestionMarkCircleIcon. +1/-1      CreateToken.vue Add dark mode support for `QuestionMarkCircleIcon`.            resources/js/components/pages/create/CreateToken.vue Added dark mode support to QuestionMarkCircleIcon. +1/-1      ClaimBeamSlideover.vue Adjust class for better alignment of `dd` element.              resources/js/components/slideovers/beam/ClaimBeamSlideover.vue Adjusted class for better alignment of dd element. +1/-1      DetailsListingSlideover.vue Add dark mode support for `QuestionMarkCircleIcon`.            resources/js/components/slideovers/marketplace/DetailsListingSlideover.vue Added dark mode support to QuestionMarkCircleIcon. +9/-3
Bug fix	3 files DetailsBeamSlideover.vue Add null checks for `item.flags` and `item.claimConditions`. resources/js/components/slideovers/beam/DetailsBeamSlideover.vue Added null checks for item.flags and item.claimConditions. +2/-2      GetCollectionIds.ts Fix typo in GraphQL query name.                                                    resources/js/graphql/query/GetCollectionIds.ts Fixed typo in query name from GetCollections to GetCollectionsIds. +1/-1      index.ts Fix typo in invalid credentials error message.                      resources/js/store/index.ts Fixed typo in error message for invalid credentials. +1/-1

---

💡 PR-Agent usage:
Comment /help on the PR to get a list of all available PR-Agent tools and their descriptions

[github-actions]

PR Reviewer Guide 🔍

⏱️ Estimated effort to review [1-5]	2
🧪 Relevant tests	No
🔒 Security concerns	No
⚡ Key issues to review	Possible Bug: The typo fix in index.ts for the error message 'Invalid credentials' seems incorrect. The change introduces 'cInvalid credentials', which appears to be a mistake. Please verify the intended correction.

[github-actions]

PR Code Suggestions ✨

Category	Suggestion	Score
Possible bug	Add a closing tag to the Export button for proper HTML syntax Add a closing tag for the Export button to ensure proper HTML structure and avoid potential rendering issues in different browsers or Vue versions. resources/js/components/beam/BeamsList.vue [71] ->Export</Btn +>Export</Btn> Suggestion importance[1-10]: 10 Why: This suggestion fixes a critical HTML syntax error that could cause rendering issues, making it highly important for the stability of the component.	10
Enhancement	Correct the typo in the error message for better user communication Correct the typo in the error message from 'cInvalid credentials' to 'Invalid credentials' to maintain professionalism and clarity in user-facing messages. resources/js/store/index.ts [216] -throw [{ field: 'Login error', message: 'cInvalid credentials' }]; +throw [{ field: 'Login error', message: 'Invalid credentials' }]; Suggestion importance[1-10]: 10 Why: Correcting the typo in the error message is essential for clear and professional user communication, which is critical for user experience.	10
Best practice	Use the safe navigation operator to prevent errors when properties might be undefined Use the safe navigation operator (?.) consistently in the conditional rendering to prevent runtime errors if item.flags or item.claimConditions are undefined. resources/js/components/slideovers/beam/DetailsBeamSlideover.vue [73-77] +v-if="item.flags?.length" +v-if="item.claimConditions?.length" - Suggestion importance[1-10]: 9 Why: The suggestion improves code robustness by preventing potential runtime errors, which is crucial for maintaining application stability.	9
Possible issue	Adjust the stroke-width attribute to a more typical value to ensure proper icon display Ensure the stroke-width attribute on the QuestionMarkCircleIcon component is set to a reasonable value. The current value of 36 might be excessively large depending on the SVG icon's viewbox settings, potentially causing display issues. resources/js/components/SupportButton.vue [7] -<QuestionMarkCircleIcon class="mr-1 w-5 h-5 cursor-pointer text-light-content dark:text-dark-content" stroke-width="36" /> +<QuestionMarkCircleIcon class="mr-1 w-5 h-5 cursor-pointer text-light-content dark:text-dark-content" stroke-width="2" /> Suggestion importance[1-10]: 8 Why: The suggestion addresses a potential display issue by recommending a more typical stroke-width value, which can improve the visual consistency of the icon.	8