status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity
status-desktop/ui/imports/Themes/LightTheme.qml

129 lines
5.4 KiB
QML
Raw Normal View History

feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
import QtQuick 2.13
import "."
Theme {
fix: fix a lot of issues relative to dark theme Fixes #1997
2021-03-16 19:19:48 +00:00
property string name: "light"
feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
property color white: "#FFFFFF"
property color white2: "#FCFCFC"
property color black: "#000000"
property color grey: "#EEF2F5"
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color grey1: "#F0F2F5"
property color grey2: "#F6F8FA"
property color grey3: "#E9EDF1"
feat: introduce new StatusContextMenuButton component We've been implementing such a button in various ways throughout the application. Sometimes using SVG icons and rectangles, sometimes highjacking `StyledText` components (which was clever though). Obviously this resulted in inconsistencies, so this commit introduces a new dedicated component to render the three-dots button for context menus.
2021-03-17 09:16:30 +00:00
property color midGrey: "#7f8990"
feat: introduce new chat input component Closes #757
2020-09-29 09:06:57 +00:00
property color lightGrey: "#ccd0d4"
feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
property color lightBlue: "#ECEFFC"
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color translucentBlue: "#1a4360df"
fix: link color
2020-08-05 12:38:45 +00:00
property color cyan: "#00FFFF"
feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
property color blue: "#4360DF"
WIP SAVEPOINT
2020-08-25 11:15:18 +00:00
property color darkAccentBlue: "#2946C4"
feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
property color transparent: "#00000000"
property color darkGrey: "#939BA1"
fix: fix reply colors in dark mode
2020-09-22 14:30:49 +00:00
property color lighterDarkGrey: "#b3bec6"
feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
property color lightBlueText: "#8f9fec"
property color darkBlue: "#3c55c9"
property color darkBlueBtn: "#5a70dd"
property color red: "#FF2D55"
feat: Un/install free sticker packs in sticker market Sticker pack details retreived from contract: - pack data decoded from contract response - data contains contentHash which, once decoded, contains an IPFS identifier - futher pack data in EDN format is downloaded from IPFS - the EDN info is decoded in to a StickerPack List of available packs from contract are obtained separately from list of installed contracts (stored as a setting in Status-go). Sticker market contains dynamic list of sticker packs. The sticker button shown for each pack has all states defined (in the design) for all UI states (ie bought, free, installed, pending, etc) Add modal popup showing sticker pack details and list of stickers to be un/installed. Contains a "larger" version of the sticker pack button with many differnt UI states defined. Uninstallation of a sticker pack removes those sticker pack's stickers from the recent sticker list and persists the list Simplify the view model by including stickers, instead of setting an "activeStickerPackId" property. This allowed for display of sticker pack stickers to be displayed in the modal popup separately from the sticker packs shown in the market.
2020-06-29 22:02:19 +00:00
property color lightRed: "#FFEAEE"
property color green: "#4EBC60"
fix: link color
2020-08-05 12:38:45 +00:00
property color turquoise: "#007b7d"
feat/tx-comps: Add RecipientSelector component Based on the spec in https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20, this component handles user input for a recipient address, which can be sourced from manual address input, ENS name, contact selection, or another of the user's wallet accounts.
2020-08-06 07:25:53 +00:00
property color tenPercentBlack: Qt.rgba(0, 0, 0, 0.1)
feat: edit messages
2021-06-29 14:49:32 +00:00
property color fivePercentBlack: "#E5E5E5"
feat/tx-comps: Add RecipientSelector component Based on the spec in https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20, this component handles user input for a recipient address, which can be sourced from manual address input, ENS name, contact selection, or another of the user's wallet accounts.
2020-08-06 07:25:53 +00:00
property color tenPercentBlue: Qt.rgba(67, 96, 223, 0.1)
feat: user list
2021-06-30 18:46:26 +00:00
property color orange: "#FFA500"
feat(@desktop/chat): Save favorites and recents gif
2021-08-03 08:48:06 +00:00
property color yellow: "#FFCA0F"
feat: display connected/disconnected status in the chat module
2020-07-15 16:19:25 +00:00
feat: add dark theme colors and new properties for it
2020-07-13 18:45:54 +00:00
property color background: white
chore(theme): add dropShadow theme color and use it where needed
2021-07-29 19:20:15 +00:00
property color dropShadow: "#22000000"
fix(ui): use correct light theme color for app bar divider
2021-04-13 15:24:07 +00:00
property color appBarDividerColor: darkGrey
feat: add dark theme colors and new properties for it
2020-07-13 18:45:54 +00:00
property color border: grey
feat/tx-comps: Add RecipientSelector component Based on the spec in https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20, this component handles user input for a recipient address, which can be sourced from manual address input, ENS name, contact selection, or another of the user's wallet accounts.
2020-08-06 07:25:53 +00:00
property color borderSecondary: tenPercentBlack
property color borderTertiary: blue
fix: channel context menu colors Fixes #2363
2021-04-27 18:02:45 +00:00
property color separator: grey
feat: add dark theme colors and new properties for it
2020-07-13 18:45:54 +00:00
property color textColor: black
feat/tx-comps: Add RecipientSelector component Based on the spec in https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20, this component handles user input for a recipient address, which can be sourced from manual address input, ENS name, contact selection, or another of the user's wallet accounts.
2020-08-06 07:25:53 +00:00
property color textColorTertiary: blue
make url color blue
2021-05-05 18:23:43 +00:00
property color linkColor: blue
feat: add dark theme colors and new properties for it
2020-07-13 18:45:54 +00:00
property color currentUserTextColor: white
property color secondaryBackground: lightBlue
fix: fix dark theme colors for chat and profile
2020-07-22 20:16:06 +00:00
property color inputBackground: grey
fix(edit): fix edit input text color in dark theme
2021-07-08 16:11:55 +00:00
property color secondaryInputBackground: fivePercentBlack
property color secondaryInputText: textColor
feat(tx-comps): Send transaction modal Fixes #669. Composes all tx components to create a send transaction modal for the wallet. 1. Add a reusable TransactionStackView component that wraps a StackView component to show the screens of the Send Tx modal and handles back/forward/reset functionality. 2. Add a reusable TransactionStackGroup which holds tx components and allows modal header and button text to be defined and handles validation for all child components. 3. Add an isValid property to all tx comps for pristine validation state. 4. Reset all components in modal once modal is closed. This consists of a `resetInternal` function that each component should implement to reinstate its original starting state, and a `reset` function that parent components can use to reinstate the overridden properties. 5. Tx error handling to display either a StatusGo error message in the dialog, or wrong password in the TransactionSigner. 6. Fix ReceiveModal to allow for pre-selected account based on current wallet account. 7. Add focused border colour to Input component. 8. Fix issue with last TransactionStackGroup input not being able to obtain focus. 9. Fix fiatBalance not appearing on initial load on AccountSelector. 10. Fix selected asset updated properly when assets changed in the AssetSelector component. 11. AccountSelector is pre-populated with selected wallet account. Supporting work on the components has been done to suppor this. 12. Changing accounts in the "from account" updates the asset balances in the AssetAndAmountInput component. 13. Move validation from ContactSelector to the Select component. 1. Test sending of tokens. This requires that tokens contracts are setup on testnet. Right now, they are set up for contract addresses on mainnet. 2. Loading state once transaction is sent. Button in modal needs to move to a loading state and the "toast" messages in the wallet need to appear informaing user of tx progress. 3. Need to clarify (and implement?) support of ENS names in the AddressInput. It appears that ENS names could be resolved. This would be a long operation and require some kind of UI loading indication. 4. Wallet balances need to be updated on every block, so for example, sending funds between accounts I should be able to see the balance updated in real time. 1. Sending to a contact currently doesn't work because the ContactSelector component selects the Contact's whipser key, instead of his/her wallet address. May need to figure out how this is done in status-react. As it stands, attempting to send to a contact will crash the app. 2. Sending *from* an imported account does not work, with an error from StatusGo `cannot locate account for address: 0x123...`
2020-08-20 04:45:29 +00:00
property color inputBorderFocus: blue
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color secondaryMenuBorder: grey3
fix: fix dark theme colors for chat and profile
2020-07-22 20:16:06 +00:00
property color inputColor: black
feat: add dark theme colors and new properties for it
2020-07-13 18:45:54 +00:00
property color modalBackground: white2
feat: Send transaction component -- Account selector Fixes #670. Component spec based on https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20. Changes the current Select shared component to a model databound component. This means we can bind directly to `QAbstractListModel`'s coming from Nim instead of needing manipulating the data in to javascript objects. The changes to the Select component will be used for the upcoming Asset selector shared component.
2020-07-30 05:18:54 +00:00
property color backgroundHover: grey
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color menuBackgroundActive: grey3
property color menuBackgroundHover: grey1
feat: add colors for mentions for light and dark theme
2021-02-18 19:59:31 +00:00
property color backgroundHoverLight: grey
feat: Send transaction component -- Account selector Fixes #670. Component spec based on https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20. Changes the current Select shared component to a model databound component. This means we can bind directly to `QAbstractListModel`'s coming from Nim instead of needing manipulating the data in to javascript objects. The changes to the Select component will be used for the upcoming Asset selector shared component.
2020-07-30 05:18:54 +00:00
property color secondaryText: darkGrey
feat/tx-comps: Add RecipientSelector component Based on the spec in https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20, this component handles user input for a recipient address, which can be sourced from manual address input, ENS name, contact selection, or another of the user's wallet accounts.
2020-08-06 07:25:53 +00:00
property color secondaryHover: tenPercentBlack
feat: show toast message for transaction status changes
2020-09-14 14:58:21 +00:00
property color primary: blue
feat: Send transaction component -- Account selector Fixes #670. Component spec based on https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20. Changes the current Select shared component to a model databound component. This means we can bind directly to `QAbstractListModel`'s coming from Nim instead of needing manipulating the data in to javascript objects. The changes to the Select component will be used for the upcoming Asset selector shared component.
2020-07-30 05:18:54 +00:00
property color danger: red
feat: show toast message for transaction status changes
2020-09-14 14:58:21 +00:00
property color success: green
fix(wallet): make it possible to send a 0 tx with a warning Fixes #2652
2021-07-07 18:37:49 +00:00
property color warning: orange
feat/tx-comps: Add RecipientSelector component Based on the spec in https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20, this component handles user input for a recipient address, which can be sourced from manual address input, ENS name, contact selection, or another of the user's wallet accounts.
2020-08-06 07:25:53 +00:00
property color primaryMenuItemHover: blue
property color primaryMenuItemTextHover: white
property color backgroundTertiary: tenPercentBlue
fix: Sticker market dark mode support
2020-09-17 06:40:41 +00:00
property color pillButtonTextColor: white
fix: reply text colors fixes #1378
2020-12-02 10:53:04 +00:00
property color chatReplyCurrentUser: darkGrey
feat(@desktop/chat): editing message in markdown mode
2021-08-24 14:14:19 +00:00
property color codeBackground: "#EEF2F5"
Fixes #1611
2021-01-13 23:04:20 +00:00
property color primarySelectionColor: "#b4c8ff"
feat: redisgn compact mode part 1 redesigns the compact mode to have a nice hover, easier replying and adding reactions and more Missing parts are aligning chat command, images and unfurlings, redesigning mentions and the channel list and also trying to find a way to re-enable link hovers in the text
2021-01-25 20:50:42 +00:00
property color emojiReactionBackground: "#e2e6e9"
property color emojiReactionBackgroundHovered: "#d7dadd"
fix: add hover color for active emoji and fix corner
2021-02-02 16:54:29 +00:00
property color emojiReactionActiveBackgroundHovered: "#cbd5f1"
feat: improve compact mode to fix all alignements
2021-02-01 18:40:55 +00:00
property color mentionColor: "#0DA4C9"
feat: add colors for mentions for light and dark theme
2021-02-18 19:59:31 +00:00
property color mentionBgColor: "#1a07bce9"
fix: add mention hover Fixes: #2388 Adds a specific background color to hovered mentions.
2021-05-06 23:40:23 +00:00
property color mentionBgHoverColor: "#4d07bce9"
feat: add colors for mentions for light and dark theme
2021-02-18 19:59:31 +00:00
property color mentionMessageColor: "#1a07bce9"
property color mentionMessageHoverColor: "#3307bce9"
fix: fix a lot of issues relative to dark theme Fixes #1997
2021-03-16 19:19:48 +00:00
property color replyBackground: "#d7dadd"
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color mainMenuBackground: grey1
property color secondaryMenuBackground: grey2
property color tabButtonBg: translucentBlue
WIP SAVEPOINT
2020-08-25 09:00:03 +00:00
property color buttonForegroundColor: blue
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color buttonBackgroundColor: translucentBlue
property color buttonBackgroundColorHover: "#334360df"
fix: make chatMessages new message box clearer
2020-09-28 14:21:40 +00:00
property color buttonSecondaryColor: darkGrey
property color buttonDisabledForegroundColor: buttonSecondaryColor
WIP SAVEPOINT
2020-08-25 09:00:03 +00:00
property color buttonDisabledBackgroundColor: grey
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color buttonWarnBackgroundColor: "#1aff2d55"
fix: fix a lot of issues relative to dark theme Fixes #1997
2021-03-16 19:19:48 +00:00
property color buttonOutlineHoveredWarnBackgroundColor: "#1affeaee"
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color buttonHoveredWarnBackgroundColor: "#33ff2d55"
fix(StatusRoundButton): enable and correct hover on component The `StatusRoundButton` was missing the `hoverEnabled` flag, causing it to not turn the cursor into a pointer when the component is hovered. It's also not rendering the proper hover color. This commit fixes that to improve usability and look & feel.
2021-01-27 08:32:18 +00:00
property color buttonHoveredBackgroundColor: blue
WIP SAVEPOINT
2020-08-25 11:15:18 +00:00
feat: introduce new StatusContextMenuButton component We've been implementing such a button in various ways throughout the application. Sometimes using SVG icons and rectangles, sometimes highjacking `StyledText` components (which was clever though). Obviously this resulted in inconsistencies, so this commit introduces a new dedicated component to render the three-dots button for context menus.
2021-03-17 09:16:30 +00:00
property color contextMenuButtonForegroundColor: black
property color contextMenuButtonBackgroundHoverColor: Qt.hsla(black.hslHue, black.hslSaturation, black.hslLightness, 0.1)
feat(Chat): add pinned messages feature
2021-05-25 19:34:46 +00:00
property color pinnedMessageBorder: "#FE8F59"
property color pinnedMessageBackground: "#1aFF9F0F"
property color pinnedMessageBackgroundHovered: "#33FF9F0F"
fixes
2021-05-25 19:38:18 +00:00
property color pinnedRectangleBackground: "#1aFE8F59"
feat(Chat): add pinned messages feature
2021-05-25 19:34:46 +00:00
WIP SAVEPOINT
2020-08-25 11:15:18 +00:00
property color roundedButtonForegroundColor: buttonForegroundColor
WIP SAVEPOINT
2020-08-25 09:00:03 +00:00
property color roundedButtonBackgroundColor: secondaryBackground
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color roundedButtonSecondaryForegroundColor: grey2
WIP SAVEPOINT
2020-08-25 11:15:18 +00:00
property color roundedButtonSecondaryBackgroundColor: buttonForegroundColor
property color roundedButtonSecondaryHoveredBackgroundColor: darkAccentBlue
property color roundedButtonDisabledForegroundColor: buttonDisabledForegroundColor
property color roundedButtonDisabledBackgroundColor: buttonDisabledBackgroundColor
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
property color roundedButtonSecondaryDisabledForegroundColor: grey2
WIP SAVEPOINT
2020-08-25 11:15:18 +00:00
property color roundedButtonSecondaryDisabledBackgroundColor: buttonDisabledForegroundColor
uiux(StatusTooltip): change color according to theme It was requested to change the tooltip to black an white and white on black in dark and light themes respectively. This commit changes the colors accordingly.
2021-01-19 15:26:34 +00:00
property color tooltipBackgroundColor: black
property color tooltipForegroundColor: white
fix(StatusChatInfoButton): use correct hover color in darkmode
2021-04-13 15:42:43 +00:00
property color chatInfoButtonBackgroundHoverColor: grey1
fix: fix a lot of issues relative to dark theme Fixes #1997
2021-03-16 19:19:48 +00:00
property var accountColors: [
feat: implement new dark theme colors for menu and more Fixes #2094
2021-03-26 17:57:30 +00:00
blue,
fix: fix a lot of issues relative to dark theme Fixes #1997
2021-03-16 19:19:48 +00:00
"#9B832F",
"#D37EF4",
"#1D806F",
"#FA6565",
"#7CDA00",
"#887Af9",
"#8B3131"
]
feat: change Theme to Style to enable changing Theme
2020-07-02 15:14:31 +00:00
}