diff --git a/scripts/certificatewizard/common/src/main/css/theme.css b/scripts/certificatewizard/common/src/main/css/theme.css index 083702e591a..386b073889e 100644 --- a/scripts/certificatewizard/common/src/main/css/theme.css +++ b/scripts/certificatewizard/common/src/main/css/theme.css @@ -1,18 +1,49 @@ +/* + * Copyright (c) 2026, Codename One and/or its affiliates. All rights reserved. + * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER. + * This code is free software; you can redistribute it and/or modify it + * under the terms of the GNU General Public License version 2 only, as + * published by the Free Software Foundation. Codename One designates this + * particular file as subject to the "Classpath" exception as provided + * by Oracle in the LICENSE file that accompanied this code. + * + * This code 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 General Public License + * version 2 for more details (a copy is included in the LICENSE file that + * accompanied this code). + * + * You should have received a copy of the GNU General Public License version + * 2 along with this work; if not, write to the Free Software Foundation, + * Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA. + * + * Please contact Codename One through http://www.codenameone.com/ if you + * need additional information or have any questions. + */ /* * Certificate Wizard theme adapted from the iOS Signing mock design. * CN1 CSS uses UIIDs, not web selectors; sizes are density-independent mm. */ +#Constants { + /* A desktop tool wants a scrollbar that stays where you can grab it, not one + that fades out the moment scrolling stops. */ + fadeScrollBarBool: false; + /* Size the check box in millimetres instead of letting it inherit the label + font height, which made it smaller than the word next to it. */ + checkBoxIconSizeMM: "3.6"; +} + Form, CWForm { background-color: #F3F4F7; color: #112247; font-family: "native:MainRegular"; - font-size: 2.75mm; + font-size: 2.9mm; } Label, Button, TextField, TextArea, CheckBox { color: #112247; font-family: "native:MainRegular"; - font-size: 2.75mm; + font-size: 2.9mm; } CWChrome { background-color: #FFFFFF; @@ -40,7 +71,7 @@ CWStatus { padding: 1.0mm 2.5mm 1.0mm 2.5mm; margin: 0.3mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; } CWStatusOff { background: cn1-pill-border; @@ -49,7 +80,7 @@ CWStatusOff { padding: 1.0mm 2.5mm 1.0mm 2.5mm; margin: 0.3mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; } CWToolbarButton { background-color: #FFFFFF; @@ -67,7 +98,7 @@ CWToolbarActions { CWEmail { background-color: transparent; color: #7F8AA3; - font-size: 2.45mm; + font-size: 2.6mm; padding: 1mm; } CWBody { @@ -82,7 +113,7 @@ CWNavLabel { background-color: transparent; color: #A0A8BA; font-family: "native:MainBold"; - font-size: 2.1mm; + font-size: 2.3mm; padding: 2.2mm 1.4mm 0.8mm 1.4mm; } CWNav { @@ -91,7 +122,7 @@ CWNav { padding: 1.7mm 1.8mm 1.7mm 1.8mm; margin: 0.25mm 0 0.25mm 0; border-radius: 1.6mm; - font-size: 2.65mm; + font-size: 2.8mm; } CWNavSelected { background-color: #E8F0FF; @@ -100,7 +131,7 @@ CWNavSelected { margin: 0.25mm 0 0.25mm 0; border-radius: 1.6mm; font-family: "native:MainBold"; - font-size: 2.65mm; + font-size: 2.8mm; } CWPage { background-color: #F3F4F7; @@ -116,7 +147,7 @@ CWPageTitle { CWSub { background-color: transparent; color: #7F8AA3; - font-size: 2.55mm; + font-size: 2.7mm; padding: 0 0 2.2mm 0; } CWCard { @@ -136,7 +167,7 @@ CWCardTitle { CWCardMeta { background-color: transparent; color: #7F8AA3; - font-size: 2.35mm; + font-size: 2.55mm; padding: 0.2mm 0 0.2mm 0; } CWCardRow { @@ -161,7 +192,7 @@ CWMetricNumber { CWMetricLabel { background-color: transparent; color: #7F8AA3; - font-size: 2.35mm; + font-size: 2.55mm; padding: 0.4mm 0 0 0; } CWActionRow { @@ -177,11 +208,11 @@ CWActionGrid { CWPrimary { background: cn1-pill-border; background-color: #B8D532; - color: #FFFFFF; + color: #16220A; padding: 1.35mm 3.1mm 1.35mm 3.1mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; border-radius: 3.2mm; text-align: center; } @@ -192,7 +223,7 @@ CWAccent { padding: 1.35mm 3.1mm 1.35mm 3.1mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; border-radius: 3.2mm; text-align: center; } @@ -205,7 +236,7 @@ CWOutline { padding: 1.25mm 2.8mm 1.25mm 2.8mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } CWDanger { @@ -217,7 +248,7 @@ CWDanger { padding: 1.25mm 2.8mm 1.25mm 2.8mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } CWDisabled { @@ -229,7 +260,7 @@ CWDisabled { padding: 1.35mm 3.1mm 1.35mm 3.1mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } CWField { @@ -244,12 +275,12 @@ CWFieldHint { background-color: transparent; color: #A0A8BA; padding: 1.4mm; - font-size: 2.75mm; + font-size: 2.9mm; } CWFieldLabel { background-color: transparent; color: #7F8AA3; - font-size: 2.35mm; + font-size: 2.55mm; padding: 0.7mm 0 0.4mm 0; } CWFilterRow { @@ -269,7 +300,7 @@ CWFilterField { border: none; padding: 1.1mm 1.4mm 1.1mm 1.4mm; margin: 0; - font-size: 2.45mm; + font-size: 2.6mm; } CWFilterClear { background-color: transparent; @@ -286,7 +317,7 @@ CWTableHeader { background-color: transparent; color: #7F8AA3; font-family: "native:MainBold"; - font-size: 2.1mm; + font-size: 2.3mm; padding: 1.0mm 1.2mm 1.2mm 1.2mm; } CWRow { @@ -302,12 +333,12 @@ CWCellMain { background-color: transparent; color: #112247; font-family: "native:MainBold"; - font-size: 2.65mm; + font-size: 2.8mm; } CWCellSub { background-color: transparent; color: #7F8AA3; - font-size: 2.25mm; + font-size: 2.45mm; } CWPillOk { background-color: #E7F4EC; @@ -315,7 +346,7 @@ CWPillOk { padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } CWPillWarn { background-color: #FDF1DC; @@ -323,7 +354,7 @@ CWPillWarn { padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } CWPillBad { background-color: #FBE9E9; @@ -331,7 +362,7 @@ CWPillBad { padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } CWPillMuted { background-color: #F7F8FB; @@ -339,7 +370,7 @@ CWPillMuted { padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } CWBanner { background-color: #E8F0FF; @@ -386,7 +417,7 @@ CWChoice { border-radius: 1.8mm; padding: 1.8mm; margin: 0.7mm 0 0.7mm 0; - font-size: 2.55mm; + font-size: 2.7mm; } CWChoiceSelected { background-color: #E8F0FF; @@ -395,7 +426,7 @@ CWChoiceSelected { border-radius: 1.8mm; padding: 1.8mm; margin: 0.7mm 0 0.7mm 0; - font-size: 2.55mm; + font-size: 2.7mm; } CWSegment { background: cn1-pill-border; @@ -406,18 +437,19 @@ CWSegment { padding: 1.15mm 2.4mm 1.15mm 2.4mm; margin: 0.25mm; font-family: "native:MainBold"; - font-size: 2.35mm; + font-size: 2.55mm; text-align: center; } CWSegmentSelected { background: cn1-pill-border; background-color: #2F6BFF; color: #FFFFFF; + border: 0.25mm solid #2F6BFF; border-radius: 3.2mm; padding: 1.15mm 2.4mm 1.15mm 2.4mm; margin: 0.25mm; font-family: "native:MainBold"; - font-size: 2.35mm; + font-size: 2.55mm; text-align: center; } @@ -429,62 +461,62 @@ CWDarkToggle { padding: 1.0mm 2.0mm 1.0mm 2.0mm; margin: 0.3mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } DarkForm, DarkCWForm { - background-color: #071B4D; - color: #F5F8FF; + background-color: #0F1626; + color: #EEF2F8; font-family: "native:MainRegular"; - font-size: 2.75mm; + font-size: 2.9mm; } DarkLabel, DarkButton, DarkTextField, DarkTextArea, DarkCheckBox { - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainRegular"; - font-size: 2.75mm; + font-size: 2.9mm; } DarkCWChrome { - background-color: #102B66; - border-bottom: 0.25mm solid #33518C; + background-color: #1A2233; + border-bottom: 0.25mm solid #3A465E; padding: 1.5mm 2.8mm 1.5mm 2.8mm; } DarkCWTitle { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; font-size: 3.0mm; padding: 0.6mm 1.5mm 0.6mm 1.5mm; } DarkCWLogo { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; font-size: 3.1mm; padding: 0.8mm 1mm 0.8mm 0; } DarkCWStatus { background: cn1-pill-border; - background-color: #143B66; - color: #5FD08A; + background-color: #1F3329; + color: #6FDC9A; padding: 1.0mm 2.5mm 1.0mm 2.5mm; margin: 0.3mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; } DarkCWStatusOff { background: cn1-pill-border; - background-color: #173A7A; - color: #A8B8DA; + background-color: #26314A; + color: #A9B6CC; padding: 1.0mm 2.5mm 1.0mm 2.5mm; margin: 0.3mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; } DarkCWToolbarButton { - background-color: #102B66; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #1A2233; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 1.6mm; padding: 1.2mm; margin: 0.45mm; @@ -496,102 +528,102 @@ DarkCWToolbarActions { } DarkCWEmail { background-color: transparent; - color: #A8B8DA; - font-size: 2.45mm; + color: #A9B6CC; + font-size: 2.6mm; padding: 1mm; } DarkCWBody { - background-color: #071B4D; + background-color: #0F1626; } DarkCWSidebar { - background-color: #102B66; - border-right: 0.25mm solid #33518C; + background-color: #1A2233; + border-right: 0.25mm solid #3A465E; padding: 2.0mm 1.5mm 2.0mm 1.5mm; } DarkCWNavLabel { background-color: transparent; - color: #7E93BC; + color: #8B98AE; font-family: "native:MainBold"; - font-size: 2.1mm; + font-size: 2.3mm; padding: 2.2mm 1.4mm 0.8mm 1.4mm; } DarkCWNav { - background-color: #102B66; - color: #A8B8DA; + background-color: #1A2233; + color: #A9B6CC; padding: 1.7mm 1.8mm 1.7mm 1.8mm; margin: 0.25mm 0 0.25mm 0; border-radius: 1.6mm; - font-size: 2.65mm; + font-size: 2.8mm; } DarkCWNavSelected { - background-color: #173A7A; - color: #4D86FF; + background-color: #26314A; + color: #5C93FF; padding: 1.7mm 1.8mm 1.7mm 1.8mm; margin: 0.25mm 0 0.25mm 0; border-radius: 1.6mm; font-family: "native:MainBold"; - font-size: 2.65mm; + font-size: 2.8mm; } DarkCWPage { - background-color: #071B4D; + background-color: #0F1626; padding: 4.0mm 5.0mm 6.0mm 5.0mm; } DarkCWPageTitle { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; font-size: 4.5mm; padding: 0 0 0.5mm 0; } DarkCWSub { background-color: transparent; - color: #A8B8DA; - font-size: 2.55mm; + color: #A9B6CC; + font-size: 2.7mm; padding: 0 0 2.2mm 0; } DarkCWCard { - background-color: #102B66; - border: 0.25mm solid #33518C; + background-color: #1A2233; + border: 0.25mm solid #3A465E; border-radius: 1.8mm; padding: 2.4mm; margin: 1.0mm 0 1.4mm 0; } DarkCWCardTitle { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; font-size: 2.8mm; padding: 0.5mm 0 0.4mm 0; } DarkCWCardMeta { background-color: transparent; - color: #A8B8DA; - font-size: 2.35mm; + color: #A9B6CC; + font-size: 2.55mm; padding: 0.2mm 0 0.2mm 0; } DarkCWCardRow { - background-color: #102B66; - border-top: 0.25mm solid #33518C; + background-color: #1A2233; + border-top: 0.25mm solid #3A465E; padding: 1.0mm 0 1.0mm 0; margin: 0; } DarkCWMetric { - background-color: #102B66; - border: 0.25mm solid #33518C; + background-color: #1A2233; + border: 0.25mm solid #3A465E; border-radius: 1.8mm; padding: 2.5mm; margin: 0.8mm; } DarkCWMetricNumber { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; font-size: 5.2mm; } DarkCWMetricLabel { background-color: transparent; - color: #A8B8DA; - font-size: 2.35mm; + color: #A9B6CC; + font-size: 2.55mm; padding: 0.4mm 0 0 0; } DarkCWActionRow { @@ -607,79 +639,79 @@ DarkCWActionGrid { DarkCWPrimary { background: cn1-pill-border; background-color: #B8D532; - color: #FFFFFF; + color: #16220A; padding: 1.35mm 3.1mm 1.35mm 3.1mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; border-radius: 3.2mm; text-align: center; } DarkCWAccent { background: cn1-pill-border; - background-color: #4D86FF; + background-color: #5C93FF; color: #FFFFFF; padding: 1.35mm 3.1mm 1.35mm 3.1mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; border-radius: 3.2mm; text-align: center; } DarkCWOutline { background: cn1-pill-border; - background-color: #102B66; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #1A2233; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 3.2mm; padding: 1.25mm 2.8mm 1.25mm 2.8mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } DarkCWDanger { background: cn1-pill-border; - background-color: #102B66; + background-color: #1A2233; color: #FF7A7A; - border: 0.25mm solid #33518C; + border: 0.25mm solid #3A465E; border-radius: 3.2mm; padding: 1.25mm 2.8mm 1.25mm 2.8mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } DarkCWDisabled { background: cn1-pill-border; - background-color: #163575; - color: #7890C0; - border: 0.25mm solid #33518C; + background-color: #26314A; + color: #8B98AE; + border: 0.25mm solid #3A465E; border-radius: 3.2mm; padding: 1.35mm 3.1mm 1.35mm 3.1mm; margin: 0.4mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } DarkCWField { - background-color: #0E2A61; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #141B2B; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 1.4mm; padding: 1.4mm; margin: 0.5mm 0 1.2mm 0; } DarkCWFieldHint { background-color: transparent; - color: #A8B8DA; + color: #A9B6CC; padding: 1.4mm; - font-size: 2.75mm; + font-size: 2.9mm; } DarkCWFieldLabel { background-color: transparent; - color: #A8B8DA; - font-size: 2.35mm; + color: #A9B6CC; + font-size: 2.55mm; padding: 0.7mm 0 0.4mm 0; } DarkCWFilterRow { @@ -687,23 +719,23 @@ DarkCWFilterRow { padding: 0 0 1.2mm 0; } DarkCWFilterWrap { - background-color: #0E2A61; - border: 0.25mm solid #33518C; + background-color: #141B2B; + border: 0.25mm solid #3A465E; border-radius: 1.4mm; padding: 0; margin: 0.4mm 0.8mm 0.4mm 0; } DarkCWFilterField { - background-color: #0E2A61; - color: #F5F8FF; + background-color: #141B2B; + color: #EEF2F8; border: none; padding: 1.1mm 1.4mm 1.1mm 1.4mm; margin: 0; - font-size: 2.45mm; + font-size: 2.6mm; } DarkCWFilterClear { background-color: transparent; - color: #A8B8DA; + color: #A9B6CC; padding: 1.0mm; margin: 0; } @@ -714,14 +746,14 @@ DarkCWTableBody { } DarkCWTableHeader { background-color: transparent; - color: #A8B8DA; + color: #A9B6CC; font-family: "native:MainBold"; - font-size: 2.1mm; + font-size: 2.3mm; padding: 1.0mm 1.2mm 1.2mm 1.2mm; } DarkCWRow { - background-color: #102B66; - border-top: 0.25mm solid #33518C; + background-color: #1A2233; + border-top: 0.25mm solid #3A465E; padding: 1.5mm 1.2mm 1.5mm 1.2mm; } DarkCWTableCell { @@ -730,65 +762,65 @@ DarkCWTableCell { } DarkCWCellMain { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; - font-size: 2.65mm; + font-size: 2.8mm; } DarkCWCellSub { background-color: transparent; - color: #A8B8DA; - font-size: 2.25mm; + color: #A9B6CC; + font-size: 2.45mm; } DarkCWPillOk { - background-color: #143B66; - color: #5FD08A; + background-color: #1F3329; + color: #6FDC9A; padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } DarkCWPillWarn { - background-color: #173A7A; - color: #A8B8DA; + background-color: #3A2E14; + color: #E8B15A; padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } DarkCWPillBad { - background-color: #3A2442; - color: #FF7A7A; + background-color: #3A2024; + color: #FF8A8A; padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } DarkCWPillMuted { - background-color: #163575; - color: #A8B8DA; + background-color: #26314A; + color: #A9B6CC; padding: 0.8mm 1.9mm 0.8mm 1.9mm; border-radius: 1.4mm; font-family: "native:MainBold"; - font-size: 2.2mm; + font-size: 2.4mm; } DarkCWBanner { - background-color: #173A7A; - color: #F5F8FF; + background-color: #26314A; + color: #EEF2F8; border-radius: 1.8mm; padding: 2.0mm; margin: 0 0 2.2mm 0; } DarkCWBannerWarn { - background-color: #34355E; - color: #E0A94E; - border: 0.25mm solid #735F38; + background-color: #3A2E14; + color: #E8B15A; + border: 0.25mm solid #5C4820; border-radius: 1.8mm; padding: 2.0mm; margin: 0 0 2.2mm 0; } DarkCWModal { - background-color: #102B66; - border: 0.25mm solid #33518C; + background-color: #1A2233; + border: 0.25mm solid #3A465E; border-radius: 2.2mm; padding: 2.6mm; } @@ -799,7 +831,7 @@ DarkCWDialogContent { } DarkCWModalTitle { background-color: transparent; - color: #F5F8FF; + color: #EEF2F8; font-family: "native:MainBold"; font-size: 3.4mm; padding: 0 0 1.4mm 0; @@ -810,54 +842,155 @@ DarkCWDialogActions { margin: 1.0mm 0 0 0; } DarkCWChoice { - background-color: #102B66; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #1A2233; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 1.8mm; padding: 1.8mm; margin: 0.7mm 0 0.7mm 0; - font-size: 2.55mm; + font-size: 2.7mm; } DarkCWChoiceSelected { - background-color: #173A7A; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #26314A; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 1.8mm; padding: 1.8mm; margin: 0.7mm 0 0.7mm 0; - font-size: 2.55mm; + font-size: 2.7mm; } DarkCWSegment { background: cn1-pill-border; - background-color: #102B66; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #1A2233; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 3.2mm; padding: 1.15mm 2.4mm 1.15mm 2.4mm; margin: 0.25mm; font-family: "native:MainBold"; - font-size: 2.35mm; + font-size: 2.55mm; text-align: center; } DarkCWSegmentSelected { background: cn1-pill-border; - background-color: #4D86FF; + background-color: #5C93FF; color: #FFFFFF; + border: 0.25mm solid #5C93FF; border-radius: 3.2mm; padding: 1.15mm 2.4mm 1.15mm 2.4mm; margin: 0.25mm; font-family: "native:MainBold"; - font-size: 2.35mm; + font-size: 2.55mm; text-align: center; } DarkCWDarkToggle { - background-color: #102B66; - color: #F5F8FF; - border: 0.25mm solid #33518C; + background-color: #1A2233; + color: #EEF2F8; + border: 0.25mm solid #3A465E; border-radius: 1.6mm; padding: 1.0mm 2.0mm 1.0mm 2.0mm; margin: 0.3mm; font-family: "native:MainBold"; - font-size: 2.45mm; + font-size: 2.6mm; text-align: center; } + +/* Components whose UIID the look and feel fixes by name. + * + * Everything above comes in a light UIID and a "Dark" twin the app swaps + * between, because the app owns those UIIDs. These it does not: the look and + * feel asks the theme for "Scroll"/"ScrollThumb" (and "DesktopScroll"/ + * "DesktopScrollThumb" once the port turns on interactive scrollbars) and for + * "CheckBox" by those exact names, so a Dark twin would never be looked up. + * Their dark values live in the prefers-color-scheme block at the end of this + * file, which the CSS compiler emits as $Dark entries -- the form the + * runtime consults when CN.isDarkMode() is true. + * + * With no rule at all they were drawn from the blank-theme defaults: a WHITE + * track with a BLACK thumb. On a dark page that reads as an inverted bar whose + * empty part looks like the thumb, which is issue #5636. + */ +/* The track's padding is what SIZES the bar: getVerticalScrollWidth sums the left + and right, getHorizontalScrollHeight the top and bottom. One shared rule cannot + serve both -- giving the horizontal track the vertical one's padding left it + zero pixels high, present but impossible to grab. */ +Scroll, DesktopScroll { + background-color: transparent; + padding: 0 0.9mm 0 0.9mm; + margin: 0; +} +HorizontalScroll, DesktopHorizontalScroll { + background-color: transparent; + padding: 0.9mm 0 0.9mm 0; + margin: 0; +} +ScrollThumb, HorizontalScrollThumb, DesktopScrollThumb, DesktopHorizontalScrollThumb { + background-color: #AEB7C7; + cn1-background-type: cn1-round-border; + padding: 0; + margin: 0; +} +DesktopScrollThumb.selected, DesktopHorizontalScrollThumb.selected { + background-color: #8791A6; + cn1-background-type: cn1-round-border; + padding: 0; + margin: 0; +} +DesktopScrollThumb.pressed, DesktopHorizontalScrollThumb.pressed { + background-color: #2F6BFF; + cn1-background-type: cn1-round-border; + padding: 0; + margin: 0; +} +/* The check box glyph is built from the CheckBox style, never from the UIID the + * component carries, so these colours are the box and not the label. Unchecked + * is a grey outline and checked is the accent fill: at the label's own font + * height the two were the same small square in the same colour, which is why a + * list of unchecked devices looked like a list of checked ones. */ +CheckBox { + color: #8791A6; + background-color: transparent; +} +CheckBox.selected { + color: #2F6BFF; + background-color: transparent; +} + +@media (prefers-color-scheme: dark) { + Scroll, DesktopScroll { + background-color: transparent; + padding: 0 0.9mm 0 0.9mm; + margin: 0; + } + HorizontalScroll, DesktopHorizontalScroll { + background-color: transparent; + padding: 0.9mm 0 0.9mm 0; + margin: 0; + } + ScrollThumb, HorizontalScrollThumb, DesktopScrollThumb, DesktopHorizontalScrollThumb { + background-color: #4E5A72; + cn1-background-type: cn1-round-border; + padding: 0; + margin: 0; + } + DesktopScrollThumb.selected, DesktopHorizontalScrollThumb.selected { + background-color: #6E7C97; + cn1-background-type: cn1-round-border; + padding: 0; + margin: 0; + } + DesktopScrollThumb.pressed, DesktopHorizontalScrollThumb.pressed { + background-color: #5C93FF; + cn1-background-type: cn1-round-border; + padding: 0; + margin: 0; + } + CheckBox { + color: #8B98AE; + background-color: transparent; + } + CheckBox.selected { + color: #5C93FF; + background-color: transparent; + } +} diff --git a/scripts/certificatewizard/common/src/main/java/com/codename1/certificatewizard/CertificateWizard.java b/scripts/certificatewizard/common/src/main/java/com/codename1/certificatewizard/CertificateWizard.java index 2bdeb3e2880..fef030382c0 100644 --- a/scripts/certificatewizard/common/src/main/java/com/codename1/certificatewizard/CertificateWizard.java +++ b/scripts/certificatewizard/common/src/main/java/com/codename1/certificatewizard/CertificateWizard.java @@ -141,6 +141,7 @@ public void runApp() { darkMode = Preferences.get(PREF_DARK_MODE, Boolean.TRUE.equals(CN.isDarkMode())); fontDeltaPx = Preferences.get(PREF_FONT_DELTA, 0); CN.setDarkMode(Boolean.valueOf(darkMode)); + applyThemeForCurrentScheme(); binding = ProjectIO.loadBinding(); userEmail = firstNonEmpty(System.getProperty("certificatewizard.user"), binding == null ? null : binding.user(), "Not signed in"); @@ -188,6 +189,29 @@ protected void pinchReleased(int x, int y) { reload(); } + /// Refreshes the theme once the dark flag is known, and on the desktop restores the scrollbar + /// the generated stub already asks for. + /// + /// The stub calls JavaSEPort.setDesktopInteractiveScrollbars(true), and the port injects + /// @interactiveScrollBool into the NATIVE theme. This app's theme is a CSS theme that does not + /// layer the native one, so installing it replaced the whole property table and took that + /// constant with it -- the look and feel then fell back to the thin mobile overlay bar you + /// cannot grab, on a desktop tool whose lists are long enough to need one. + /// + /// The refresh has to come after CN.setDarkMode: the look and feel bakes the check box glyphs + /// from the CheckBox style at refresh time, and which of CheckBox / $DarkCheckBox that resolves + /// to is read from the dark flag right then. Refreshing earlier coloured the boxes for the + /// scheme the platform reported rather than the one the stored preference selects. + private void applyThemeForCurrentScheme() { + if (!CN.isDesktop()) { + UIManager.getInstance().refreshTheme(); + return; + } + java.util.Hashtable props = new java.util.Hashtable(); + props.put("@interactiveScrollBool", "true"); + UIManager.getInstance().addThemeProps(props); + } + private void seedCredentialState() { boolean configured = Preferences.get(PREF_CREDENTIAL_CONFIGURED, token != null && token.length() > 0); if (!configured) { @@ -974,28 +998,61 @@ private void maintenancePage() { } private void certificateDialog() { + certificateDialog("IOS_DISTRIBUTION"); + } + + /// Generates a certificate, opening on `initialType`. + /// + /// Every type [WizardDecisions#requiredCertificateType] can ask for has to be offered here, + /// or a caller sent to this dialog to satisfy that requirement cannot satisfy it. + /// MAC_APP_DEVELOPMENT was missing, which is exactly what a Mac Development profile needs. + private void certificateDialog(String initialType) { InteractionDialog d = modal("Generate certificate"); - final String[] type = {"IOS_DISTRIBUTION"}; + final String[] type = {initialType == null ? "IOS_DISTRIBUTION" : initialType}; label(d, "Certificate type", "CWFieldLabel"); - Button dist = segment("iOS Distribution", true); - Button dev = segment("iOS Development", false); - Button macStore = segment("Mac App Store", false); - Button developerId = segment("Developer ID", false); - Button installer = segment("Mac Installer", false); - Button[] typeButtons = {dist, dev, macStore, developerId, installer}; - String[] typeValues = {"IOS_DISTRIBUTION", "IOS_DEVELOPMENT", "MAC_APP_DISTRIBUTION", - "DEVELOPER_ID_APPLICATION", "MAC_INSTALLER_DISTRIBUTION"}; + String[] typeValues = WizardDecisions.GENERATABLE_CERTIFICATE_TYPES; + Button[] typeButtons = new Button[typeValues.length]; + for (int i = 0; i < typeValues.length; i++) { + typeButtons[i] = segment(WizardDecisions.GENERATABLE_CERTIFICATE_LABELS[i], false); + } + updateSegmentButtons(typeButtons, typeValues, type[0]); + final TextField name = field("Display name", "App Store Distribution"); + name.setName("field.certName"); + // The suggested name follows the type until the user writes their own. A suggestion that + // stays behind is worse than no suggestion: it puts a certificate labelled "DISTRIBUTION" + // on the account that is nothing of the kind. settingName guards against + // TextField.setText firing the listener and marking the suggestion as the user's edit. + final boolean[] nameEdited = {false}; + final boolean[] settingName = {false}; + final Runnable suggestName = () -> { + if (nameEdited[0]) { + return; + } + settingName[0] = true; + try { + name.setText(typeLabel(type[0])); + } finally { + settingName[0] = false; + } + }; + suggestName.run(); + name.addDataChangedListener((changeType, index) -> { + if (!settingName[0]) { + nameEdited[0] = true; + } + }); for (int i = 0; i < typeButtons.length; i++) { + typeButtons[i].setName("pick.certType." + typeValues[i].toLowerCase()); final int typeIndex = i; typeButtons[i].addActionListener(e -> { type[0] = typeValues[typeIndex]; updateSegmentButtons(typeButtons, typeValues, type[0]); + suggestName.run(); d.revalidate(); }); } - TextField name = field("Display name", "App Store Distribution"); - d.add(actionRow(Component.LEFT, dist, dev, macStore)); - d.add(actionRow(Component.LEFT, developerId, installer)); + d.add(actionRow(Component.LEFT, typeButtons[0], typeButtons[1], typeButtons[2])); + d.add(actionRow(Component.LEFT, typeButtons[3], typeButtons[4], typeButtons[5])); label(d, "Display name", "CWFieldLabel"); d.add(name); Button gen = primary("Generate", "modal.generateCert.submit"); @@ -1090,106 +1147,226 @@ private void apnsDialog() { } private void newProfileDialog() { - InteractionDialog d = modalFrame("New provisioning profile"); - Container content = new Container(BoxLayout.y()); + final InteractionDialog d = modalFrame("New provisioning profile"); + final Container content = new Container(BoxLayout.y()); content.setScrollableY(true); content.setUIID(uiid("CWDialogContent")); d.add(BorderLayout.CENTER, content); - final String[] profileType = {null}; + // The dialog opens with App Store selected, and now says so in the model as well as on + // the segment. It used to paint that segment selected while profileType held null, so + // "Create" stayed disabled until you clicked the segment that already looked chosen -- + // and clicking it a second time silently went back to null. That is the "no combination + // of buttons enables Create" half of issue #5636. + final String[] profileType = {PROFILE_APP_STORE}; final String[] bundleId = {null}; final String[] certificateId = {null}; - final String[] profileName = {projectDefaults().appName + " App Store"}; final List certs = new ArrayList(); final List devs = new ArrayList(); - final Button[] createRef = new Button[1]; - - Button store = segment("iOS App Store", true); - Button adhoc = segment("iOS Ad Hoc", false); - Button dev = segment("iOS Development", false); - Button macStore = segment("Mac App Store", false); - Button macDirect = segment("Mac Direct", false); - Button macDev = segment("Mac Development", false); - Button[] typeButtons = {store, adhoc, dev, macStore, macDirect, macDev}; - String[] typeValues = {"IOS_APP_STORE", "IOS_APP_ADHOC", "IOS_APP_DEVELOPMENT", - "MAC_APP_STORE", "MAC_APP_DIRECT", "MAC_APP_DEVELOPMENT"}; - label(content, "Profile type", "CWFieldLabel"); - content.add(actionRow(Component.LEFT, store, adhoc, dev)); - content.add(actionRow(Component.LEFT, macStore, macDirect, macDev)); - - label(content, "Bundle ID", "CWFieldLabel"); - List