@telus-uds/theme-koodo 7.22.0 → 7.24.0

package/build/android/Card.json

@@ -697,7 +697,7 @@
           "red": 1,
           "green": 1,
           "blue": 1,
-          "alpha": 0.2
+          "alpha": 0.4
         }
       }
     },
@@ -712,7 +712,7 @@
           "red": 1,
           "green": 1,
           "blue": 1,
-          "alpha": 0.2
+          "alpha": 0.4
         }
       }
     },
@@ -727,7 +727,7 @@
           "red": 1,
           "green": 1,
           "blue": 1,
-          "alpha": 0.2
+          "alpha": 0.4
         }
       }
     }

package/build/android/Checkbox.json

@@ -102,6 +102,8 @@
       "blue": 0.98824,
       "alpha": 1
     },
+    "iconContainerHeight": null,
+    "iconContainerWidth": null,
     "iconSize": 14,
     "inputBackgroundColor": {
       "red": 1,
@@ -117,7 +119,7 @@
     },
     "inputBorderRadius": 0,
     "inputBorderWidth": 2,
-    "inputHeight": 20,
+    "inputHeight": 24,
     "inputOutlineColor": {
       "red": 0,
       "green": 0,
@@ -127,7 +129,7 @@
     "inputOutlineOffset": 1,
     "inputOutlineWidth": 0,
     "inputShadow": null,
-    "inputWidth": 20,
+    "inputWidth": 24,
     "labelColor": {
       "red": 0,
       "green": 0,
@@ -138,6 +140,11 @@
     "labelFontSize": 16,
     "labelFontWeight": 400,
     "labelLineHeight": 1.5,
-    "labelMarginLeft": 8
+    "labelMarginLeft": 8,
+    "padding": null,
+    "paddingBottom": null,
+    "paddingLeft": null,
+    "paddingRight": null,
+    "paddingTop": null
   }
 }

package/build/android/ExpandCollapse.json

@@ -9,6 +9,7 @@
       "alpha": 0
     },
     "borderStyle": "solid",
+    "borderTopWidth": null,
     "borderWidth": 0
   }
 }

package/build/android/ExpandCollapsePanel.json

@@ -44,6 +44,7 @@
     }
   ],
   "tokens": {
+    "borderBottomWidth": null,
     "borderColor": {
       "red": 0.93725,
       "green": 0.93725,

package/build/android/IconButton.json

@@ -61,6 +61,10 @@
     "size": {
       "type": "variant",
       "values": ["small", "large"]
+    },
+    "style": {
+      "type": "variant",
+      "values": ["default", "contained", "subtle", "raised"]
     }
   },
   "rules": [
@@ -709,6 +713,533 @@
         "iconSize": 24,
         "padding": 10
       }
+    },
+    {
+      "if": {
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "selected": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderBottomWidth": 1,
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "pressed": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.2
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 0.4,
+          "green": 0.4,
+          "blue": 0.4,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "selected": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "pressed": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 0.4
+        },
+        "borderColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inactive": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.1
+        },
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.4
+        }
+      }
+    },
+    {
+      "if": {
+        "inactive": true,
+        "inverse": true,
+        "style": "contained"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 0.2
+        },
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 0.4
+        }
+      }
+    },
+    {
+      "if": {
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "selected": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderBottomWidth": 2,
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "borderWidth": null,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "pressed": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.2
+        },
+        "borderRadius": 4,
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 0.4,
+          "green": 0.4,
+          "blue": 0.4,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "selected": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderBottomWidth": 2,
+        "borderColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        },
+        "borderWidth": null,
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inverse": true,
+        "pressed": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0.78824,
+          "green": 0.78431,
+          "blue": 0.78431,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        }
+      }
+    },
+    {
+      "if": {
+        "inactive": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.1
+        },
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.4
+        }
+      }
+    },
+    {
+      "if": {
+        "inactive": true,
+        "inverse": true,
+        "style": "subtle"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "iconColor": {
+          "red": 1,
+          "green": 1,
+          "blue": 1,
+          "alpha": 0.4
+        }
+      }
+    },
+    {
+      "if": {
+        "style": "raised"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "padding": 8,
+        "shadow": {
+          "inset": false,
+          "offsetX": 0,
+          "offsetY": 2,
+          "blur": 2,
+          "spread": 0,
+          "color": {
+            "red": 0,
+            "green": 0,
+            "blue": 0,
+            "alpha": 0.2
+          }
+        }
+      }
+    },
+    {
+      "if": {
+        "selected": true,
+        "style": "raised"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0
+        },
+        "borderBottomWidth": 1,
+        "borderColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 1
+        },
+        "padding": 8,
+        "shadow": {
+          "inset": false,
+          "offsetX": 0,
+          "offsetY": 2,
+          "blur": 2,
+          "spread": 0,
+          "color": {
+            "red": 0,
+            "green": 0,
+            "blue": 0,
+            "alpha": 0.2
+          }
+        }
+      }
+    },
+    {
+      "if": {
+        "pressed": true,
+        "style": "raised"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.2
+        },
+        "borderRadius": 4,
+        "borderWidth": 1,
+        "iconColor": {
+          "red": 0.4,
+          "green": 0.4,
+          "blue": 0.4,
+          "alpha": 1
+        },
+        "padding": 8,
+        "shadow": null
+      }
+    },
+    {
+      "if": {
+        "inactive": true,
+        "style": "raised"
+      },
+      "tokens": {
+        "backgroundColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.1
+        },
+        "borderWidth": 0,
+        "iconColor": {
+          "red": 0,
+          "green": 0,
+          "blue": 0,
+          "alpha": 0.4
+        },
+        "shadow": null
+      }
     }
   ],
   "tokens": {

package/build/android/QuantitySelector.json

@@ -16,6 +16,10 @@
       "type": "variant",
       "values": [true]
     },
+    "inactive": {
+      "type": "variant",
+      "values": [true]
+    },
     "pressed": {
       "type": "variant",
       "values": [true]
@@ -44,6 +48,14 @@
         }
       }
     },
+    {
+      "if": {
+        "focus": true
+      },
+      "tokens": {
+        "inputBorderWidth": 3
+      }
+    },
     {
       "if": {
         "disabled": true
@@ -55,6 +67,7 @@
           "blue": 0.93725,
           "alpha": 1
         },
+        "inputBorderWidth": 1,
         "textColor": {
           "red": 0.78824,
           "green": 0.78431,
@@ -65,10 +78,22 @@
     },
     {
       "if": {
-        "focus": true
+        "inactive": true
       },
       "tokens": {
-        "inputBorderWidth": 3
+        "inputBackgroundColor": {
+          "red": 0.93725,
+          "green": 0.93725,
+          "blue": 0.93725,
+          "alpha": 1
+        },
+        "inputBorderWidth": 1,
+        "textColor": {
+          "red": 0.4,
+          "green": 0.4,
+          "blue": 0.4,
+          "alpha": 1
+        }
       }
     }
   ],
@@ -94,6 +119,7 @@
     "paddingLeft": 12,
     "paddingRight": 12,
     "paddingTop": 12,
+    "showTopSpace": true,
     "textColor": {
       "red": 0,
       "green": 0,