Consistently styled buttons (#483)

Use a more consistent iOS styling for in app buttons.

Example:
<img width=400
src=https://github.com/user-attachments/assets/5e7c57e2-dcaf-46e1-92b4-fed9f3759370
/>


See
#481 (comment)

BeeKit/GoalExtensions.swift

@@ -59,15 +59,15 @@ extension Goal {
     public var countdownColor :UIColor {
         let buf = self.safeBuf
         if buf < 1 {
-            return UIColor.beeminder.red
+            return UIColor.Beeminder.red
         }
         else if buf < 2 {
-            return UIColor.beeminder.orange
+            return UIColor.Beeminder.orange
         }
         else if buf < 3 {
-            return UIColor.beeminder.blue
+            return UIColor.Beeminder.blue
         }
-        return UIColor.beeminder.green
+        return UIColor.Beeminder.green
     }
 
     public var hideDataEntry: Bool {

BeeKit/UI/BSButton.swift

@@ -22,9 +22,13 @@ public class BSButton : UIButton {
     }
 
     func setup() {
-        self.titleLabel?.font = UIFont.beeminder.defaultFont
-        self.setTitleColor(UIColor.white, for: UIControl.State())
-        self.backgroundColor = UIColor.beeminder.gray
+        self.titleLabel?.font = UIFont.beeminder.defaultBoldFont
+        self.setTitleColor(UIColor.Beeminder.yellow, for: UIControl.State())
+        self.tintColor = .black
+        self.configuration = .filled()
+
+        self.layer.borderColor = UIColor.Beeminder.yellow.cgColor
+        self.layer.borderWidth = 1
     }
 
 }

BeeKit/UI/BSTextField.swift

@@ -14,17 +14,17 @@ public class BSTextField : UITextField {
     required init?(coder aDecoder: NSCoder) {
         super.init(coder: aDecoder)
         self.font = UIFont.beeminder.defaultFont
-        self.layer.borderColor = UIColor.beeminder.gray.cgColor
-        self.tintColor = UIColor.beeminder.gray
+        self.layer.borderColor = UIColor.Beeminder.gray.cgColor
+        self.tintColor = UIColor.Beeminder.gray
         self.layer.borderWidth = 1
         self.textAlignment = NSTextAlignment.center
     }
 
     override init(frame: CGRect) {
         super.init(frame: frame)
         self.font = UIFont.beeminder.defaultFont
-        self.layer.borderColor = UIColor.beeminder.gray.cgColor
-        self.tintColor = UIColor.beeminder.gray
+        self.layer.borderColor = UIColor.Beeminder.gray.cgColor
+        self.tintColor = UIColor.Beeminder.gray
         self.layer.borderWidth = 1
         self.textAlignment = NSTextAlignment.center
     }

BeeKit/UI/UIColorExtension.swift

@@ -11,17 +11,21 @@ import UIKit
 
 extension UIColor {
 
-    public struct beeminder {
-        public static var green: UIColor {
-            return UIColor(red: 81.0/255.0, green: 163.0/255.0, blue: 81.0/255.0, alpha: 1)
-        }
-
-        public static var blue: UIColor = UIColor.systemBlue
-        public static var orange: UIColor = UIColor.systemOrange
-        public static var red: UIColor = UIColor.systemRed
-
-        public static var gray: UIColor {
-            return UIColor(white: 0.7, alpha: 1.0)
-        }
+    public struct Beeminder {
+        public static let green = UIColor(red: 81.0/255.0,
+                                          green: 163.0/255.0,
+                                          blue: 81.0/255.0,
+                                          alpha: 1)
+
+        public static let blue: UIColor = .systemBlue
+        public static let orange: UIColor = .systemOrange
+        public static let red: UIColor = .systemRed
+
+        public static let gray = UIColor(white: 0.7, alpha: 1.0)
+
+        public static let yellow = UIColor(red: 255.0/255.0,
+                                           green: 217.0/255.0,
+                                           blue: 17.0/255.0,
+                                           alpha: 1)
     }
 }

BeeSwift/Components/PullToRefreshHint.swift

@@ -33,7 +33,7 @@ class PullToRefreshView : UIView {
     private func setupView() {
         self.addSubview(label)
         label.text = message
-        label.textColor = UIColor.beeminder.gray
+        label.textColor = UIColor.Beeminder.gray
         label.textAlignment = NSTextAlignment.center
         label.numberOfLines = 0
         label.snp.makeConstraints { (make) -> Void in
@@ -45,7 +45,7 @@ class PullToRefreshView : UIView {
         let iconLabel = UILabel()
         iconLabel.text = "⇩"
         iconLabel.font = UIFont.systemFont(ofSize: 30, weight: .ultraLight)
-        iconLabel.textColor = UIColor.beeminder.gray
+        iconLabel.textColor = UIColor.Beeminder.gray
         iconLabel.textAlignment = NSTextAlignment.center
         self.addSubview(iconLabel)
         iconLabel.snp.makeConstraints { (make) -> Void in

BeeSwift/EditDatapointViewController.swift

@@ -130,7 +130,7 @@ class EditDatapointViewController: UIViewController, UITextFieldDelegate {
             make.top.equalTo(commentLabel.snp.bottom).offset(3)
         }
 
-        let updateButton = UIButton(type: .system)
+        let updateButton = BSButton(type: .system)
         self.view.addSubview(updateButton)
         updateButton.setTitle("Update", for: .normal)
         updateButton.configuration = .filled()

BeeSwift/Gallery/GalleryViewController.swift

@@ -57,7 +57,7 @@ class GalleryViewController: UIViewController, UICollectionViewDelegateFlowLayou
         self.navigationItem.rightBarButtonItem = item
 
         self.view.addSubview(self.lastUpdatedView)
-        self.lastUpdatedView.backgroundColor = UIColor.beeminder.gray
+        self.lastUpdatedView.backgroundColor = UIColor.Beeminder.gray
         self.lastUpdatedView.snp.makeConstraints { (make) -> Void in
             make.top.equalTo(self.view.safeAreaLayoutGuide.snp.topMargin)
             make.left.equalTo(0)
@@ -79,7 +79,7 @@ class GalleryViewController: UIViewController, UICollectionViewDelegateFlowLayou
         Timer.scheduledTimer(timeInterval: 60, target: self, selector: #selector(GalleryViewController.updateLastUpdatedLabel), userInfo: nil, repeats: true)
 
         self.view.addSubview(self.deadbeatView)
-        self.deadbeatView.backgroundColor = UIColor.beeminder.gray
+        self.deadbeatView.backgroundColor = UIColor.Beeminder.gray
         self.deadbeatView.snp.makeConstraints { (make) -> Void in
             make.left.equalTo(0)
             make.right.equalTo(0)
@@ -91,7 +91,7 @@ class GalleryViewController: UIViewController, UICollectionViewDelegateFlowLayou
 
         let deadbeatLabel = BSLabel()
         self.deadbeatView.addSubview(deadbeatLabel)
-        deadbeatLabel.textColor = .beeminder.red
+        deadbeatLabel.textColor = UIColor.Beeminder.red
         deadbeatLabel.numberOfLines = 0
         deadbeatLabel.font = UIFont.beeminder.defaultFontHeavy.withSize(13)
         deadbeatLabel.text = "Hey! Beeminder couldn't charge your credit card, so you can't see your graphs. Please update your card on beeminder.com or email support@beeminder.com if this is a mistake."
@@ -103,15 +103,15 @@ class GalleryViewController: UIViewController, UICollectionViewDelegateFlowLayou
         }
 
         self.view.addSubview(self.outofdateView)
-        self.outofdateView.backgroundColor = UIColor.beeminder.gray
+        self.outofdateView.backgroundColor = UIColor.Beeminder.gray
         self.outofdateView.snp.makeConstraints { (make) in
             make.right.left.equalTo(0)
             make.top.equalTo(self.deadbeatView.snp.bottom)
             make.height.equalTo(0)
         }
 
         self.outofdateView.addSubview(self.outofdateLabel)
-        self.outofdateLabel.textColor = .beeminder.red
+        self.outofdateLabel.textColor = UIColor.Beeminder.red
         self.outofdateLabel.numberOfLines = 0
         self.outofdateLabel.font = UIFont.beeminder.defaultFontHeavy.withSize(12)
         self.outofdateLabel.textAlignment = .center
@@ -311,7 +311,7 @@ class GalleryViewController: UIViewController, UICollectionViewDelegateFlowLayou
         var color = UIColor.black
         if let lastUpdated = self.lastUpdated {
             if lastUpdated.timeIntervalSinceNow < -3600 {
-                color = .beeminder.red
+                color = UIColor.Beeminder.red
                 lastTextString = "Last updated: a long time ago..."
             }
             else if lastUpdated.timeIntervalSinceNow < -120 {
@@ -328,7 +328,7 @@ class GalleryViewController: UIViewController, UICollectionViewDelegateFlowLayou
             }
         }
         else {
-            color = .beeminder.red
+            color = UIColor.Beeminder.red
             lastTextString = "Last updated: a long time ago..."
         }
         let lastText: NSMutableAttributedString = NSMutableAttributedString(string: lastTextString)

BeeSwift/GoalCollectionViewCell.swift

@@ -26,7 +26,7 @@ class GoalCollectionViewCell: UICollectionViewCell {
             self.titleLabel.isHidden = goal?.title == goal?.slug
             self.todaytaLabel.text = goal?.todayta == true ? "✓" : ""
             self.safesumLabel.text = goal?.capitalSafesum()
-            self.safesumLabel.textColor = goal?.countdownColor ?? UIColor.beeminder.gray
+            self.safesumLabel.textColor = goal?.countdownColor ?? UIColor.Beeminder.gray
         }
     }
 

BeeSwift/GoalViewController.swift

@@ -138,8 +138,8 @@ class GoalViewController: UIViewController,  UIScrollViewDelegate, DatapointTabl
 
         dataEntryView.addSubview(self.dateTextField)
         self.dateTextField.font = UIFont.beeminder.defaultFontPlain.withSize(16)
-        self.dateTextField.tintColor = UIColor.beeminder.gray
-        self.dateTextField.layer.borderColor = UIColor.beeminder.gray.cgColor
+        self.dateTextField.tintColor = UIColor.Beeminder.gray
+        self.dateTextField.layer.borderColor = UIColor.Beeminder.gray.cgColor
         self.dateTextField.layer.borderWidth = 1
         self.dateTextField.isUserInteractionEnabled = false
         self.dateTextField.textAlignment = .center
@@ -153,8 +153,8 @@ class GoalViewController: UIViewController,  UIScrollViewDelegate, DatapointTabl
 
         dataEntryView.addSubview(self.valueTextField)
         self.valueTextField.font = UIFont.beeminder.defaultFontPlain.withSize(16)
-        self.valueTextField.tintColor = UIColor.beeminder.gray
-        self.valueTextField.layer.borderColor = UIColor.beeminder.gray.cgColor
+        self.valueTextField.tintColor = UIColor.Beeminder.gray
+        self.valueTextField.layer.borderColor = UIColor.Beeminder.gray.cgColor
         self.valueTextField.layer.borderWidth = 1
         self.valueTextField.delegate = self
         self.valueTextField.textAlignment = .center
@@ -176,8 +176,8 @@ class GoalViewController: UIViewController,  UIScrollViewDelegate, DatapointTabl
         self.commentTextField.font = UIFont.beeminder.defaultFontPlain.withSize(16)
         self.commentTextField.leftView = commentLeftPaddingView
         self.commentTextField.leftViewMode = .always
-        self.commentTextField.tintColor = UIColor.beeminder.gray
-        self.commentTextField.layer.borderColor = UIColor.beeminder.gray.cgColor
+        self.commentTextField.tintColor = UIColor.Beeminder.gray
+        self.commentTextField.layer.borderColor = UIColor.Beeminder.gray.cgColor
         self.commentTextField.layer.borderWidth = 1
         self.commentTextField.delegate = self
         self.commentTextField.placeholder = "Comment"
@@ -198,7 +198,7 @@ class GoalViewController: UIViewController,  UIScrollViewDelegate, DatapointTabl
             make.right.equalTo(self.commentTextField)
         }
 
-        self.dateStepper.tintColor = UIColor.beeminder.gray
+        self.dateStepper.tintColor = UIColor.Beeminder.gray
         dataEntryView.addSubview(self.dateStepper)
         self.dateStepper.addTarget(self, action: #selector(GoalViewController.dateStepperValueChanged), for: .valueChanged)
         self.dateStepper.value = 0
@@ -246,7 +246,7 @@ class GoalViewController: UIViewController,  UIScrollViewDelegate, DatapointTabl
             make.top.equalTo(self.dateStepper.snp.bottom).offset(elementSpacing)
         }
 
-        self.valueStepper.tintColor = UIColor.beeminder.gray
+        self.valueStepper.tintColor = UIColor.Beeminder.gray
         dataEntryView.addSubview(self.valueStepper)
         self.valueStepper.addTarget(self, action: #selector(GoalViewController.valueStepperValueChanged), for: .valueChanged)
         self.valueStepper.snp.makeConstraints { (make) -> Void in

BeeSwift/Settings/EditNotificationsViewController.swift

@@ -68,7 +68,7 @@ class EditNotificationsViewController: UIViewController {
 
         self.leadTimeStepper.minimumValue = 0
         self.leadTimeStepper.maximumValue = 30
-        self.leadTimeStepper.tintColor = UIColor.beeminder.gray
+        self.leadTimeStepper.tintColor = UIColor.Beeminder.gray
         self.leadTimeStepper.addTarget(self, action: #selector(EditNotificationsViewController.leadTimeStepperValueChanged), for: .valueChanged)
         self.view.addSubview(self.leadTimeStepper)
         self.leadTimeStepper.snp.makeConstraints { (make) -> Void in

BeeSwift/Settings/LogsViewController.swift

@@ -12,8 +12,8 @@ import OrderedCollections
 class LogsViewController: UIViewController {
 
     let logTextView = UITextView()
-    let systemLogsToggle = UIButton()
-    let errorLevelButton = UIButton()
+    let systemLogsToggle = UIButton(type: .system)
+    let errorLevelButton = UIButton(type: .system)
 
     let logReader = LogReader()
 

BeeSwift/SignInViewController.swift

@@ -99,7 +99,7 @@ class SignInViewController : UIViewController, UITextFieldDelegate, SFSafariView
         scrollView.addSubview(self.signInButton)
         self.signInButton.isHidden = true
         self.signInButton.setTitle("Sign In", for: UIControl.State())
-        self.signInButton.backgroundColor = UIColor.beeminder.gray
+        self.signInButton.backgroundColor = UIColor.Beeminder.gray
         self.signInButton.titleLabel?.font = UIFont.beeminder.defaultFontPlain.withSize(20)
         self.signInButton.titleLabel?.textColor = UIColor.white
         self.signInButton.addTarget(self, action: #selector(SignInViewController.signInButtonPressed), for: UIControl.Event.touchUpInside)
@@ -112,7 +112,7 @@ class SignInViewController : UIViewController, UITextFieldDelegate, SFSafariView
 
         scrollView.addSubview(self.divider)
         self.divider.isHidden = true
-        self.divider.backgroundColor = UIColor.beeminder.gray
+        self.divider.backgroundColor = UIColor.Beeminder.gray
 
         scrollView.addSubview(self.newUsernameTextField)
         self.newUsernameTextField.isHidden = true

BeeSwift/TimerViewController.swift

@@ -23,8 +23,8 @@ class TimerViewController: UIViewController {
      }
 
     let timerLabel = BSLabel()
-    let startStopButton = BSButton()
-    var goal: Goal
+    let startStopButton = BSButton(type: .system)
+    let goal: Goal
     var timingSince: Date?
     var timer: Timer?
     var units: String?
@@ -38,51 +38,56 @@ class TimerViewController: UIViewController {
         self.timerLabel.snp.makeConstraints { (make) in
             make.centerX.equalTo(self.view)
             make.bottom.equalTo(self.view.snp.centerY).offset(-10)
+            make.height.equalTo(Constants.defaultTextFieldHeight)
         }
         self.timerLabel.text = "00:00:00"
         self.timerLabel.textColor = .white
         self.timerLabel.font = UIFont.beeminder.defaultBoldFont.withSize(48)
 
-        let exitButton = BSButton()
+        let exitButton = BSButton(type: .system)
+        exitButton.configuration = .filled()
         self.view.addSubview(exitButton)
         exitButton.snp.makeConstraints { (make) in
-            make.left.equalTo(self.view.safeAreaLayoutGuide.snp.leftMargin)
+            make.left.equalTo(self.view.safeAreaLayoutGuide.snp.leftMargin).offset(10)
             make.bottom.equalTo(self.view.safeAreaLayoutGuide.snp.bottomMargin)
-            make.right.equalTo(self.view.snp.centerX)
+            make.right.equalTo(self.view.snp.centerX).offset(-10)
+            make.height.equalTo(Constants.defaultTextFieldHeight)
         }
-        exitButton.backgroundColor = .clear
         exitButton.addTarget(self, action: #selector(self.exitButtonPressed), for: .touchUpInside)
         exitButton.setTitle("Exit", for: .normal)
 
         self.view.addSubview(self.startStopButton)
+        startStopButton.configuration = .filled()
         self.startStopButton.snp.makeConstraints { (make) in
             make.top.equalTo(self.view.snp.centerY).offset(10)
             make.centerX.equalTo(self.view)
+            make.height.equalTo(Constants.defaultTextFieldHeight)
         }
-        self.startStopButton.backgroundColor = .clear
         self.startStopButton.addTarget(self, action: #selector(self.startStopButtonPressed), for: .touchUpInside)
         self.startStopButton.setTitle("Start", for: .normal)
 
-        let addDatapointButton = BSButton()
+        let addDatapointButton = BSButton(type: .system)
+        addDatapointButton.configuration = .filled()
         self.view.addSubview(addDatapointButton)
         addDatapointButton.snp.makeConstraints { (make) in
-            make.top.equalTo(self.startStopButton.snp.bottom).offset(10)
+            make.top.equalTo(self.startStopButton.snp.bottom).offset(Constants.defaultTextFieldHeight)
             make.centerX.equalTo(self.view)
+            make.height.equalTo(Constants.defaultTextFieldHeight)
         }
-        addDatapointButton.backgroundColor = .clear
         addDatapointButton.addTarget(self, action: #selector(self.addDatapointButtonPressed), for: .touchUpInside)
         addDatapointButton.setTitle("Add Datapoint to \(self.goal.slug)", for: .normal)
 
-        let resetButton = BSButton()
+        let resetButton = BSButton(type: .system)
+        resetButton.configuration = .filled()
         self.view.addSubview(resetButton)
         resetButton.snp.makeConstraints { (make) in
-            make.left.equalTo(self.view.snp.centerX)
-            make.right.equalTo(self.view.safeAreaLayoutGuide.snp.rightMargin)
+            make.left.equalTo(self.view.snp.centerX).offset(10)
+            make.right.equalTo(self.view.safeAreaLayoutGuide.snp.rightMargin).offset(-10)
             make.bottom.equalTo(self.view.safeAreaLayoutGuide.snp.bottomMargin)
+            make.height.equalTo(Constants.defaultTextFieldHeight)
         }
         resetButton.addTarget(self, action: #selector(self.resetButtonPressed), for: .touchUpInside)
         resetButton.setTitle("Reset", for: .normal)
-        resetButton.backgroundColor = .clear
     }
 
     @objc func exitButtonPressed() {