#441 add changelog edits + styling for install keyboards button

CHANGELOG.md

@@ -33,6 +33,8 @@ Emojis for the following are chosen based on [gitmoji](https://gitmoji.dev/).
 - iPad keyboards are now more reflective of their system keyboard counterparts for devices above a certain width ([#33](https://github.com/scribe-org/Scribe-iOS/issues/33), [#352](https://github.com/scribe-org/Scribe-iOS/issues/352)).
 - Vertical spacing between keys on iPads has been decreased so that keys are more square and thus more in line with system keyboards.
 - The border was removed from the Scribe key and command bar so that now only the shadow delineates them ([#423](https://github.com/scribe-org/Scribe-iOS/issues/423)).
+- The command bar in dark mode is now the same color as the special keys, and minor adjustments to the keyboard colors have been made to account for this ([#441](https://github.com/scribe-org/Scribe-iOS/issues/441)).
+- In dark mode the icons and buttons are now the CTA orange color text over the same color with a high transparency ([#441](https://github.com/scribe-org/Scribe-iOS/issues/441)).
 
 ### 🐞 Bug Fixes
 

Scribe/AboutTab/AboutTableData.swift

@@ -62,13 +62,13 @@ struct AboutTableData {
       section: [
         Section(
           sectionTitle: "Rate Scribe",
-          imageString: "star",
+          imageString: "star.fill",
           sectionState: .rateScribe,
           externalLink: true
         ),
         Section(
           sectionTitle: "Report a bug",
-          imageString: "ant",
+          imageString: "ladybug",
           sectionState: .bugReport,
           externalLink: true
         ),

Scribe/Assets.xcassets/Colors/appBtn.colorset/Contents.json

@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "13",
+          "green" : "173",
+          "red" : "253"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0.012",
+          "green" : "0.098",
+          "red" : "0.165"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Scribe/Assets.xcassets/Colors/lightTextDarkCTA.colorset/Contents.json

@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "0.900",
+          "blue" : "0.000",
+          "green" : "0.000",
+          "red" : "0.000"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "0.900",
+          "blue" : "15",
+          "green" : "123",
+          "red" : "209"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Scribe/Base.lproj/AppScreen.storyboard

@@ -176,7 +176,7 @@
                                                     <state key="normal" title="Button"/>
                                                 </button>
                                             </subviews>
-                                            <color key="backgroundColor" name="scribeCTA"/>
+                                            <color key="backgroundColor" name="appBtn"/>
                                             <constraints>
                                                 <constraint firstAttribute="bottom" secondItem="3gB-ix-8Gq" secondAttribute="bottom" id="3zh-t3-d71"/>
                                                 <constraint firstItem="3gB-ix-8Gq" firstAttribute="top" secondItem="IUx-l8-ZuO" secondAttribute="top" id="3zq-SH-hyN"/>
@@ -219,7 +219,7 @@
                         <outlet property="footerButton" destination="3gB-ix-8Gq" id="sQ7-oh-pis"/>
                         <outlet property="footerFrame" destination="IUx-l8-ZuO" id="zei-iv-IbX"/>
                         <outlet property="parentTable" destination="R98-aa-uZS" id="5wJ-1H-Zp2"/>
-                        <segue destination="ZA3-mW-CXa" kind="show" id="WZJ-vL-yPU"/>
+                        <segue destination="ZA3-mW-CXa" kind="show" identifier="View keyboard settings" id="WZJ-vL-yPU"/>
                     </connections>
                 </viewController>
                 <placeholder placeholderIdentifier="IBFirstResponder" id="I0c-Lq-Rf5" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
@@ -431,21 +431,21 @@
         <image name="info.circle" catalog="system" width="128" height="123"/>
         <image name="keyboard" catalog="system" width="128" height="78"/>
         <image name="linkCornerBackground" width="1024" height="1024"/>
+        <namedColor name="appBtn">
+            <color red="0.99215686274509807" green="0.67843137254901964" blue="0.050980392156862744" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
         <namedColor name="keyChar">
             <color red="0.0" green="0.0" blue="0.0" alpha="0.89999997615814209" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="lightWhiteDarkBlack">
             <color red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="linkBlue">
-            <color red="0.2196078431372549" green="0.49411764705882355" blue="0.6705882352941176" alpha="0.89999997615814209" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.16470588235294117" green="0.49411764705882355" blue="0.66666666666666663" alpha="0.89999997615814209" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="scribeAppBackground">
             <color red="0.36862745098039218" green="0.70980392156862748" blue="0.90980392156862744" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
-        <namedColor name="scribeCTA">
-            <color red="0.99215686274509807" green="0.67843137254901964" blue="0.050980392156862744" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
-        </namedColor>
         <systemColor name="labelColor">
             <color white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
         </systemColor>

Scribe/Colors/ColorVariables.swift

@@ -36,7 +36,9 @@ var commandBarPlaceholderColorCG = UIColor(.commandBarPlaceholder).cgColor
 var keyboardBgColor = UIColor(.keyboardBackground)
 var keyShadowColor = UIColor(.keyShadow).cgColor
 
+var appBtnColor = UIColor(.appBtn)
 var menuOptionColor = UIColor(.menuOption)
+var lightTextDarkCTA = UIColor(.lightTextDarkCTA)
 var lightWhiteDarkBlackColor = UIColor(.lightWhiteDarkBlack)
 var linkBlueColor = UIColor(.linkBlue)
 var scribeCTAColor = UIColor(.scribeCTA)

Scribe/Colors/ScribeColor.swift

@@ -27,6 +27,7 @@ enum ScribeColor: String {
   case annotateGreen
   case annotateOrange
   case annotateTitle
+  case appBtn
   case commandBar
   case commandBarPlaceholder
   case commandKey
@@ -36,6 +37,7 @@ enum ScribeColor: String {
   case keyPressed
   case keyShadow
   case keySpecial
+  case lightTextDarkCTA
   case lightWhiteDarkBlack
   case linkBlue
   case menuOption

Scribe/SettingsTab/SettingsViewController.swift

@@ -89,9 +89,21 @@ final class SettingsViewController: UIViewController {
     footerButton.setTitle("Install keyboard", for: .normal)
     footerButton.titleLabel?.font = .systemFont(ofSize: fontSize * 1.5, weight: .bold)
 
-    footerFrame.layer.cornerRadius = footerFrame.frame.width * 0.05
-    footerButton.layer.cornerRadius = footerFrame.frame.width * 0.05
-    footerButton.clipsToBounds = true
+    footerButton.backgroundColor = appBtnColor
+    if UITraitCollection.current.userInterfaceStyle == .dark {
+      footerButton.layer.borderWidth = 1
+      footerButton.layer.borderColor = scribeCTAColor.cgColor
+    }
+    footerButton.setTitleColor(lightTextDarkCTA, for: .normal)
+    footerFrame.layer.cornerRadius = footerFrame.frame.width * 0.025
+    footerButton.layer.cornerRadius = footerFrame.frame.width * 0.025
+    footerButton.layer.shadowColor = UIColor(red: 0.247, green: 0.247, blue: 0.275, alpha: 0.25).cgColor
+    footerButton.layer.shadowOffset = CGSize(width: 0.0, height: 4.0)
+    footerButton.layer.shadowOpacity = 1.0
+    footerButton.layer.masksToBounds = false
+
+    footerButton.addTarget(self, action: #selector(openSettingsApp), for: .touchUpInside)
+    footerButton.addTarget(self, action: #selector(keyTouchDown), for: .touchDown)
   }
 }
 
@@ -200,4 +212,27 @@ extension SettingsViewController: UITableViewDelegate {
 
     return headerView
   }
+
+  /// Function to open the settings app that is targeted by settingsBtn.
+  @objc func openSettingsApp() {
+    guard let settingsURL = URL(string: UIApplication.openSettingsURLString) else {
+      fatalError("Failed to create settings URL.")
+    }
+    UIApplication.shared.open(settingsURL)
+  }
+
+  /// Function to change the key coloration given a touch down.
+  ///
+  /// - Parameters
+  ///  - sender: the button that has been pressed.
+  @objc func keyTouchDown(_ sender: UIButton) {
+    sender.backgroundColor = .black
+    sender.alpha = 0.2
+
+    // Bring sender's opacity back up to fully opaque and replace the background color.
+    DispatchQueue.main.asyncAfter(deadline: .now() + 0.15) {
+      sender.backgroundColor = .clear
+      sender.alpha = 1.0
+    }
+  }
 }