Update drawable names with consistent prefixes (#6060)
34
ui/README.md
@@ -5,8 +5,42 @@ An Android library containing common UI components, types, and utilities.
|
||||
## Contents
|
||||
|
||||
- [Compatibility](#compatibility)
|
||||
- [Theme](#theme)
|
||||
|
||||
## Compatibility
|
||||
|
||||
- **Minimum SDK**: 28
|
||||
- **Target SDK**: 35
|
||||
|
||||
## Theme
|
||||
|
||||
### Icons & Illustrations
|
||||
|
||||
#### Naming Convention
|
||||
|
||||
All drawables should be named with the appropriate prefix to identify what they are and how they are intended to be used.
|
||||
|
||||
| Prefix | Description |
|
||||
|---------|---------------|
|
||||
| `gif_` | gifs |
|
||||
| `ic_` | Icons |
|
||||
| `img_` | Raster Images |
|
||||
| `ill_` | Illustrations |
|
||||
| `logo_` | Brand Imagery |
|
||||
|
||||
#### Multi-tonal Illustrations
|
||||
|
||||
The app supports light mode, dark mode and dynamic colors. Most icons in the app will display correctly using tinting but multi-tonal icons and illustrations require extra processing in order to be displayed properly with dynamic colors.
|
||||
|
||||
All illustrations and multi-tonal icons require the svg paths to be tagged with the `name` attribute in order for each individual path to be tinted the appropriate color. Any untagged path will not be tinted and the resulting image will be incorrect.
|
||||
|
||||
The supported tags are as follows:
|
||||
|
||||
* outline
|
||||
* primary
|
||||
* secondary
|
||||
* tertiary
|
||||
* accent
|
||||
* logo
|
||||
* navigation
|
||||
* navigationActiveAccent
|
||||
|
||||
|
Before Width: | Height: | Size: 182 KiB After Width: | Height: | Size: 182 KiB |
|
Before Width: | Height: | Size: 90 KiB After Width: | Height: | Size: 90 KiB |
|
Before Width: | Height: | Size: 509 KiB After Width: | Height: | Size: 509 KiB |
|
Before Width: | Height: | Size: 300 KiB After Width: | Height: | Size: 300 KiB |
|
Before Width: | Height: | Size: 583 KiB After Width: | Height: | Size: 583 KiB |
|
Before Width: | Height: | Size: 901 KiB After Width: | Height: | Size: 901 KiB |
@@ -1,84 +0,0 @@
|
||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
android:width="413dp"
|
||||
android:height="114dp"
|
||||
android:viewportWidth="413"
|
||||
android:viewportHeight="114">
|
||||
<group>
|
||||
<clip-path
|
||||
android:pathData="M134.84,0.57h143.82v112.71h-143.82z"/>
|
||||
<path
|
||||
android:pathData="M260.14,44.62V59.04M192.86,14.74L201.04,8.64C204.02,6.42 208.12,6.45 211.07,8.73L212.84,10.09M164.61,35.82L156.15,42.14C154.05,43.7 152.82,46.17 152.82,48.79V100.48C152.82,105.07 156.53,108.78 161.11,108.78H251.85C256.43,108.78 260.14,105.07 260.14,100.48V71.05"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M165.38,54.52V17.83C165.38,16.3 166.61,15.07 168.14,15.07H206.8"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M175.32,27.21H194.11"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M175.32,38.39H193.56"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M175.32,49.57H196.57"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M175.32,60.75H203.13"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M257.86,106.5L223.49,74.77C220.93,72.41 217.59,71.1 214.11,71.1H197.24C193.65,71.1 190.2,72.5 187.62,75L155.1,106.5"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"/>
|
||||
<path
|
||||
android:pathData="M220.36,71.58L231.04,65.46"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M153.86,48.45L192.59,71.58"
|
||||
android:strokeWidth="2.77"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M260.35,35.09C260.35,51.78 246.82,65.3 230.13,65.3C213.45,65.3 199.92,51.78 199.92,35.09C199.92,18.4 213.45,4.88 230.13,4.88C246.82,4.88 260.35,18.4 260.35,35.09Z"
|
||||
android:strokeLineJoin="round"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M256.3,35.09C256.3,49.44 244.53,61.07 230.02,61.07M230.02,9.11C215.5,9.11 203.73,20.74 203.73,35.09"
|
||||
android:strokeLineJoin="round"
|
||||
android:strokeWidth="1.38289"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
<path
|
||||
android:pathData="M254.25,53.55L258.87,58.17L276.21,75.51C277.56,76.86 277.56,79.05 276.21,80.4L275.49,81.12C274.14,82.47 271.95,82.47 270.6,81.12L253.26,63.78L248.64,59.16"
|
||||
android:strokeLineJoin="round"
|
||||
android:strokeWidth="2.76577"
|
||||
android:fillColor="#00000000"
|
||||
android:strokeColor="#175DDC"
|
||||
android:strokeLineCap="round"/>
|
||||
</group>
|
||||
</vector>
|
||||
|
Before Width: | Height: | Size: 456 KiB After Width: | Height: | Size: 456 KiB |
@@ -1,95 +0,0 @@
|
||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
android:width="200dp"
|
||||
android:height="200dp"
|
||||
android:viewportWidth="200"
|
||||
android:viewportHeight="200">
|
||||
<group>
|
||||
<clip-path android:pathData="M0,0.67h200v200h-200z" />
|
||||
<path
|
||||
android:name="primary"
|
||||
android:fillColor="#DBE5F6"
|
||||
android:pathData="M18.75,38.17C18.75,31.26 24.35,25.67 31.25,25.67H168.75C175.65,25.67 181.25,31.26 181.25,38.17V125.67C181.25,132.57 175.65,138.17 168.75,138.17H31.25C24.35,138.17 18.75,132.57 18.75,125.67V38.17Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M168.75,29.83H31.25C26.65,29.83 22.92,33.56 22.92,38.17V125.67C22.92,130.27 26.65,134 31.25,134H168.75C173.35,134 177.08,130.27 177.08,125.67V38.17C177.08,33.56 173.35,29.83 168.75,29.83ZM31.25,25.67C24.35,25.67 18.75,31.26 18.75,38.17V125.67C18.75,132.57 24.35,138.17 31.25,138.17H168.75C175.65,138.17 181.25,132.57 181.25,125.67V38.17C181.25,31.26 175.65,25.67 168.75,25.67H31.25Z" />
|
||||
<path
|
||||
android:name="secondary"
|
||||
android:fillColor="#AAC3EF"
|
||||
android:pathData="M18.75,38.17H181.25V125.67H18.75V38.17Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M177.08,42.33H22.92V121.5H177.08V42.33ZM18.75,38.17V125.67H181.25V38.17H18.75Z" />
|
||||
<path
|
||||
android:name="primary"
|
||||
android:fillColor="#DBE5F6"
|
||||
android:pathData="M81.25,136.08H118.75V173.58H81.25V136.08Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M79.17,134H120.83V171.5H137.5C138.65,171.5 139.58,172.43 139.58,173.58C139.58,174.73 138.65,175.67 137.5,175.67H62.5C61.35,175.67 60.42,174.73 60.42,173.58C60.42,172.43 61.35,171.5 62.5,171.5H79.17V134ZM83.33,171.5H116.67V138.17H83.33V171.5Z" />
|
||||
<path
|
||||
android:name="tertiary"
|
||||
android:fillColor="#ffffff"
|
||||
android:pathData="M0,100.67C0,96.06 3.73,92.33 8.33,92.33H45.83C50.44,92.33 54.17,96.06 54.17,100.67V167.33C54.17,171.93 50.44,175.67 45.83,175.67H8.33C3.73,175.67 0,171.93 0,167.33V100.67Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M45.83,96.5H8.33C6.03,96.5 4.17,98.37 4.17,100.67V167.33C4.17,169.63 6.03,171.5 8.33,171.5H45.83C48.13,171.5 50,169.63 50,167.33V100.67C50,98.37 48.13,96.5 45.83,96.5ZM8.33,92.33C3.73,92.33 0,96.06 0,100.67V167.33C0,171.93 3.73,175.67 8.33,175.67H45.83C50.44,175.67 54.17,171.93 54.17,167.33V100.67C54.17,96.06 50.44,92.33 45.83,92.33H8.33Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M20.83,102.75C20.83,101.6 21.77,100.67 22.92,100.67L31.25,100.67C32.4,100.67 33.33,101.6 33.33,102.75C33.33,103.9 32.4,104.83 31.25,104.83L22.92,104.83C21.77,104.83 20.83,103.9 20.83,102.75Z" />
|
||||
<path
|
||||
android:name="primary"
|
||||
android:fillColor="#DBE5F6"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M100,115.25C118.41,115.25 133.33,100.33 133.33,81.92C133.33,63.51 118.41,48.58 100,48.58C81.59,48.58 66.67,63.51 66.67,81.92C66.67,100.33 81.59,115.25 100,115.25ZM85.42,69.42C81.96,69.42 79.17,72.21 79.17,75.67V96.5C79.17,99.95 81.96,102.75 85.42,102.75H114.58C118.03,102.75 120.83,99.95 120.83,96.5V75.67C120.83,72.21 118.03,69.42 114.58,69.42H85.42Z" />
|
||||
<path
|
||||
android:name="accent"
|
||||
android:fillColor="#FFBF00"
|
||||
android:pathData="M79.17,75.67C79.17,72.21 81.96,69.42 85.42,69.42H114.58C118.03,69.42 120.83,72.21 120.83,75.67V96.5C120.83,99.95 118.03,102.75 114.58,102.75H85.42C81.96,102.75 79.17,99.95 79.17,96.5V75.67Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M114.58,73.58H85.42C84.27,73.58 83.33,74.52 83.33,75.67V96.5C83.33,97.65 84.27,98.58 85.42,98.58H114.58C115.73,98.58 116.67,97.65 116.67,96.5V75.67C116.67,74.52 115.73,73.58 114.58,73.58ZM85.42,69.42C81.96,69.42 79.17,72.21 79.17,75.67V96.5C79.17,99.95 81.96,102.75 85.42,102.75H114.58C118.03,102.75 120.83,99.95 120.83,96.5V75.67C120.83,72.21 118.03,69.42 114.58,69.42H85.42Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:pathData="M97.92,81.92C97.92,80.77 98.85,79.83 100,79.83C101.15,79.83 102.08,80.77 102.08,81.92V90.25C102.08,91.4 101.15,92.33 100,92.33C98.85,92.33 97.92,91.4 97.92,90.25V81.92Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M89.58,67.33C89.58,61.58 94.25,56.92 100,56.92C105.75,56.92 110.42,61.58 110.42,67.33V69.42H106.25V67.33C106.25,63.88 103.45,61.08 100,61.08C96.55,61.08 93.75,63.88 93.75,67.33V69.42H89.58V67.33Z" />
|
||||
<path
|
||||
android:name="tertiary"
|
||||
android:fillColor="#ffffff"
|
||||
android:pathData="M125,84C125,79.4 128.73,75.67 133.33,75.67H191.67C196.27,75.67 200,79.4 200,84V167.33C200,171.94 196.27,175.67 191.67,175.67H133.33C128.73,175.67 125,171.94 125,167.33V84Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M191.67,79.83H133.33C131.03,79.83 129.17,81.7 129.17,84V167.33C129.17,169.63 131.03,171.5 133.33,171.5H191.67C193.97,171.5 195.83,169.63 195.83,167.33V84C195.83,81.7 193.97,79.83 191.67,79.83ZM133.33,75.67C128.73,75.67 125,79.4 125,84V167.33C125,171.94 128.73,175.67 133.33,175.67H191.67C196.27,175.67 200,171.94 200,167.33V84C200,79.4 196.27,75.67 191.67,75.67H133.33Z" />
|
||||
<path
|
||||
android:name="secondary"
|
||||
android:fillColor="#AAC3EF"
|
||||
android:pathData="M168.75,159C168.75,162.45 165.95,165.25 162.5,165.25C159.05,165.25 156.25,162.45 156.25,159C156.25,155.55 159.05,152.75 162.5,152.75C165.95,152.75 168.75,155.55 168.75,159Z" />
|
||||
<path
|
||||
android:name="outline"
|
||||
android:fillColor="#020F66"
|
||||
android:fillType="evenOdd"
|
||||
android:pathData="M162.5,161.08C163.65,161.08 164.58,160.15 164.58,159C164.58,157.85 163.65,156.92 162.5,156.92C161.35,156.92 160.42,157.85 160.42,159C160.42,160.15 161.35,161.08 162.5,161.08ZM162.5,165.25C165.95,165.25 168.75,162.45 168.75,159C168.75,155.55 165.95,152.75 162.5,152.75C159.05,152.75 156.25,155.55 156.25,159C156.25,162.45 159.05,165.25 162.5,165.25Z" />
|
||||
<path
|
||||
android:name="secondary"
|
||||
android:fillColor="#AAC3EF"
|
||||
android:pathData="M83.33,138.17H116.67V150.67H83.33V138.17Z" />
|
||||
</group>
|
||||
</vector>
|
||||