UI/UX

Nextcloud.xcodeproj/project.pbxproj

@@ -67,7 +67,6 @@
 		F70022FF1EC4C9100080073F /* UtilsFramework.m in Sources */ = {isa = PBXBuildFile; fileRef = F70022A01EC4C9100080073F /* UtilsFramework.m */; };
 		F70A630B1D5B3467004E2AA5 /* libcrypto.a in Frameworks */ = {isa = PBXBuildFile; fileRef = F70A63061D5B3467004E2AA5 /* libcrypto.a */; };
 		F70A630F1D5B3467004E2AA5 /* libssl.a in Frameworks */ = {isa = PBXBuildFile; fileRef = F70A63071D5B3467004E2AA5 /* libssl.a */; };
-		F70BE2592184581000425587 /* NCOfflineHeaderMenu.xib in Resources */ = {isa = PBXBuildFile; fileRef = F70BE2582184581000425587 /* NCOfflineHeaderMenu.xib */; };
 		F70BFC7420E0FA7D00C67599 /* NCUtility.swift in Sources */ = {isa = PBXBuildFile; fileRef = F70BFC7320E0FA7C00C67599 /* NCUtility.swift */; };
 		F70BFC7520E0FA7D00C67599 /* NCUtility.swift in Sources */ = {isa = PBXBuildFile; fileRef = F70BFC7320E0FA7C00C67599 /* NCUtility.swift */; };
 		F70CAE3A1F8CF31A008125FD /* NCEndToEndEncryption.m in Sources */ = {isa = PBXBuildFile; fileRef = F70CAE391F8CF31A008125FD /* NCEndToEndEncryption.m */; };
@@ -804,7 +803,6 @@
 		F70A07C8205285FB00DC1231 /* pt-PT */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = "pt-PT"; path = "pt-PT.lproj/Localizable.strings"; sourceTree = "<group>"; };
 		F70A63061D5B3467004E2AA5 /* libcrypto.a */ = {isa = PBXFileReference; lastKnownFileType = archive.ar; path = libcrypto.a; sourceTree = "<group>"; };
 		F70A63071D5B3467004E2AA5 /* libssl.a */ = {isa = PBXFileReference; lastKnownFileType = archive.ar; path = libssl.a; sourceTree = "<group>"; };
-		F70BE2582184581000425587 /* NCOfflineHeaderMenu.xib */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.xib; path = NCOfflineHeaderMenu.xib; sourceTree = "<group>"; };
 		F70BFC7320E0FA7C00C67599 /* NCUtility.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NCUtility.swift; sourceTree = "<group>"; };
 		F70CAE381F8CF31A008125FD /* NCEndToEndEncryption.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = NCEndToEndEncryption.h; sourceTree = "<group>"; };
 		F70CAE391F8CF31A008125FD /* NCEndToEndEncryption.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = NCEndToEndEncryption.m; sourceTree = "<group>"; };
@@ -2894,7 +2892,6 @@
 		F7632FD521836A3F00721B71 /* Section */ = {
 			isa = PBXGroup;
 			children = (
-				F70BE2582184581000425587 /* NCOfflineHeaderMenu.xib */,
 				F7632FD621836A5B00721B71 /* NCOfflineSectionHeaderMenu.xib */,
 				F73D2A7321836C4700BCA11F /* NCOfflineSectionHeader.xib */,
 				F73D2A752183725B00BCA11F /* NCOfflineFooter.xib */,
@@ -3931,7 +3928,6 @@
 				F7F54CEF1E5B14C700E19C62 /* ImageSelectedSmallOff@2x.png in Resources */,
 				F7F54CFF1E5B14C700E19C62 /* UIBarButtonItemArrowRight@3x.png in Resources */,
 				F774DF0F1FCC26BE002AF9FC /* iTunesArtwork@1x.png in Resources */,
-				F70BE2592184581000425587 /* NCOfflineHeaderMenu.xib in Resources */,
 				F7632FE321836A7100721B71 /* NCOfflineGridCell.xib in Resources */,
 				F77B0F611D118A16002130FE /* Acknowledgements.rtf in Resources */,
 				F77B0F631D118A16002130FE /* Localizable.strings in Resources */,

iOSClient/Offline/NCOffline.swift

@@ -38,7 +38,6 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
     var gridLayout: GridLayoutOffline!
     
     private let headerMenuHeight: CGFloat = 50
-    private let sectionHeaderMenuHeight: CGFloat = 100
     private let sectionHeaderHeight: CGFloat = 20
     private let footerHeight: CGFloat = 50
 
@@ -52,7 +51,6 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
         collectionView.register(UINib.init(nibName: "NCOfflineGridCell", bundle: nil), forCellWithReuseIdentifier: "cell-grid")
         
         // Header
-        collectionView.register(UINib.init(nibName: "NCOfflineHeaderMenu", bundle: nil), forSupplementaryViewOfKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: "headerMenu")
         collectionView.register(UINib.init(nibName: "NCOfflineSectionHeaderMenu", bundle: nil), forSupplementaryViewOfKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: "sectionHeaderMenu")
         collectionView.register(UINib.init(nibName: "NCOfflineSectionHeader", bundle: nil), forSupplementaryViewOfKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: "sectionHeader")
         
@@ -211,8 +209,8 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
         menuView?.tableView.alwaysBounceVertical = false
         menuView?.tableViewBackgroundColor = UIColor.white
         
-        let header = (sender as? UIButton)?.superview as! NCOfflineSectionHeaderMenu
-        let headerRect = self.collectionView.convert(header.bounds, from: self.view)
+        let header = (sender as? UIButton)?.superview
+        let headerRect = self.collectionView.convert(header!.bounds, from: self.view)
         let menuOffsetY =  headerRect.height - headerRect.origin.y - 2
         menuView?.topOffsetY = CGFloat(menuOffsetY)
         
@@ -247,8 +245,8 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
         menuView?.rowHeight = 50
         menuView?.tableView.alwaysBounceVertical = false
         
-        let header = (sender as? UIButton)?.superview as! NCOfflineSectionHeaderMenu
-        let headerRect = self.collectionView.convert(header.bounds, from: self.view)
+        let header = (sender as? UIButton)?.superview
+        let headerRect = self.collectionView.convert(header!.bounds, from: self.view)
         let menuOffsetY =  headerRect.height - headerRect.origin.y - 2
         menuView?.topOffsetY = CGFloat(menuOffsetY)
         
@@ -434,10 +432,7 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
             
             if kind == UICollectionView.elementKindSectionHeader {
                 
-                var identifier = "headerMenu"
-                if CCUtility.getGroupBySettings() != "none" { identifier = "sectionHeaderMenu" }
-                
-                let header = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: identifier, for: indexPath) as! NCOfflineSectionHeaderMenu
+                let header = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "sectionHeaderMenu", for: indexPath) as! NCOfflineSectionHeaderMenu
                 
                 if collectionView.collectionViewLayout == gridLayout {
                     header.buttonSwitch.setImage(CCGraphics.changeThemingColorImage(UIImage.init(named: "switchList"), multiplier: 2, color: NCBrandColor.sharedInstance.icon), for: .normal)
@@ -450,13 +445,22 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
                 header.setStatusButton(count: sectionDatasource.allFileID.count)
                 header.setTitleOrder(datasourceSorted: CCUtility.getOrderSettings(), datasourceAscending: CCUtility.getAscendingSettings())
                 
+                if CCUtility.getGroupBySettings() == "none" {
+                    header.labelSection.isHidden = true
+                    header.labelSectionHeightConstraint.constant = 0
+                } else {
+                    header.labelSection.isHidden = false
+                    header.setTitleLabel(sectionDatasource: sectionDatasource, section: indexPath.section)
+                    header.labelSectionHeightConstraint.constant = sectionHeaderHeight
+                }
+         
                 return header
             
             } else {
                 
                 let footer = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "footer", for: indexPath) as! NCOfflineFooter
                 
-                footer.setTitleLabelFooter(sectionDatasource: sectionDatasource)
+                footer.setTitleLabel(sectionDatasource: sectionDatasource)
                 
                 return footer
             }
@@ -466,13 +470,16 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
             if kind == UICollectionView.elementKindSectionHeader {
                 
                 let header = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "sectionHeader", for: indexPath) as! NCOfflineSectionHeader
+                
+                header.setTitleLabel(sectionDatasource: sectionDatasource, section: indexPath.section)
+                
                 return header
                 
             } else {
                 
                 let footer = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "footer", for: indexPath) as! NCOfflineFooter
                 
-                footer.setTitleLabelFooter(sectionDatasource: sectionDatasource)
+                footer.setTitleLabel(sectionDatasource: sectionDatasource)
 
                 return footer
             }
@@ -484,7 +491,7 @@ class NCOffline: UIViewController ,UICollectionViewDataSource, UICollectionViewD
             if CCUtility.getGroupBySettings() == "none" {
                 return CGSize(width: collectionView.frame.width, height: headerMenuHeight)
             } else {
-                return CGSize(width: collectionView.frame.width, height: sectionHeaderMenuHeight)
+                return CGSize(width: collectionView.frame.width, height: headerMenuHeight + sectionHeaderHeight)
             }
         } else {
             return CGSize(width: collectionView.frame.width, height: sectionHeaderHeight)

iOSClient/Offline/Section/NCOfflineFooter.xib

@@ -30,7 +30,7 @@
             </constraints>
             <viewLayoutGuide key="safeArea" id="EFn-SN-cxu"/>
             <connections>
-                <outlet property="labelFooter" destination="gzy-cT-Gjn" id="1qE-fl-mMB"/>
+                <outlet property="labelSection" destination="gzy-cT-Gjn" id="hhG-DH-GJc"/>
             </connections>
         </collectionReusableView>
     </objects>

iOSClient/Offline/Section/NCOfflineHeaderFooter.swift

@@ -29,7 +29,9 @@ class NCOfflineSectionHeaderMenu: UICollectionReusableView {
     @IBOutlet weak var buttonSwitch: UIButton!
     @IBOutlet weak var buttonOrder: UIButton!
     @IBOutlet weak var buttonOrderWidthConstraint: NSLayoutConstraint!
+    @IBOutlet weak var viewLabelSection: UIView!
     @IBOutlet weak var labelSection: UILabel!
+    @IBOutlet weak var labelSectionHeightConstraint: NSLayoutConstraint!
     @IBOutlet weak var separator: UIView!
     
     var delegate: NCOfflineHeaderDelegate?
@@ -44,6 +46,8 @@ class NCOfflineSectionHeaderMenu: UICollectionReusableView {
         
         buttonMore.setImage(CCGraphics.changeThemingColorImage(UIImage.init(named: "more"), multiplier: 2, color: NCBrandColor.sharedInstance.icon), for: .normal)
         
+        viewLabelSection.backgroundColor = NCBrandColor.sharedInstance.brand.withAlphaComponent(0.1)
+        
         separator.backgroundColor = NCBrandColor.sharedInstance.seperator
     }
     
@@ -73,6 +77,27 @@ class NCOfflineSectionHeaderMenu: UICollectionReusableView {
         buttonOrderWidthConstraint.constant = size.width + 5
     }
     
+    func setTitleLabel(sectionDatasource: CCSectionDataSourceMetadata, section: Int) {
+        
+        var title = ""
+        
+        if sectionDatasource.sections.object(at: section) is String {
+            title = sectionDatasource.sections.object(at: section) as! String
+        }
+        if sectionDatasource.sections.object(at: section) is Date {
+            let titleDate = sectionDatasource.sections.object(at: section) as! Date
+            title = CCUtility.getTitleSectionDate(titleDate)
+        }
+        
+        if title.contains("download") {
+            labelSection.text = NSLocalizedString("_title_section_download_", comment: "")
+        } else if title.contains("upload") {
+            labelSection.text = NSLocalizedString("_title_section_upload_", comment: "")
+        } else {
+            labelSection.text = NSLocalizedString(title, comment: "")
+        }
+    }
+    
     func setStatusButton(count: Int) {
         
         if count == 0 {
@@ -112,21 +137,43 @@ class NCOfflineSectionHeader: UICollectionReusableView {
     override func awakeFromNib() {
         super.awakeFromNib()
         
-        self.backgroundColor = NCBrandColor.sharedInstance.brand.withAlphaComponent(0.2)
+        self.backgroundColor = NCBrandColor.sharedInstance.brand.withAlphaComponent(0.1)
+    }
+    
+    func setTitleLabel(sectionDatasource: CCSectionDataSourceMetadata, section: Int) {
+        
+        var title = ""
+        
+        if sectionDatasource.sections.object(at: section) is String {
+            title = sectionDatasource.sections.object(at: section) as! String
+        }
+        if sectionDatasource.sections.object(at: section) is Date {
+            let titleDate = sectionDatasource.sections.object(at: section) as! Date
+            title = CCUtility.getTitleSectionDate(titleDate)
+        }
+        
+        if title.contains("download") {
+            labelSection.text = NSLocalizedString("_title_section_download_", comment: "")
+        } else if title.contains("upload") {
+            labelSection.text = NSLocalizedString("_title_section_upload_", comment: "")
+        } else {
+            labelSection.text = NSLocalizedString(title, comment: "")
+        }
     }
 }
 
 class NCOfflineFooter: UICollectionReusableView {
     
-    @IBOutlet weak var labelFooter: UILabel!
+    @IBOutlet weak var labelSection: UILabel!
 
     override func awakeFromNib() {
         super.awakeFromNib()
         
-        labelFooter.textColor = NCBrandColor.sharedInstance.icon
+        self.backgroundColor = UIColor.clear
+        labelSection.textColor = NCBrandColor.sharedInstance.icon
     }
     
-    func setTitleLabelFooter(sectionDatasource: CCSectionDataSourceMetadata) {
+    func setTitleLabel(sectionDatasource: CCSectionDataSourceMetadata) {
         
         var foldersText = ""
         var filesText = ""
@@ -144,11 +191,11 @@ class NCOfflineFooter: UICollectionReusableView {
         }
         
         if foldersText == "" {
-            labelFooter.text = filesText
+            labelSection.text = filesText
         } else if filesText == "" {
-            labelFooter.text = foldersText
+            labelSection.text = foldersText
         } else {
-            labelFooter.text = foldersText + ", " + filesText
+            labelSection.text = foldersText + ", " + filesText
         }
     }
 }

iOSClient/Offline/Section/NCOfflineHeaderMenu.xib

@@ -1,89 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="14313.18" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
-    <device id="retina4_7" orientation="portrait">
-        <adaptation id="fullscreen"/>
-    </device>
-    <dependencies>
-        <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14283.14"/>
-        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
-        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
-    </dependencies>
-    <objects>
-        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
-        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
-        <collectionReusableView opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" reuseIdentifier="headerMenu" id="tys-A2-nDX" customClass="NCOfflineSectionHeaderMenu" customModule="Nextcloud" customModuleProvider="target">
-            <rect key="frame" x="0.0" y="0.0" width="375" height="50"/>
-            <autoresizingMask key="autoresizingMask"/>
-            <subviews>
-                <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="LZu-Te-clJ" userLabel="Separator">
-                    <rect key="frame" x="0.0" y="48" width="375" height="1"/>
-                    <color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
-                    <color key="tintColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
-                    <constraints>
-                        <constraint firstAttribute="height" constant="1" id="VuP-sT-hUI"/>
-                    </constraints>
-                </view>
-                <button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="1LD-cd-zhc" userLabel="buttonSwitch">
-                    <rect key="frame" x="12" y="12.5" width="25" height="25"/>
-                    <constraints>
-                        <constraint firstAttribute="width" constant="25" id="D76-X9-Tw9"/>
-                        <constraint firstAttribute="height" constant="25" id="izT-Ru-XYG"/>
-                    </constraints>
-                    <state key="normal" image="switchList"/>
-                    <connections>
-                        <action selector="touchUpInsideSwitch:" destination="tys-A2-nDX" eventType="touchUpInside" id="iT8-1j-fib"/>
-                    </connections>
-                </button>
-                <button hidden="YES" opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="D0O-wK-14O" userLabel="buttonSwitch">
-                    <rect key="frame" x="338" y="12.5" width="25" height="25"/>
-                    <constraints>
-                        <constraint firstAttribute="width" constant="25" id="aEr-j8-JDO"/>
-                        <constraint firstAttribute="height" constant="25" id="bvx-Uh-NWD"/>
-                    </constraints>
-                    <state key="normal" image="moreBig"/>
-                    <connections>
-                        <action selector="touchUpInsideMore:" destination="tys-A2-nDX" eventType="touchUpInside" id="Jyu-Mx-nWq"/>
-                    </connections>
-                </button>
-                <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="0bo-yl-t5k" userLabel="buttonOrder">
-                    <rect key="frame" x="55" y="11" width="230" height="28"/>
-                    <constraints>
-                        <constraint firstAttribute="width" constant="230" id="jvv-Ug-l3I"/>
-                    </constraints>
-                    <fontDescription key="fontDescription" type="system" pointSize="13"/>
-                    <state key="normal" title="Sort by name (from A to Z)">
-                        <color key="titleColor" cocoaTouchSystemColor="darkTextColor"/>
-                    </state>
-                    <connections>
-                        <action selector="touchUpInsideOrder:" destination="tys-A2-nDX" eventType="touchUpInside" id="oiL-3O-hMQ"/>
-                    </connections>
-                </button>
-            </subviews>
-            <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
-            <constraints>
-                <constraint firstItem="D0O-wK-14O" firstAttribute="centerY" secondItem="tys-A2-nDX" secondAttribute="centerY" id="6w7-ws-gX3"/>
-                <constraint firstAttribute="trailing" secondItem="LZu-Te-clJ" secondAttribute="trailing" id="7ww-Zl-sES"/>
-                <constraint firstAttribute="trailing" secondItem="D0O-wK-14O" secondAttribute="trailing" constant="12" id="AsZ-tP-fP1"/>
-                <constraint firstItem="LZu-Te-clJ" firstAttribute="leading" secondItem="tys-A2-nDX" secondAttribute="leading" id="ZEl-Ij-nt8"/>
-                <constraint firstItem="1LD-cd-zhc" firstAttribute="leading" secondItem="tys-A2-nDX" secondAttribute="leading" constant="12" id="dHo-I3-Z1V"/>
-                <constraint firstItem="1LD-cd-zhc" firstAttribute="centerY" secondItem="tys-A2-nDX" secondAttribute="centerY" id="hbd-cO-eBq"/>
-                <constraint firstItem="0bo-yl-t5k" firstAttribute="centerY" secondItem="tys-A2-nDX" secondAttribute="centerY" id="kSZ-op-97F"/>
-                <constraint firstAttribute="bottom" secondItem="LZu-Te-clJ" secondAttribute="bottom" constant="1" id="tJp-qc-NGO"/>
-                <constraint firstItem="0bo-yl-t5k" firstAttribute="leading" secondItem="1LD-cd-zhc" secondAttribute="trailing" constant="18" id="zlZ-IN-gGx"/>
-            </constraints>
-            <viewLayoutGuide key="safeArea" id="pm7-uW-mZE"/>
-            <connections>
-                <outlet property="buttonMore" destination="D0O-wK-14O" id="eEx-3R-zCS"/>
-                <outlet property="buttonOrder" destination="0bo-yl-t5k" id="Kbw-BG-73C"/>
-                <outlet property="buttonOrderWidthConstraint" destination="jvv-Ug-l3I" id="E6N-z6-2VC"/>
-                <outlet property="buttonSwitch" destination="1LD-cd-zhc" id="Ec2-cM-CoY"/>
-                <outlet property="separator" destination="LZu-Te-clJ" id="EwO-za-LxT"/>
-            </connections>
-        </collectionReusableView>
-    </objects>
-    <resources>
-        <image name="moreBig" width="80" height="80"/>
-        <image name="switchList" width="25" height="25"/>
-    </resources>
-</document>

iOSClient/Offline/Section/NCOfflineSectionHeaderMenu.xib

@@ -13,71 +13,97 @@
         <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
         <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
         <collectionReusableView opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" reuseIdentifier="sectionHeaderMenu" id="tys-A2-nDX" customClass="NCOfflineSectionHeaderMenu" customModule="Nextcloud" customModuleProvider="target">
-            <rect key="frame" x="0.0" y="0.0" width="375" height="153"/>
+            <rect key="frame" x="0.0" y="0.0" width="375" height="163"/>
             <autoresizingMask key="autoresizingMask"/>
             <subviews>
-                <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="LZu-Te-clJ" userLabel="Separator">
-                    <rect key="frame" x="0.0" y="151" width="375" height="1"/>
-                    <color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
-                    <color key="tintColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="QBu-GJ-Y52">
+                    <rect key="frame" x="0.0" y="0.0" width="375" height="113"/>
+                    <subviews>
+                        <button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="1LD-cd-zhc" userLabel="buttonSwitch">
+                            <rect key="frame" x="12" y="44" width="25" height="25"/>
+                            <constraints>
+                                <constraint firstAttribute="width" constant="25" id="D76-X9-Tw9"/>
+                                <constraint firstAttribute="height" constant="25" id="izT-Ru-XYG"/>
+                            </constraints>
+                            <state key="normal" image="switchList"/>
+                            <connections>
+                                <action selector="touchUpInsideSwitch:" destination="tys-A2-nDX" eventType="touchUpInside" id="iT8-1j-fib"/>
+                            </connections>
+                        </button>
+                        <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="0bo-yl-t5k" userLabel="buttonOrder">
+                            <rect key="frame" x="55" y="42.5" width="230" height="28"/>
+                            <constraints>
+                                <constraint firstAttribute="width" constant="230" id="jvv-Ug-l3I"/>
+                            </constraints>
+                            <fontDescription key="fontDescription" type="system" pointSize="13"/>
+                            <state key="normal" title="Sort by name (from A to Z)">
+                                <color key="titleColor" cocoaTouchSystemColor="darkTextColor"/>
+                            </state>
+                            <connections>
+                                <action selector="touchUpInsideOrder:" destination="tys-A2-nDX" eventType="touchUpInside" id="oiL-3O-hMQ"/>
+                            </connections>
+                        </button>
+                        <button hidden="YES" opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="D0O-wK-14O" userLabel="buttonSwitch">
+                            <rect key="frame" x="338" y="44" width="25" height="25"/>
+                            <constraints>
+                                <constraint firstAttribute="width" constant="25" id="aEr-j8-JDO"/>
+                                <constraint firstAttribute="height" constant="25" id="bvx-Uh-NWD"/>
+                            </constraints>
+                            <state key="normal" image="moreBig"/>
+                            <connections>
+                                <action selector="touchUpInsideMore:" destination="tys-A2-nDX" eventType="touchUpInside" id="Jyu-Mx-nWq"/>
+                            </connections>
+                        </button>
+                        <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="LZu-Te-clJ" userLabel="Separator">
+                            <rect key="frame" x="0.0" y="112" width="375" height="1"/>
+                            <color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                            <color key="tintColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                            <constraints>
+                                <constraint firstAttribute="height" constant="1" id="VuP-sT-hUI"/>
+                            </constraints>
+                        </view>
+                    </subviews>
+                    <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
                     <constraints>
-                        <constraint firstAttribute="height" constant="1" id="VuP-sT-hUI"/>
+                        <constraint firstItem="1LD-cd-zhc" firstAttribute="leading" secondItem="QBu-GJ-Y52" secondAttribute="leading" constant="12" id="3bI-Ld-Ddl"/>
+                        <constraint firstAttribute="trailing" secondItem="LZu-Te-clJ" secondAttribute="trailing" id="4Ue-ug-B6K"/>
+                        <constraint firstItem="1LD-cd-zhc" firstAttribute="centerY" secondItem="QBu-GJ-Y52" secondAttribute="centerY" id="AJf-bs-tiq"/>
+                        <constraint firstAttribute="bottom" secondItem="LZu-Te-clJ" secondAttribute="bottom" id="DDK-aB-wEh"/>
+                        <constraint firstItem="LZu-Te-clJ" firstAttribute="leading" secondItem="QBu-GJ-Y52" secondAttribute="leading" id="c4q-XY-3mD"/>
+                        <constraint firstItem="D0O-wK-14O" firstAttribute="centerY" secondItem="QBu-GJ-Y52" secondAttribute="centerY" id="d0X-sZ-v5c"/>
+                        <constraint firstItem="0bo-yl-t5k" firstAttribute="centerY" secondItem="QBu-GJ-Y52" secondAttribute="centerY" id="d2r-aK-x8q"/>
+                        <constraint firstAttribute="trailing" secondItem="D0O-wK-14O" secondAttribute="trailing" constant="12" id="qZw-Ob-In1"/>
+                        <constraint firstItem="0bo-yl-t5k" firstAttribute="leading" secondItem="1LD-cd-zhc" secondAttribute="trailing" constant="18" id="tBF-23-TJ4"/>
                     </constraints>
                 </view>
-                <button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="1LD-cd-zhc" userLabel="buttonSwitch">
-                    <rect key="frame" x="12" y="64" width="25" height="25"/>
+                <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="NC1-5C-E5z">
+                    <rect key="frame" x="0.0" y="113" width="375" height="50"/>
+                    <subviews>
+                        <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="PVg-rp-dMy">
+                            <rect key="frame" x="10" y="18" width="355" height="14.5"/>
+                            <fontDescription key="fontDescription" type="system" pointSize="12"/>
+                            <nil key="textColor"/>
+                            <nil key="highlightedColor"/>
+                        </label>
+                    </subviews>
+                    <color key="backgroundColor" red="1" green="0.5" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                     <constraints>
-                        <constraint firstAttribute="width" constant="25" id="D76-X9-Tw9"/>
-                        <constraint firstAttribute="height" constant="25" id="izT-Ru-XYG"/>
+                        <constraint firstAttribute="trailing" secondItem="PVg-rp-dMy" secondAttribute="trailing" constant="10" id="Rup-Kj-YB9"/>
+                        <constraint firstItem="PVg-rp-dMy" firstAttribute="leading" secondItem="NC1-5C-E5z" secondAttribute="leading" constant="10" id="VT2-KQ-3Rs"/>
+                        <constraint firstAttribute="height" constant="50" id="eT3-4m-mJ6"/>
+                        <constraint firstItem="PVg-rp-dMy" firstAttribute="centerY" secondItem="NC1-5C-E5z" secondAttribute="centerY" id="kJS-Jt-w50"/>
                     </constraints>
-                    <state key="normal" image="switchList"/>
-                    <connections>
-                        <action selector="touchUpInsideSwitch:" destination="tys-A2-nDX" eventType="touchUpInside" id="iT8-1j-fib"/>
-                    </connections>
-                </button>
-                <button hidden="YES" opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="D0O-wK-14O" userLabel="buttonSwitch">
-                    <rect key="frame" x="338" y="64" width="25" height="25"/>
-                    <constraints>
-                        <constraint firstAttribute="width" constant="25" id="aEr-j8-JDO"/>
-                        <constraint firstAttribute="height" constant="25" id="bvx-Uh-NWD"/>
-                    </constraints>
-                    <state key="normal" image="moreBig"/>
-                    <connections>
-                        <action selector="touchUpInsideMore:" destination="tys-A2-nDX" eventType="touchUpInside" id="Jyu-Mx-nWq"/>
-                    </connections>
-                </button>
-                <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="0bo-yl-t5k" userLabel="buttonOrder">
-                    <rect key="frame" x="55" y="62.5" width="230" height="28"/>
-                    <constraints>
-                        <constraint firstAttribute="width" constant="230" id="jvv-Ug-l3I"/>
-                    </constraints>
-                    <fontDescription key="fontDescription" type="system" pointSize="13"/>
-                    <state key="normal" title="Sort by name (from A to Z)">
-                        <color key="titleColor" cocoaTouchSystemColor="darkTextColor"/>
-                    </state>
-                    <connections>
-                        <action selector="touchUpInsideOrder:" destination="tys-A2-nDX" eventType="touchUpInside" id="oiL-3O-hMQ"/>
-                    </connections>
-                </button>
-                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" fixedFrame="YES" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="1yB-zO-8wr">
-                    <rect key="frame" x="12" y="112" width="42" height="21"/>
-                    <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
-                    <fontDescription key="fontDescription" type="system" pointSize="17"/>
-                    <nil key="textColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
+                </view>
             </subviews>
             <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
             <constraints>
-                <constraint firstItem="D0O-wK-14O" firstAttribute="centerY" secondItem="tys-A2-nDX" secondAttribute="centerY" id="6w7-ws-gX3"/>
-                <constraint firstAttribute="trailing" secondItem="LZu-Te-clJ" secondAttribute="trailing" id="7ww-Zl-sES"/>
-                <constraint firstAttribute="trailing" secondItem="D0O-wK-14O" secondAttribute="trailing" constant="12" id="AsZ-tP-fP1"/>
-                <constraint firstItem="LZu-Te-clJ" firstAttribute="leading" secondItem="tys-A2-nDX" secondAttribute="leading" id="ZEl-Ij-nt8"/>
-                <constraint firstItem="1LD-cd-zhc" firstAttribute="leading" secondItem="tys-A2-nDX" secondAttribute="leading" constant="12" id="dHo-I3-Z1V"/>
-                <constraint firstItem="1LD-cd-zhc" firstAttribute="centerY" secondItem="tys-A2-nDX" secondAttribute="centerY" id="hbd-cO-eBq"/>
-                <constraint firstItem="0bo-yl-t5k" firstAttribute="centerY" secondItem="tys-A2-nDX" secondAttribute="centerY" id="kSZ-op-97F"/>
-                <constraint firstAttribute="bottom" secondItem="LZu-Te-clJ" secondAttribute="bottom" constant="1" id="tJp-qc-NGO"/>
-                <constraint firstItem="0bo-yl-t5k" firstAttribute="leading" secondItem="1LD-cd-zhc" secondAttribute="trailing" constant="18" id="zlZ-IN-gGx"/>
+                <constraint firstItem="QBu-GJ-Y52" firstAttribute="leading" secondItem="pm7-uW-mZE" secondAttribute="leading" id="2Jt-JT-Jbi"/>
+                <constraint firstItem="pm7-uW-mZE" firstAttribute="bottom" secondItem="NC1-5C-E5z" secondAttribute="bottom" id="35N-28-6Fp"/>
+                <constraint firstItem="NC1-5C-E5z" firstAttribute="top" secondItem="QBu-GJ-Y52" secondAttribute="bottom" id="B4d-JR-jzS"/>
+                <constraint firstItem="pm7-uW-mZE" firstAttribute="trailing" secondItem="QBu-GJ-Y52" secondAttribute="trailing" id="Km2-dk-R7v"/>
+                <constraint firstItem="NC1-5C-E5z" firstAttribute="leading" secondItem="pm7-uW-mZE" secondAttribute="leading" id="QpF-nE-s7J"/>
+                <constraint firstItem="pm7-uW-mZE" firstAttribute="trailing" secondItem="NC1-5C-E5z" secondAttribute="trailing" id="UH6-8N-JUD"/>
+                <constraint firstItem="QBu-GJ-Y52" firstAttribute="top" secondItem="pm7-uW-mZE" secondAttribute="top" id="auA-nX-bqB"/>
             </constraints>
             <viewLayoutGuide key="safeArea" id="pm7-uW-mZE"/>
             <connections>
@@ -85,10 +111,12 @@
                 <outlet property="buttonOrder" destination="0bo-yl-t5k" id="Kbw-BG-73C"/>
                 <outlet property="buttonOrderWidthConstraint" destination="jvv-Ug-l3I" id="E6N-z6-2VC"/>
                 <outlet property="buttonSwitch" destination="1LD-cd-zhc" id="Ec2-cM-CoY"/>
-                <outlet property="labelSection" destination="1yB-zO-8wr" id="Tqb-N6-ewI"/>
+                <outlet property="labelSection" destination="PVg-rp-dMy" id="wrp-Tl-oBd"/>
+                <outlet property="labelSectionHeightConstraint" destination="eT3-4m-mJ6" id="e31-Et-7U1"/>
                 <outlet property="separator" destination="LZu-Te-clJ" id="EwO-za-LxT"/>
+                <outlet property="viewLabelSection" destination="NC1-5C-E5z" id="FXG-Lp-IGJ"/>
             </connections>
-            <point key="canvasLocation" x="138.40000000000001" y="190.25487256371815"/>
+            <point key="canvasLocation" x="138.40000000000001" y="194.75262368815595"/>
         </collectionReusableView>
     </objects>
     <resources>