coding

Signed-off-by: marinofaggiana <ios@nextcloud.com>

iOSClient/Brand/NCBrand.swift

@@ -169,6 +169,52 @@ class NCBrandColor: NSObject {
         }
     }
 
+    @objc public var systemBlue: UIColor {
+        get {
+            if #available(iOS 13, *) {
+                return .systemBlue
+            } else {
+                return UIColor(red: 0.0, green: 122.0 / 255.0, blue: 1.0, alpha: 1.0)
+            }
+        }
+    }
+
+    @objc public var systemIndigo: UIColor {
+        get {
+            if #available(iOS 13, *) {
+                return .systemIndigo
+            } else {
+                return UIColor(red: 88.0 / 255.0, green: 86.0 / 255.0, blue: 214.0 / 255.0, alpha: 1.0)
+            }
+        }
+    }
+
+    @objc public var systemPink: UIColor {
+        get {
+            if #available(iOS 13, *) {
+                return .systemPink
+            } else {
+                return UIColor(red: 1.0, green: 45.0 / 255.0, blue: 85.0 / 255.0, alpha: 1.0)
+            }
+        }
+    }
+
+    @objc public var systemTeal: UIColor {
+        get {
+            if #available(iOS 13, *) {
+                return .systemTeal
+            } else {
+                return UIColor(red: 90.0 / 255.0, green: 200.0 / 255.0, blue: 250.0 / 255.0, alpha: 1.0)
+            }
+        }
+    }
+
+    @objc public var systemMint: UIColor {
+        get {
+            return UIColor(red: 0.0 / 255.0, green: 199.0 / 255.0, blue: 190.0 / 255.0, alpha: 1.0)
+        }
+    }
+
     @objc public var systemBackground: UIColor {
         get {
             if #available(iOS 13, *) {

iOSClient/Color/NCColorPicker.storyboard

@@ -14,9 +14,20 @@
             <objects>
                 <viewController id="Y6W-OH-hqX" customClass="NCColorPicker" customModule="Nextcloud" customModuleProvider="target" sceneMemberID="viewController">
                     <view key="view" contentMode="scaleToFill" id="5EZ-qb-Rvc">
-                        <rect key="frame" x="0.0" y="0.0" width="180" height="320"/>
+                        <rect key="frame" x="0.0" y="0.0" width="200" height="320"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <subviews>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="kwJ-4R-6nM">
+                                <rect key="frame" x="10" y="10" width="15" height="15"/>
+                                <constraints>
+                                    <constraint firstAttribute="height" constant="15" id="AE2-yu-3y4"/>
+                                    <constraint firstAttribute="width" constant="15" id="Foq-O9-Wep"/>
+                                </constraints>
+                                <state key="normal" image="xmark"/>
+                                <connections>
+                                    <action selector="closeAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="nq5-sT-FEb"/>
+                                </connections>
+                            </button>
                             <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="JUR-Vj-yBU">
                                 <rect key="frame" x="15" y="40" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
@@ -65,32 +76,44 @@
                                     <action selector="blueButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="M04-54-NPB"/>
                                 </connections>
                             </button>
-                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="I9w-cx-QlY">
-                                <rect key="frame" x="125" y="205" width="40" height="40"/>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="8xv-8Y-A50">
+                                <rect key="frame" x="15" y="260" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
-                                    <constraint firstAttribute="height" constant="40" id="Vgv-il-6Vw"/>
-                                    <constraint firstAttribute="width" constant="40" id="dHD-fs-7m0"/>
+                                    <constraint firstAttribute="height" constant="40" id="Jgq-IJ-7jj"/>
+                                    <constraint firstAttribute="width" constant="40" id="h5m-EQ-2Go"/>
                                 </constraints>
                                 <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
                                 <connections>
-                                    <action selector="brownButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="AH7-Kr-g9S"/>
+                                    <action selector="greenButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="VVw-Ra-U8N"/>
                                 </connections>
                             </button>
-                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="8xv-8Y-A50">
-                                <rect key="frame" x="15" y="260" width="40" height="40"/>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="OlH-Ak-sRA">
+                                <rect key="frame" x="80" y="40" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
-                                    <constraint firstAttribute="height" constant="40" id="Jgq-IJ-7jj"/>
-                                    <constraint firstAttribute="width" constant="40" id="h5m-EQ-2Go"/>
+                                    <constraint firstAttribute="height" constant="40" id="3kj-5z-0de"/>
+                                    <constraint firstAttribute="width" constant="40" id="vjr-4J-pHk"/>
                                 </constraints>
                                 <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
                                 <connections>
-                                    <action selector="greenButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="VVw-Ra-U8N"/>
+                                    <action selector="cyanButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="Qxa-md-cPa"/>
+                                </connections>
+                            </button>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="FU6-q8-9Iw">
+                                <rect key="frame" x="80" y="95" width="40" height="40"/>
+                                <color key="backgroundColor" systemColor="labelColor"/>
+                                <constraints>
+                                    <constraint firstAttribute="width" constant="40" id="NGk-p2-vQ4"/>
+                                    <constraint firstAttribute="height" constant="40" id="Rni-gX-9zj"/>
+                                </constraints>
+                                <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
+                                <connections>
+                                    <action selector="yellowButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="DuE-By-m9k"/>
                                 </connections>
                             </button>
                             <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="LwF-26-oss">
-                                <rect key="frame" x="125" y="150" width="40" height="40"/>
+                                <rect key="frame" x="80" y="150" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
                                     <constraint firstAttribute="height" constant="40" id="Pqo-uv-KrN"/>
@@ -101,82 +124,129 @@
                                     <action selector="grayButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="wP2-wX-3Hl"/>
                                 </connections>
                             </button>
-                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="kwJ-4R-6nM">
-                                <rect key="frame" x="10" y="10" width="15" height="15"/>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="I9w-cx-QlY">
+                                <rect key="frame" x="80" y="205" width="40" height="40"/>
+                                <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
-                                    <constraint firstAttribute="height" constant="15" id="AE2-yu-3y4"/>
-                                    <constraint firstAttribute="width" constant="15" id="Foq-O9-Wep"/>
+                                    <constraint firstAttribute="height" constant="40" id="Vgv-il-6Vw"/>
+                                    <constraint firstAttribute="width" constant="40" id="dHD-fs-7m0"/>
                                 </constraints>
-                                <state key="normal" image="xmark"/>
+                                <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
                                 <connections>
-                                    <action selector="closeAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="nq5-sT-FEb"/>
+                                    <action selector="brownButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="AH7-Kr-g9S"/>
                                 </connections>
                             </button>
-                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="OlH-Ak-sRA">
-                                <rect key="frame" x="125" y="40" width="40" height="40"/>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="Uaq-hC-U4a">
+                                <rect key="frame" x="145" y="260" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
-                                    <constraint firstAttribute="height" constant="40" id="3kj-5z-0de"/>
-                                    <constraint firstAttribute="width" constant="40" id="vjr-4J-pHk"/>
+                                    <constraint firstAttribute="height" constant="40" id="DqE-d1-FMQ"/>
+                                    <constraint firstAttribute="width" constant="40" id="L0n-3P-wA1"/>
                                 </constraints>
                                 <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
                                 <connections>
-                                    <action selector="cyanButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="Qxa-md-cPa"/>
+                                    <action selector="defaultButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="VhY-1n-fwQ"/>
                                 </connections>
                             </button>
-                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="FU6-q8-9Iw">
-                                <rect key="frame" x="125" y="95" width="40" height="40"/>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="tt7-sI-TfL">
+                                <rect key="frame" x="145" y="40" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
-                                    <constraint firstAttribute="width" constant="40" id="NGk-p2-vQ4"/>
-                                    <constraint firstAttribute="height" constant="40" id="Rni-gX-9zj"/>
+                                    <constraint firstAttribute="width" constant="40" id="b6h-GE-ftL"/>
+                                    <constraint firstAttribute="height" constant="40" id="mfL-IL-0ZL"/>
                                 </constraints>
                                 <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
                                 <connections>
-                                    <action selector="yellowButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="DuE-By-m9k"/>
+                                    <action selector="systemIndigoButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="rNl-zX-67r"/>
                                 </connections>
                             </button>
-                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="Uaq-hC-U4a">
-                                <rect key="frame" x="125" y="260" width="40" height="40"/>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="12u-cu-XGu">
+                                <rect key="frame" x="80" y="260" width="40" height="40"/>
                                 <color key="backgroundColor" systemColor="labelColor"/>
                                 <constraints>
-                                    <constraint firstAttribute="height" constant="40" id="DqE-d1-FMQ"/>
-                                    <constraint firstAttribute="width" constant="40" id="L0n-3P-wA1"/>
+                                    <constraint firstAttribute="width" constant="40" id="8vW-vR-kNP"/>
+                                    <constraint firstAttribute="height" constant="40" id="F3v-dP-jmB"/>
                                 </constraints>
                                 <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
                                 <connections>
-                                    <action selector="defaultButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="VhY-1n-fwQ"/>
+                                    <action selector="systemBlueButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="V6v-x6-0xf"/>
+                                </connections>
+                            </button>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="Arw-up-GyD">
+                                <rect key="frame" x="145" y="95" width="40" height="40"/>
+                                <color key="backgroundColor" systemColor="labelColor"/>
+                                <constraints>
+                                    <constraint firstAttribute="width" constant="40" id="A9m-mr-Ec3"/>
+                                    <constraint firstAttribute="height" constant="40" id="s6X-2m-m44"/>
+                                </constraints>
+                                <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
+                                <connections>
+                                    <action selector="systemMintButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="aDb-dN-ifP"/>
+                                </connections>
+                            </button>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="I7I-Ed-32n">
+                                <rect key="frame" x="145" y="150" width="40" height="40"/>
+                                <color key="backgroundColor" systemColor="labelColor"/>
+                                <constraints>
+                                    <constraint firstAttribute="height" constant="40" id="Gd6-bt-nR7"/>
+                                    <constraint firstAttribute="width" constant="40" id="eRN-Vo-lal"/>
+                                </constraints>
+                                <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
+                                <connections>
+                                    <action selector="systemPinkButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="emC-0N-gqJ"/>
+                                </connections>
+                            </button>
+                            <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="iB2-gu-3IO">
+                                <rect key="frame" x="145" y="205" width="40" height="40"/>
+                                <color key="backgroundColor" systemColor="labelColor"/>
+                                <constraints>
+                                    <constraint firstAttribute="width" constant="40" id="62A-PY-UZr"/>
+                                    <constraint firstAttribute="height" constant="40" id="P8F-Uh-nef"/>
+                                </constraints>
+                                <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
+                                <connections>
+                                    <action selector="systemTealButtonAction:" destination="Y6W-OH-hqX" eventType="touchUpInside" id="2ye-Wz-wur"/>
                                 </connections>
                             </button>
                         </subviews>
                         <viewLayoutGuide key="safeArea" id="vDu-zF-Fre"/>
                         <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <constraints>
+                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="I7I-Ed-32n" secondAttribute="trailing" constant="15" id="3ke-4j-aut"/>
+                            <constraint firstItem="12u-cu-XGu" firstAttribute="centerY" secondItem="8xv-8Y-A50" secondAttribute="centerY" id="3ns-C4-1Xk"/>
                             <constraint firstItem="FU6-q8-9Iw" firstAttribute="centerY" secondItem="Zr2-rF-YUt" secondAttribute="centerY" id="4Ul-fS-EGZ"/>
-                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="LwF-26-oss" secondAttribute="trailing" constant="15" id="9cu-vI-FUM"/>
+                            <constraint firstItem="iB2-gu-3IO" firstAttribute="centerY" secondItem="I9w-cx-QlY" secondAttribute="centerY" id="9Pw-x0-2Oc"/>
                             <constraint firstItem="I9w-cx-QlY" firstAttribute="centerY" secondItem="C2a-jB-FVB" secondAttribute="centerY" id="Adb-Hg-6jK"/>
+                            <constraint firstItem="I7I-Ed-32n" firstAttribute="centerY" secondItem="LwF-26-oss" secondAttribute="centerY" id="HyJ-T6-sBi"/>
+                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="iB2-gu-3IO" secondAttribute="trailing" constant="15" id="Ig3-DV-ieD"/>
+                            <constraint firstItem="Arw-up-GyD" firstAttribute="centerY" secondItem="FU6-q8-9Iw" secondAttribute="centerY" id="K5S-f9-g07"/>
                             <constraint firstItem="C2a-jB-FVB" firstAttribute="leading" secondItem="vDu-zF-Fre" secondAttribute="leading" constant="15" id="Lpi-y7-FCx"/>
+                            <constraint firstItem="OlH-Ak-sRA" firstAttribute="centerX" secondItem="vDu-zF-Fre" secondAttribute="centerX" id="T5p-2s-e2t"/>
+                            <constraint firstItem="I9w-cx-QlY" firstAttribute="centerX" secondItem="vDu-zF-Fre" secondAttribute="centerX" id="Vzf-ZI-4Y7"/>
                             <constraint firstItem="Uaq-hC-U4a" firstAttribute="centerY" secondItem="8xv-8Y-A50" secondAttribute="centerY" id="WX1-7F-LZs"/>
                             <constraint firstItem="JUR-Vj-yBU" firstAttribute="leading" secondItem="vDu-zF-Fre" secondAttribute="leading" constant="15" id="ZH3-0g-M1x"/>
                             <constraint firstItem="C2a-jB-FVB" firstAttribute="top" secondItem="dOn-SY-wnl" secondAttribute="bottom" constant="15" id="byc-af-adU"/>
+                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="Arw-up-GyD" secondAttribute="trailing" constant="15" id="cyP-IZ-1wa"/>
+                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="tt7-sI-TfL" secondAttribute="trailing" constant="15" id="dOh-Zh-y8X"/>
+                            <constraint firstItem="LwF-26-oss" firstAttribute="centerX" secondItem="vDu-zF-Fre" secondAttribute="centerX" id="eli-R1-TLW"/>
                             <constraint firstItem="dOn-SY-wnl" firstAttribute="leading" secondItem="vDu-zF-Fre" secondAttribute="leading" constant="15" id="gfe-aq-7nk"/>
                             <constraint firstItem="kwJ-4R-6nM" firstAttribute="top" secondItem="vDu-zF-Fre" secondAttribute="top" constant="10" id="hAt-TC-6LC"/>
                             <constraint firstItem="Zr2-rF-YUt" firstAttribute="top" secondItem="JUR-Vj-yBU" secondAttribute="bottom" constant="15" id="kLH-Zl-k0m"/>
+                            <constraint firstItem="tt7-sI-TfL" firstAttribute="centerY" secondItem="OlH-Ak-sRA" secondAttribute="centerY" id="ksI-o1-K8w"/>
                             <constraint firstItem="LwF-26-oss" firstAttribute="centerY" secondItem="dOn-SY-wnl" secondAttribute="centerY" id="l31-GR-n7H"/>
-                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="FU6-q8-9Iw" secondAttribute="trailing" constant="15" id="qWt-Yb-rF6"/>
+                            <constraint firstItem="12u-cu-XGu" firstAttribute="centerX" secondItem="vDu-zF-Fre" secondAttribute="centerX" id="qE7-PC-xCD"/>
                             <constraint firstItem="kwJ-4R-6nM" firstAttribute="leading" secondItem="vDu-zF-Fre" secondAttribute="leading" constant="10" id="rHM-tU-erV"/>
                             <constraint firstItem="OlH-Ak-sRA" firstAttribute="centerY" secondItem="JUR-Vj-yBU" secondAttribute="centerY" id="rwN-7j-Caf"/>
                             <constraint firstItem="8xv-8Y-A50" firstAttribute="top" secondItem="I9w-cx-QlY" secondAttribute="bottom" constant="15" id="tNf-9p-HHV"/>
-                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="OlH-Ak-sRA" secondAttribute="trailing" constant="15" id="tPx-ke-HvD"/>
                             <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="Uaq-hC-U4a" secondAttribute="trailing" constant="15" id="tzG-Kx-can"/>
                             <constraint firstItem="dOn-SY-wnl" firstAttribute="top" secondItem="Zr2-rF-YUt" secondAttribute="bottom" constant="15" id="uIJ-Xj-Oe3"/>
-                            <constraint firstItem="vDu-zF-Fre" firstAttribute="trailing" secondItem="I9w-cx-QlY" secondAttribute="trailing" constant="15" id="xrw-P1-NB1"/>
+                            <constraint firstItem="FU6-q8-9Iw" firstAttribute="centerX" secondItem="vDu-zF-Fre" secondAttribute="centerX" id="vzc-ef-AhZ"/>
                             <constraint firstItem="Zr2-rF-YUt" firstAttribute="leading" secondItem="vDu-zF-Fre" secondAttribute="leading" constant="15" id="zBA-2T-5J8"/>
                             <constraint firstItem="8xv-8Y-A50" firstAttribute="leading" secondItem="vDu-zF-Fre" secondAttribute="leading" constant="15" id="zJA-Gg-OZr"/>
                             <constraint firstItem="JUR-Vj-yBU" firstAttribute="top" secondItem="vDu-zF-Fre" secondAttribute="top" constant="40" id="zbI-KC-mx0"/>
                         </constraints>
                     </view>
-                    <size key="freeformSize" width="180" height="320"/>
+                    <size key="freeformSize" width="200" height="320"/>
                     <connections>
                         <outlet property="blueButton" destination="C2a-jB-FVB" id="lIY-Ag-Nkv"/>
                         <outlet property="brownButton" destination="I9w-cx-QlY" id="b8T-np-0mw"/>
@@ -188,6 +258,11 @@
                         <outlet property="orangeButton" destination="JUR-Vj-yBU" id="aGO-8f-0Em"/>
                         <outlet property="purpleButton" destination="dOn-SY-wnl" id="hes-XJ-gMJ"/>
                         <outlet property="redButton" destination="Zr2-rF-YUt" id="jib-wX-2Of"/>
+                        <outlet property="systemBlueButton" destination="12u-cu-XGu" id="aOV-BK-urz"/>
+                        <outlet property="systemIndigoButton" destination="tt7-sI-TfL" id="tUi-Th-IDf"/>
+                        <outlet property="systemMintButton" destination="Arw-up-GyD" id="gqG-tN-WiJ"/>
+                        <outlet property="systemPinkButton" destination="I7I-Ed-32n" id="YzP-1f-nkJ"/>
+                        <outlet property="systemTealButton" destination="iB2-gu-3IO" id="S2F-rL-O44"/>
                         <outlet property="yellowButton" destination="FU6-q8-9Iw" id="oAa-NT-Qhd"/>
                     </connections>
                 </viewController>

iOSClient/Color/NCColorPicker.swift

@@ -23,11 +23,11 @@ class NCColorPicker: UIViewController {
     @IBOutlet weak var cyanButton: UIButton!
     @IBOutlet weak var yellowButton: UIButton!
 
-    @IBOutlet weak var indingoButton: UIButton!
-    @IBOutlet weak var mintButton: UIButton!
-    @IBOutlet weak var pinkButton: UIButton!
-    @IBOutlet weak var tealButton: UIButton!
-    @IBOutlet weak var systemblueButton: UIButton!
+    @IBOutlet weak var systemIndigoButton: UIButton!
+    @IBOutlet weak var systemMintButton: UIButton!
+    @IBOutlet weak var systemPinkButton: UIButton!
+    @IBOutlet weak var systemTealButton: UIButton!
+    @IBOutlet weak var systemBlueButton: UIButton!
 
     @IBOutlet weak var defaultButton: UIButton!
 
@@ -79,6 +79,26 @@ class NCColorPicker: UIViewController {
         yellowButton.layer.cornerRadius = 5
         yellowButton.layer.masksToBounds = true
 
+        systemBlueButton.backgroundColor = NCBrandColor.shared.systemBlue
+        systemBlueButton.layer.cornerRadius = 5
+        systemBlueButton.layer.masksToBounds = true
+
+        systemMintButton.backgroundColor = NCBrandColor.shared.systemMint
+        systemMintButton.layer.cornerRadius = 5
+        systemMintButton.layer.masksToBounds = true
+
+        systemPinkButton.backgroundColor = NCBrandColor.shared.systemPink
+        systemPinkButton.layer.cornerRadius = 5
+        systemPinkButton.layer.masksToBounds = true
+
+        systemTealButton.backgroundColor = NCBrandColor.shared.systemTeal
+        systemTealButton.layer.cornerRadius = 5
+        systemTealButton.layer.masksToBounds = true
+
+        systemIndigoButton.backgroundColor = NCBrandColor.shared.systemIndigo
+        systemIndigoButton.layer.cornerRadius = 5
+        systemIndigoButton.layer.masksToBounds = true
+
         defaultButton.backgroundColor = NCBrandColor.shared.brandElement
         defaultButton.layer.cornerRadius = 5
         defaultButton.layer.masksToBounds = true
@@ -128,6 +148,26 @@ class NCColorPicker: UIViewController {
         updateColor(hexColor: UIColor.yellow.hexString)
     }
 
+    @IBAction func systemIndigoButtonAction(_ sender: AnyObject) {
+        updateColor(hexColor: NCBrandColor.shared.systemIndigo.hexString)
+    }
+
+    @IBAction func systemMintButtonAction(_ sender: AnyObject) {
+        updateColor(hexColor: NCBrandColor.shared.systemMint.hexString)
+    }
+
+    @IBAction func systemPinkButtonAction(_ sender: AnyObject) {
+        updateColor(hexColor: NCBrandColor.shared.systemPink.hexString)
+    }
+
+    @IBAction func systemTealButtonAction(_ sender: AnyObject) {
+        updateColor(hexColor: NCBrandColor.shared.systemTeal.hexString)
+    }
+
+    @IBAction func systemBlueButtonAction(_ sender: AnyObject) {
+        updateColor(hexColor: NCBrandColor.shared.systemBlue.hexString)
+    }
+
     @IBAction func defaultButtonAction(_ sender: AnyObject) {
         updateColor(hexColor: nil)
     }

iOSClient/Menu/NCCollectionViewCommon+Menu.swift

@@ -305,7 +305,7 @@ extension NCCollectionViewCommon {
                     action: { _ in
                         if let picker = UIStoryboard(name: "NCColorPicker", bundle: nil).instantiateInitialViewController() as? NCColorPicker {
                             picker.metadata = metadata
-                            let popup = NCPopupViewController(contentController: picker, popupWidth: 150, popupHeight: 320)
+                            let popup = NCPopupViewController(contentController: picker, popupWidth: 200, popupHeight: 320)
                             popup.backgroundAlpha = 0
                             self.present(popup, animated: true)
                         }