Merge pull request #99 from mendix/develop

Merge develop into release
mendix · Oct 21, 2020 · a46816e · a46816e
2 parents 64b249f + 1462f73
commit a46816e
Show file tree

Hide file tree

Showing 22 changed files with 543 additions and 321 deletions.
diff --git a/index-rtl.html b/index-rtl.html
@@ -9,7 +9,9 @@
 
         {{themecss}}
         {{appicons}}
-
+        {{manifest}}
+        {{startupimages}}
+
     </head>
     <body dir="rtl">
         <div id="content"></div>

diff --git a/index.html b/index.html
@@ -9,9 +9,8 @@
 
         {{themecss}}
         {{appicons}}
-
-        <!-- STARTUP IMAGES -->
-        <!-- <link href="resources/ios/startup/apple-touch-startup-image-1496x2048.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image"> -->
+        {{manifest}}
+        {{startupimages}}
 
     </head>
     <body dir="ltr">

diff --git a/login-with-sso.html b/login-with-sso.html
@@ -8,6 +8,9 @@
         <meta name="apple-mobile-web-app-capable" content="yes" />
 
         {{themecss}}
+        {{appicons}}
+        {{manifest}}
+        {{startupimages}}
 
     </head>
 

diff --git a/login.html b/login.html
@@ -8,6 +8,10 @@
         <meta name="apple-mobile-web-app-capable" content="yes" />
 
         {{themecss}}
+        {{appicons}}
+        {{manifest}}
+        {{startupimages}}
+
     </head>
 
     <body>

diff --git a/manifest-overrides.webmanifest b/manifest-overrides.webmanifest
@@ -0,0 +1,3 @@
+{
+    "background_color": "#FFFFFF"
+}
diff --git a/package.json b/package.json
@@ -23,4 +23,4 @@
         "react-native-device-info": "^5.5.3"
     },
     "dependencies": {}
-}
+}
diff --git a/styles/native/js/app/custom-variables.js b/styles/native/js/app/custom-variables.js
@@ -152,10 +152,11 @@ export const input = {
     labelColorDisabled: font.labelColorDisabled,
     borderColor: contrast.lower,
     backgroundColor: background.primary,
-    backgroundColorDisabled: background.secondary,
+    backgroundColorDisabled: contrast.lowest,
     selectionColor: contrast.lower,
     placeholderTextColor: contrast.regular,
     underlineColorAndroid: "transparent",
+    inputContainerUnderlayColor: `rgba(${anyColorToRgbString(contrast.low)},0.4)`,
     // Sizes
     fontSize: font.size,
     fontFamily: font.family,
@@ -201,6 +202,34 @@ export const navigation = {
     },
 };
 //
+// Badge Styles
+export const badge = {
+    fontWeight: font.weightBold,
+    borderRadius: 30,
+    paddingVertical: 3,
+    paddingHorizontal: spacing.smaller,
+    default: {
+        color: contrast.higher,
+        backgroundColor: contrast.lower,
+    },
+    primary: {
+        color: brand.primary,
+        backgroundColor: brand.primaryLight,
+    },
+    success: {
+        color: brand.success,
+        backgroundColor: brand.successLight,
+    },
+    warning: {
+        color: brand.warning,
+        backgroundColor: brand.warningLight,
+    },
+    danger: {
+        color: brand.danger,
+        backgroundColor: brand.dangerLight,
+    },
+};
+//
 // Tabcontainer Styles
 export const tabContainer = {
     tabBar: {
@@ -221,6 +250,18 @@ export const tabContainer = {
         fontWeight: font.weightBold,
         textTransform: "uppercase",
     },
+    badgeContainer: {
+        borderRadius: badge.borderRadius,
+        backgroundColor: badge.default.backgroundColor,
+        paddingVertical: badge.paddingVertical,
+        paddingHorizontal: badge.paddingHorizontal,
+        marginLeft: 8
+    },
+    badgeCaption: {
+        fontSize: font.size,
+        color: badge.default.color,
+        fontWeight: badge.fontWeight,
+    }
 };
 //
 // ListView Styles
@@ -235,34 +276,3 @@ export const listView = {
 export const layoutGrid = {
     gutterSize: 15,
 };
-//
-//
-//== Pluggable Widgets
-//-------------------------------------------------------------------------------------------------------------------//
-// Badge Styles
-export const badge = {
-    fontWeight: font.weightBold,
-    borderRadius: 30,
-    paddingVertical: 3,
-    paddingHorizontal: spacing.smaller,
-    default: {
-        color: contrast.higher,
-        backgroundColor: contrast.lower,
-    },
-    primary: {
-        color: brand.primary,
-        backgroundColor: brand.primaryLight,
-    },
-    success: {
-        color: brand.success,
-        backgroundColor: brand.successLight,
-    },
-    warning: {
-        color: brand.warning,
-        backgroundColor: brand.warningLight,
-    },
-    danger: {
-        color: brand.danger,
-        backgroundColor: brand.dangerLight,
-    },
-};
diff --git a/styles/native/js/core/variables.js b/styles/native/js/core/variables.js
@@ -156,6 +156,7 @@ let input = {
     selectionColor: contrast.lower,
     placeholderTextColor: contrast.regular,
     underlineColorAndroid: "transparent",
+    inputContainerUnderlayColor: `rgba(${anyColorToRgbString(contrast.low)},0.4)`,
     // Sizes
     fontSize: font.size,
     fontFamily: font.family,
@@ -203,6 +204,35 @@ let navigation = {
 };
 navigation = merge(navigation, custom.navigation || {});
 //
+// Badge Styles
+let badge = {
+    fontWeight: font.weightBold,
+    borderRadius: 30,
+    paddingVertical: 3,
+    paddingHorizontal: spacing.smaller,
+    default: {
+        color: contrast.higher,
+        backgroundColor: contrast.lower,
+    },
+    primary: {
+        color: brand.primary,
+        backgroundColor: brand.primaryLight,
+    },
+    success: {
+        color: brand.success,
+        backgroundColor: brand.successLight,
+    },
+    warning: {
+        color: brand.warning,
+        backgroundColor: brand.warningLight,
+    },
+    danger: {
+        color: brand.danger,
+        backgroundColor: brand.dangerLight,
+    },
+};
+badge = merge(badge, custom.badge || {});
+//
 // Tabcontainer Styles
 let tabContainer = {
     tabBar: {
@@ -223,6 +253,18 @@ let tabContainer = {
         fontWeight: font.weightBold,
         textTransform: "uppercase",
     },
+    badgeContainer: {
+        borderRadius: badge.borderRadius,
+        backgroundColor: badge.default.backgroundColor,
+        paddingVertical: badge.paddingVertical,
+        paddingHorizontal: badge.paddingHorizontal,
+        marginLeft: 8
+    },
+    badgeCaption: {
+        fontSize: font.size,
+        color: badge.default.color,
+        fontWeight: badge.fontWeight,
+    }
 };
 tabContainer = merge(tabContainer, custom.tabContainer || {});
 //
@@ -241,35 +283,4 @@ let layoutGrid = {
 };
 layoutGrid = merge(layoutGrid, custom.layoutGrid || {});
 //
-//## Pluggable Widgets
-//-------------------------------------------------------------------------------------------------------------------//
-// Badge Styles
-let badge = {
-    fontWeight: font.weightBold,
-    borderRadius: 30,
-    paddingVertical: 3,
-    paddingHorizontal: spacing.smaller,
-    default: {
-        color: contrast.higher,
-        backgroundColor: contrast.lower,
-    },
-    primary: {
-        color: brand.primary,
-        backgroundColor: brand.primaryLight,
-    },
-    success: {
-        color: brand.success,
-        backgroundColor: brand.successLight,
-    },
-    warning: {
-        color: brand.warning,
-        backgroundColor: brand.warningLight,
-    },
-    danger: {
-        color: brand.danger,
-        backgroundColor: brand.dangerLight,
-    },
-};
-badge = merge(badge, custom.badge || {});
-//
 export { brand, background, border, contrast, font, spacing, button, input, navigation, tabContainer, listView, layoutGrid, badge, };
diff --git a/styles/native/js/core/widgets/dropdown.js b/styles/native/js/core/widgets/dropdown.js
@@ -52,7 +52,7 @@ export const DropDown = {
     },
     /*  New dropdown styles start */
     valueContainer: {
-    // All ViewStyle properties & rippleColor are allowed
+    // All ViewStyle properties & rippleColor & activeOpacity & underlayColor are allowed
     },
     valueContainerDisabled: {
     // All ViewStyle properties are allowed
@@ -64,13 +64,15 @@ export const DropDown = {
         shadowOpacity: 0.2,
         shadowRadius: 10,
         elevation: 16,
+        backgroundColor: input.backgroundColor,
     },
     itemContainer: {
-        // All ViewStyle properties are allowed
+        // All ViewStyle properties & rippleColor & activeOpacity & underlayColor are allowed
         maxWidth: 500,
         paddingVertical: 6,
         paddingHorizontal: 16,
         backgroundColor: input.backgroundColor,
+        underlayColor: input.inputContainerUnderlayColor,
     },
     item: {
         // All TextStlye properties are allowed