From 26cbc4c1e5ec35e6f9ecbdfc36d1bb2bb3aff8c7 Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:26:46 +0100
Subject: [PATCH 1/7] VLCPagingViewController: Update the constraints
The buttonBarView's constraints are now aligned with the safe area
witout the use of left and right anchors.
The containerView's bottom constraint is now aligned with the view's
bottom anchor to properly show the container over the safe area since
the bottom bar is hidden.
---
.../View Controller/VLCPagingViewController.swift | 14 +++++++-------
1 file changed, 7 insertions(+), 7 deletions(-)
diff --git a/Sources/UI Elements/View Controller/VLCPagingViewController.swift b/Sources/UI Elements/View Controller/VLCPagingViewController.swift
index 3c5b5418b..5e217cd87 100644
--- a/Sources/UI Elements/View Controller/VLCPagingViewController.swift
+++ b/Sources/UI Elements/View Controller/VLCPagingViewController.swift
@@ -74,19 +74,19 @@ class VLCPagingViewController<ButtonBarCellType: UICollectionViewCell>: PagerTab
buttonBarView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(buttonBarView)
NSLayoutConstraint.activate([
- buttonBarView.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor),
- buttonBarView.rightAnchor.constraint(equalTo: view.rightAnchor),
- buttonBarView.leftAnchor.constraint(equalTo: view.leftAnchor),
+ buttonBarView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
+ buttonBarView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
+ buttonBarView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
buttonBarView.heightAnchor.constraint(equalToConstant: buttonbarViewHeight)
- ])
+ ])
+
// make sure that top and bottom are not covered by tabbar and navigationbar
NSLayoutConstraint.activate([
containerView.topAnchor.constraint(equalTo: buttonBarView.bottomAnchor),
containerView.rightAnchor.constraint(equalTo: view.rightAnchor),
containerView.leftAnchor.constraint(equalTo: view.leftAnchor),
- containerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
- ]
- )
+ containerView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
+ ])
buttonBarView.delegate = self
buttonBarView.dataSource = self
--
GitLab
From 7ba5b3c41081593210e938c7c507e7cf7fc86248 Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:31:05 +0100
Subject: [PATCH 2/7] VLCPlayerDisplayController: Update the mini player
constraints
The mini player's bottom constraint is now aligned with the
rootViewController in order to properly display the player
when the bottom tab bar is hidden.
---
Sources/Playback/Control/VLCPlayerDisplayController.m | 5 ++---
1 file changed, 2 insertions(+), 3 deletions(-)
diff --git a/Sources/Playback/Control/VLCPlayerDisplayController.m b/Sources/Playback/Control/VLCPlayerDisplayController.m
index 5153a0b72..fa67fd85c 100644
--- a/Sources/Playback/Control/VLCPlayerDisplayController.m
+++ b/Sources/Playback/Control/VLCPlayerDisplayController.m
@@ -432,13 +432,12 @@ NSString *const VLCPlayerDisplayControllerHideMiniPlayer = @"VLCPlayerDisplayCon
needsHide = YES;
needsShow = NO;
}
+ UIViewController *rootViewController = UIApplication.sharedApplication.keyWindow.rootViewController;
void (^completionBlock)(BOOL) = nil;
if (needsShow) {
// Init the mini player view if needed
if (!miniPlaybackView) {
- UIViewController *rootViewController = UIApplication.sharedApplication.keyWindow.rootViewController;
-
// Until VideoMiniPlayer is integrated, only AudioMiniPlayer is used.
self.miniPlaybackView = miniPlaybackView = [[VLCAudioMiniPlayer alloc] initWithService:[VLCAppCoordinator sharedInstance].mediaLibraryService
draggingDelegate:self];
@@ -514,7 +513,7 @@ NSString *const VLCPlayerDisplayControllerHideMiniPlayer = @"VLCPlayerDisplayCon
animations:^{
self.bottomConstraint.active = NO;
if (needsShow) {
- self.bottomConstraint = [miniPlaybackView.bottomAnchor constraintEqualToAnchor:self.realBottomAnchor];
+ self.bottomConstraint = [miniPlaybackView.bottomAnchor constraintEqualToAnchor:rootViewController.view.safeAreaLayoutGuide.bottomAnchor];
} else {
self.bottomConstraint = [miniPlaybackView.topAnchor constraintEqualToAnchor:self.bottomLayoutGuide.bottomAnchor];
}
--
GitLab
From 43cef21633eacd39f0bffbe8baa49e9fea659095 Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:34:20 +0100
Subject: [PATCH 3/7] MediaCategoryViewController: Align the constraints to the
safe area
The collection view and search bar constraints are now aligned to the
safe area to avoid any unexpected offset when the side bar will be
displayed.
---
.../MediaCategories/MediaCategoryViewController.swift | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/Sources/Media Library/MediaCategories/MediaCategoryViewController.swift b/Sources/Media Library/MediaCategories/MediaCategoryViewController.swift
index 362634390..af6526404 100644
--- a/Sources/Media Library/MediaCategories/MediaCategoryViewController.swift
+++ b/Sources/Media Library/MediaCategories/MediaCategoryViewController.swift
@@ -295,8 +295,8 @@ class MediaCategoryViewController: UICollectionViewController, UISearchBarDelega
NSLayoutConstraint.activate([
collectionView.topAnchor.constraint(equalTo: view.topAnchor, constant: -constant),
- collectionView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
- collectionView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
+ collectionView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
+ collectionView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
collectionView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])
@@ -325,7 +325,7 @@ class MediaCategoryViewController: UICollectionViewController, UISearchBarDelega
NSLayoutConstraint.activate([
searchBarConstraint!,
searchBar.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 10),
- searchBar.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -10),
+ searchBar.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: -10),
searchBar.heightAnchor.constraint(equalToConstant: searchBarSize)
])
}
--
GitLab
From 84b33a4804e185201702a2b43c3d10714ab0418c Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:36:12 +0100
Subject: [PATCH 4/7] PresentationTheme: Add a color for the tab bar icons
The tab bar icons now have a proper color that can be set when new
tabs are created.
---
Sources/UI Elements/PresentationTheme.swift | 6 ++++++
1 file changed, 6 insertions(+)
diff --git a/Sources/UI Elements/PresentationTheme.swift b/Sources/UI Elements/PresentationTheme.swift
index e3a10b192..875c4bf9e 100644
--- a/Sources/UI Elements/PresentationTheme.swift
+++ b/Sources/UI Elements/PresentationTheme.swift
@@ -34,6 +34,7 @@ extension Notification.Name {
let separatorColor: UIColor
let mediaCategorySeparatorColor: UIColor
let tabBarColor: UIColor
+ let tabBarIconColor: UIColor
let orangeUI: UIColor
let orangeDarkAccent: UIColor
let toolBarStyle: UIBarStyle
@@ -57,6 +58,7 @@ extension Notification.Name {
separatorColor: UIColor,
mediaCategorySeparatorColor: UIColor,
tabBarColor: UIColor,
+ tabBarIconColor: UIColor,
orangeUI: UIColor,
orangeDarkAccent: UIColor,
toolBarStyle: UIBarStyle,
@@ -79,6 +81,7 @@ extension Notification.Name {
self.separatorColor = separatorColor
self.mediaCategorySeparatorColor = mediaCategorySeparatorColor
self.tabBarColor = tabBarColor
+ self.tabBarIconColor = tabBarIconColor
self.orangeUI = orangeUI
self.orangeDarkAccent = orangeDarkAccent
self.toolBarStyle = toolBarStyle
@@ -228,6 +231,7 @@ let brightPalette = ColorPalette(isDark: false,
separatorColor: UIColor(0xF0F2F7),
mediaCategorySeparatorColor: UIColor(0xECF2F6),
tabBarColor: UIColor(0xFFFFFF),
+ tabBarIconColor: UIColor(0x88949c),
orangeUI: UIColor(0xFF8800),
orangeDarkAccent: UIColor(0xFF8800),
toolBarStyle: UIBarStyle.default,
@@ -251,6 +255,7 @@ let darkPalette = ColorPalette(isDark: true,
separatorColor: UIColor(0x25292C),
mediaCategorySeparatorColor: UIColor(0x25292C),
tabBarColor: UIColor(0x25292C),
+ tabBarIconColor: UIColor(0x88949c),
orangeUI: UIColor(0xFF8800),
orangeDarkAccent: UIColor(0xD57200),
toolBarStyle: UIBarStyle.black,
@@ -274,6 +279,7 @@ let blackPalette = ColorPalette(isDark: true,
separatorColor: UIColor(0x25292C),
mediaCategorySeparatorColor: UIColor(0x25292C),
tabBarColor: UIColor(0x000000),
+ tabBarIconColor: UIColor(0x88949c),
orangeUI: UIColor(0xFF8800),
orangeDarkAccent: UIColor(0xD57200),
toolBarStyle: UIBarStyle.black,
--
GitLab
From 23fb83e03b38a390e8147575fcc9369e3a08ca03 Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:40:18 +0100
Subject: [PATCH 5/7] AudioViewController: Add a view controller for each audio
tab
A proper view controller is now handling each tab of the Audio section.
This can be used to create a proper navigation tab without having to use
the paging view controller.
---
.../albums.symbolset/Contents.json | 15 +++
.../albums.symbolset/square.stack.fill.svg | 125 ++++++++++++++++++
.../artists.symbolset/Contents.json | 15 +++
.../artists.symbolset/person.2.fill.svg | 113 ++++++++++++++++
.../genres.symbolset/Contents.json | 15 +++
.../genres.symbolset/guitars.fill.svg | 125 ++++++++++++++++++
.../songs.symbolset/Contents.json | 15 +++
.../songs.symbolset/music.note.svg | 101 ++++++++++++++
.../AudioViewController.swift | 104 +++++++++++++++
9 files changed, 628 insertions(+)
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/Contents.json
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/square.stack.fill.svg
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/Contents.json
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/person.2.fill.svg
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/Contents.json
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/guitars.fill.svg
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/Contents.json
create mode 100644 Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/music.note.svg
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/Contents.json b/Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/Contents.json
new file mode 100644
index 000000000..1a558abad
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/Contents.json
@@ -0,0 +1,15 @@
+{
+ "info" : {
+ "author" : "xcode",
+ "version" : 1
+ },
+ "properties" : {
+ "symbol-rendering-intent" : "multicolor"
+ },
+ "symbols" : [
+ {
+ "filename" : "square.stack.fill.svg",
+ "idiom" : "universal"
+ }
+ ]
+}
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/square.stack.fill.svg b/Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/square.stack.fill.svg
new file mode 100644
index 000000000..7ea9a48bb
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/albums.symbolset/square.stack.fill.svg
@@ -0,0 +1,125 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--Generator: Apple Native CoreSVG 341-->
+<!DOCTYPE svg
+PUBLIC "-//W3C//DTD SVG 1.1//EN"
+ "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3300 2200">
+ <!--glyph: "1019E1", point size: 100.0, font version: "20.0d10e1", template writer version: "138.0.0"-->
+ <style>.monochrome-0 {-sfsymbols-motion-group:2;-sfsymbols-layer-tags:square.stack.fill}
+.monochrome-1 {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:1;-sfsymbols-layer-tags:square.stack.fill}
+.monochrome-2 {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:square.stack.fill}
+.monochrome-3 {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:square.stack.fill}
+.monochrome-4 {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:square.stack.fill}
+
+.multicolor-0:tintColor {-sfsymbols-motion-group:2;-sfsymbols-layer-tags:square.stack.fill}
+.multicolor-1:tintColor {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:1;-sfsymbols-layer-tags:square.stack.fill}
+.multicolor-2:tintColor {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:square.stack.fill}
+.multicolor-3:tintColor {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:square.stack.fill}
+.multicolor-4:tintColor {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:square.stack.fill}
+
+.hierarchical-0:primary {-sfsymbols-motion-group:2;-sfsymbols-layer-tags:square.stack.fill}
+.hierarchical-1:primary {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:1;-sfsymbols-layer-tags:square.stack.fill}
+.hierarchical-2:primary {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:square.stack.fill}
+.hierarchical-3:primary {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:square.stack.fill}
+.hierarchical-4:primary {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:square.stack.fill}
+
+.SFSymbolsPreviewWireframe {fill:none;opacity:1.0;stroke:black;stroke-width:0.5}
+</style>
+ <g id="Notes">
+ <rect height="2200" id="artboard" style="fill:white;opacity:1" width="3300" x="0" y="0"/>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="292" y2="292"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 322)">Weight/Scale Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 559.711 322)">Ultralight</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 856.422 322)">Thin</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1153.13 322)">Light</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1449.84 322)">Regular</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1746.56 322)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2043.27 322)">Semibold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2339.98 322)">Bold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2636.69 322)">Heavy</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2933.4 322)">Black</text>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1903" y2="1903"/>
+ <g transform="matrix(0.2 0 0 0.2 263 1933)">
+ <path d="m46.2402 4.15039c21.7773 0 39.4531-17.627 39.4531-39.4043s-17.6758-39.4043-39.4531-39.4043c-21.7285 0-39.4043 17.627-39.4043 39.4043s17.6758 39.4043 39.4043 39.4043Zm0-7.42188c-17.6758 0-31.9336-14.3066-31.9336-31.9824s14.2578-31.9824 31.9336-31.9824 31.9824 14.3066 31.9824 31.9824-14.3066 31.9824-31.9824 31.9824Zm-17.9688-31.9824c0 2.14844 1.51367 3.61328 3.75977 3.61328h10.498v10.5957c0 2.19727 1.46484 3.71094 3.61328 3.71094 2.24609 0 3.71094-1.51367 3.71094-3.71094v-10.5957h10.5957c2.19727 0 3.71094-1.46484 3.71094-3.61328 0-2.19727-1.51367-3.71094-3.71094-3.71094h-10.5957v-10.5469c0-2.24609-1.46484-3.75977-3.71094-3.75977-2.14844 0-3.61328 1.51367-3.61328 3.75977v10.5469h-10.498c-2.24609 0-3.75977 1.51367-3.75977 3.71094Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 281.506 1933)">
+ <path d="m58.5449 14.5508c27.4902 0 49.8047-22.3145 49.8047-49.8047s-22.3145-49.8047-49.8047-49.8047-49.8047 22.3145-49.8047 49.8047 22.3145 49.8047 49.8047 49.8047Zm0-8.30078c-22.9492 0-41.5039-18.5547-41.5039-41.5039s18.5547-41.5039 41.5039-41.5039 41.5039 18.5547 41.5039 41.5039-18.5547 41.5039-41.5039 41.5039Zm-22.6562-41.5039c0 2.39258 1.66016 4.00391 4.15039 4.00391h14.3555v14.4043c0 2.44141 1.66016 4.15039 4.05273 4.15039 2.44141 0 4.15039-1.66016 4.15039-4.15039v-14.4043h14.4043c2.44141 0 4.15039-1.61133 4.15039-4.00391 0-2.44141-1.70898-4.15039-4.15039-4.15039h-14.4043v-14.3555c0-2.49023-1.70898-4.19922-4.15039-4.19922-2.39258 0-4.05273 1.70898-4.05273 4.19922v14.3555h-14.3555c-2.49023 0-4.15039 1.70898-4.15039 4.15039Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 304.924 1933)">
+ <path d="m74.8535 28.3203c35.1074 0 63.623-28.4668 63.623-63.5742s-28.5156-63.623-63.623-63.623-63.5742 28.5156-63.5742 63.623 28.4668 63.5742 63.5742 63.5742Zm0-9.08203c-30.127 0-54.4922-24.3652-54.4922-54.4922s24.3652-54.4922 54.4922-54.4922 54.4922 24.3652 54.4922 54.4922-24.3652 54.4922-54.4922 54.4922Zm-28.8574-54.4922c0 2.58789 1.85547 4.39453 4.58984 4.39453h19.7266v19.7754c0 2.68555 1.85547 4.58984 4.44336 4.58984 2.68555 0 4.54102-1.85547 4.54102-4.58984v-19.7754h19.7754c2.68555 0 4.58984-1.80664 4.58984-4.39453 0-2.73438-1.85547-4.58984-4.58984-4.58984h-19.7754v-19.7266c0-2.73438-1.85547-4.63867-4.54102-4.63867-2.58789 0-4.44336 1.9043-4.44336 4.63867v19.7266h-19.7266c-2.73438 0-4.58984 1.85547-4.58984 4.58984Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 1953)">Design Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1971)">Symbols are supported in up to nine weights and three scales.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1989)">For optimal layout with text and other symbols, vertically align</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 2007)">symbols with the adjacent text.</text>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="776" x2="776" y1="1919" y2="1933"/>
+ <g transform="matrix(0.2 0 0 0.2 776 1933)">
+ <path d="m16.5527 0.78125c2.58789 0 3.85742-0.976562 4.78516-3.71094l6.29883-17.2363h28.8086l6.29883 17.2363c0.927734 2.73438 2.19727 3.71094 4.73633 3.71094 2.58789 0 4.24805-1.5625 4.24805-4.00391 0-0.830078-0.146484-1.61133-0.537109-2.63672l-22.9004-60.9863c-1.12305-2.97852-3.125-4.49219-6.25-4.49219-3.02734 0-5.07812 1.46484-6.15234 4.44336l-22.9004 61.084c-0.390625 1.02539-0.537109 1.80664-0.537109 2.63672 0 2.44141 1.5625 3.95508 4.10156 3.95508Zm13.4766-28.3691 11.8652-32.8613h0.244141l11.8652 32.8613Z"/>
+ </g>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="792.836" x2="792.836" y1="1919" y2="1933"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 776 1953)">Margins</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1971)">Leading and trailing margins on the left and right side of each symbol</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1989)">can be adjusted by modifying the x-location of the margin guidelines.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2007)">Modifications are automatically applied proportionally to all</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2025)">scales and weights.</text>
+ <g transform="matrix(0.2 0 0 0.2 1289 1933)">
+ <path d="m14.209 9.32617 8.49609 8.54492c4.29688 4.3457 9.22852 4.05273 13.8672-1.07422l53.4668-58.9355-4.83398-4.88281-53.0762 58.3984c-1.75781 2.00195-3.41797 2.49023-5.76172 0.146484l-5.85938-5.81055c-2.34375-2.29492-1.80664-4.00391 0.195312-5.81055l57.373-54.0039-4.88281-4.83398-57.959 54.4434c-4.93164 4.58984-5.32227 9.47266-1.02539 13.8184Zm32.0801-90.9668c-2.09961 2.05078-2.24609 4.93164-1.07422 6.88477 1.17188 1.80664 3.4668 2.97852 6.68945 2.14844 7.32422-1.70898 14.9414-2.00195 22.0703 2.68555l-2.92969 7.27539c-1.70898 4.15039-0.830078 7.08008 1.85547 9.81445l11.4746 11.5723c2.44141 2.44141 4.49219 2.53906 7.32422 2.05078l5.32227-0.976562 3.32031 3.36914-0.195312 2.7832c-0.195312 2.49023 0.439453 4.39453 2.88086 6.78711l3.80859 3.71094c2.39258 2.39258 5.46875 2.53906 7.8125 0.195312l14.5508-14.5996c2.34375-2.34375 2.24609-5.32227-0.146484-7.71484l-3.85742-3.80859c-2.39258-2.39258-4.24805-3.17383-6.64062-2.97852l-2.88086 0.244141-3.22266-3.17383 1.2207-5.61523c0.634766-2.83203-0.146484-5.0293-3.07617-7.95898l-10.9863-10.9375c-16.6992-16.6016-38.8672-16.2109-53.3203-1.75781Zm7.4707 1.85547c12.1582-8.88672 28.6133-7.37305 39.7461 3.75977l12.1582 12.0605c1.17188 1.17188 1.36719 2.09961 1.02539 3.80859l-1.61133 7.42188 7.51953 7.42188 4.93164-0.292969c1.26953-0.0488281 1.66016 0.0488281 2.63672 1.02539l2.88086 2.88086-12.207 12.207-2.88086-2.88086c-0.976562-0.976562-1.12305-1.36719-1.07422-2.68555l0.341797-4.88281-7.4707-7.42188-7.61719 1.26953c-1.61133 0.341797-2.34375 0.195312-3.56445-0.976562l-10.0098-10.0098c-1.26953-1.17188-1.41602-2.00195-0.634766-3.85742l4.39453-10.4492c-7.8125-7.27539-17.9688-10.4004-28.125-7.42188-0.78125 0.195312-1.07422-0.439453-0.439453-0.976562Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 1289 1953)">Exporting</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1971)">Symbols should be outlined when exporting to ensure the</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1989)">design is preserved when submitting to Xcode.</text>
+ <text id="template-version" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1933)">Template v.5.0</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1951)">Requires Xcode 15 or greater</text>
+ <text id="descriptive-name" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1969)">Generated from square.stack.fill</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1987)">Typeset at 100.0 points</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 726)">Small</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1156)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1586)">Large</text>
+ </g>
+ <g id="Guides">
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 696)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="696" y2="696"/>
+ <line id="Capline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="625.541" y2="625.541"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1126)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1126" y2="1126"/>
+ <line id="Capline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1055.54" y2="1055.54"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1556)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1556" y2="1556"/>
+ <line id="Capline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1485.54" y2="1485.54"/>
+ <line id="right-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2979.84" x2="2979.84" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2886.96" x2="2886.96" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1493.64" x2="1493.64" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1406.05" x2="1406.05" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="600.672" x2="600.672" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="518.75" x2="518.75" y1="600.785" y2="720.121"/>
+ </g>
+ <g id="Symbols">
+ <g id="Black-S" transform="matrix(1 0 0 1 2886.96 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:primary SFSymbolsPreviewWireframe" d="M33.9355-44.0918L58.9355-44.0918C63.0859-44.0918 65.625-46.6797 65.625-50.7812L65.625-78.4668C65.625-82.6172 63.0859-85.1562 58.9355-85.1562L33.9355-85.1562C29.7852-85.1562 27.2461-82.6172 27.2461-78.4668L27.2461-50.7812C27.2461-46.6797 29.7852-44.0918 33.9355-44.0918Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M28.5645-12.9395L64.3066-12.9395C72.998-12.9395 79.0527-18.9941 79.0527-27.6855L79.0527-63.8672C79.0527-72.5586 72.998-78.6133 64.3066-78.6133L28.5645-78.6133C19.873-78.6133 13.8184-72.5586 13.8184-63.8672L13.8184-27.6855C13.8184-18.9941 19.873-12.9395 28.5645-12.9395Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:primary SFSymbolsPreviewWireframe" d="M28.5645-19.043L64.3066-19.043C69.6289-19.043 72.9492-22.3633 72.9492-27.6855L72.9492-63.8672C72.9492-69.1895 69.6289-72.5098 64.3066-72.5098L28.5645-72.5098C23.2422-72.5098 19.9219-69.1895 19.9219-63.8672L19.9219-27.6855C19.9219-22.3633 23.2422-19.043 28.5645-19.043Z"/>
+ <path class="monochrome-3 multicolor-3:tintColor hierarchical-3:primary SFSymbolsPreviewWireframe" d="M25 21.0938L67.8711 21.0938C81.1035 21.0938 89.6973 12.5 89.6973-0.732422L89.6973-43.6035C89.6973-56.8359 81.1035-65.4297 67.8711-65.4297L25-65.4297C11.7676-65.4297 3.17383-56.8359 3.17383-43.6035L3.17383-0.732422C3.17383 12.5 11.7676 21.0938 25 21.0938Z"/>
+ <path class="monochrome-4 multicolor-4:tintColor hierarchical-4:primary SFSymbolsPreviewWireframe" d="M25 14.502L67.8711 14.502C77.4414 14.502 83.1055 8.83789 83.1055-0.732422L83.1055-43.6035C83.1055-53.1738 77.4414-58.8379 67.8711-58.8379L25-58.8379C15.4297-58.8379 9.76562-53.1738 9.76562-43.6035L9.76562-0.732422C9.76562 8.83789 15.4297 14.502 25 14.502Z"/>
+ </g>
+ <g id="Regular-S" transform="matrix(1 0 0 1 1406.05 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:primary SFSymbolsPreviewWireframe" d="M31.6406-42.334L55.957-42.334C59.7168-42.334 61.8652-44.3848 61.8652-48.1445L61.8652-74.707C61.8652-78.4668 59.7168-80.5664 55.957-80.5664L31.6406-80.5664C27.8809-80.5664 25.7324-78.4668 25.7324-74.707L25.7324-48.1445C25.7324-44.3848 27.8809-42.334 31.6406-42.334Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M25.6836-14.1113L61.9629-14.1113C69.7754-14.1113 74.9023-19.0918 74.9023-26.9043L74.9023-62.2559C74.9023-70.0195 69.7754-75.0488 61.9629-75.0488L25.6836-75.0488C17.8223-75.0488 12.7441-70.0195 12.7441-62.2559L12.7441-26.9043C12.7441-19.0918 17.8223-14.1113 25.6836-14.1113Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:primary SFSymbolsPreviewWireframe" d="M25.5371-19.043L62.0605-19.043C67.0898-19.043 69.9219-21.8262 69.9219-26.8066L69.9219-62.3535C69.9219-67.2852 67.0898-70.0684 62.0605-70.0684L25.5371-70.0684C20.5078-70.0684 17.6758-67.2852 17.6758-62.3535L17.6758-26.8066C17.6758-21.8262 20.5078-19.043 25.5371-19.043Z"/>
+ <path class="monochrome-3 multicolor-3:tintColor hierarchical-3:primary SFSymbolsPreviewWireframe" d="M22.2168 16.0645L65.4297 16.0645C76.9531 16.0645 83.7891 9.375 83.7891-2.14844L83.7891-45.7031C83.7891-57.2266 76.9531-63.916 65.4297-63.916L22.2168-63.916C10.5957-63.916 3.80859-57.2266 3.80859-45.7031L3.80859-2.14844C3.80859 9.375 10.5957 16.0645 22.2168 16.0645Z"/>
+ <path class="monochrome-4 multicolor-4:tintColor hierarchical-4:primary SFSymbolsPreviewWireframe" d="M22.2168 10.1562L65.4297 10.1562C73.7305 10.1562 77.8809 6.05469 77.8809-2.14844L77.8809-45.7031C77.8809-53.9062 73.7305-57.959 65.4297-57.959L22.2168-57.959C13.8672-57.959 9.76562-53.9062 9.76562-45.7031L9.76562-2.14844C9.76562 6.05469 13.8672 10.1562 22.2168 10.1562Z"/>
+ </g>
+ <g id="Ultralight-S" transform="matrix(1 0 0 1 518.75 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:primary SFSymbolsPreviewWireframe" d="M28.2349-38.565L53.6865-38.565C55.4029-38.565 56.5977-39.7984 56.5977-41.5147L56.5977-72.3911C56.5977-74.1075 55.4029-75.2989 53.6865-75.2989L28.2349-75.2989C26.5186-75.2989 25.2783-74.1075 25.2783-72.3911L25.2783-41.5147C25.2783-39.7984 26.5186-38.565 28.2349-38.565Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M23.1406-13.1123L58.7388-13.1123C65.2798-13.1123 69.9981-17.7749 69.9981-24.3613L69.9981-61.938C69.9981-68.4756 65.2798-73.187 58.7388-73.187L23.1406-73.187C16.5962-73.187 11.8814-68.4756 11.8814-61.938L11.8814-24.3613C11.8814-17.7749 16.5962-13.1123 23.1406-13.1123Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:primary SFSymbolsPreviewWireframe" d="M21.314-19.3608L60.6074-19.3608C62.5035-19.3608 63.7461-20.5547 63.7461-22.4927L63.7461-63.8066C63.7461-65.6958 62.5035-66.8897 60.6074-66.8897L21.314-66.8897C19.3726-66.8897 18.1753-65.6958 18.1753-63.8066L18.1753-22.4927C18.1753-20.5547 19.3726-19.3608 21.314-19.3608Z"/>
+ <path class="monochrome-3 multicolor-3:tintColor hierarchical-3:primary SFSymbolsPreviewWireframe" d="M19.7193 12.1592L62.1602 12.1592C72.73 12.1592 79.4297 5.37894 79.4297-5.05466L79.4297-47.5195C79.4297-57.9531 72.73-64.7334 62.1602-64.7334L19.7193-64.7334C9.188-64.7334 2.49171-58.0439 2.49171-47.5195L2.49171-5.05466C2.49171 5.46976 9.188 12.1592 19.7193 12.1592Z"/>
+ <path class="monochrome-4 multicolor-4:tintColor hierarchical-4:primary SFSymbolsPreviewWireframe" d="M19.7193 4.88871L62.1602 4.88871C68.69 4.88871 72.1592 1.37748 72.1592-5.05466L72.1592-47.5195C72.1592-53.9517 68.69-57.5049 62.1602-57.5049L19.7193-57.5049C13.186-57.5049 9.76562-54.0425 9.76562-47.5195L9.76562-5.05466C9.76562 1.4683 13.186 4.88871 19.7193 4.88871Z"/>
+ </g>
+ </g>
+</svg>
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/Contents.json b/Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/Contents.json
new file mode 100644
index 000000000..96ad7d2b5
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/Contents.json
@@ -0,0 +1,15 @@
+{
+ "info" : {
+ "author" : "xcode",
+ "version" : 1
+ },
+ "properties" : {
+ "symbol-rendering-intent" : "multicolor"
+ },
+ "symbols" : [
+ {
+ "filename" : "person.2.fill.svg",
+ "idiom" : "universal"
+ }
+ ]
+}
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/person.2.fill.svg b/Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/person.2.fill.svg
new file mode 100644
index 000000000..a8c86af9d
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/artists.symbolset/person.2.fill.svg
@@ -0,0 +1,113 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--Generator: Apple Native CoreSVG 341-->
+<!DOCTYPE svg
+PUBLIC "-//W3C//DTD SVG 1.1//EN"
+ "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3300 2200">
+ <!--glyph: "101942", point size: 100.0, font version: "20.0d10e1", template writer version: "138.0.0"-->
+ <style>.monochrome-0 {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:person.2.fill}
+.monochrome-1 {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:person.2.fill}
+.monochrome-2 {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:person.2.fill}
+
+.multicolor-0:tintColor {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:person.2.fill}
+.multicolor-1:tintColor {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:person.2.fill}
+.multicolor-2:tintColor {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:person.2.fill}
+
+.hierarchical-0:secondary {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:person.2.fill}
+.hierarchical-1:primary {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:person.2.fill}
+.hierarchical-2:primary {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:person.2.fill}
+
+.SFSymbolsPreviewWireframe {fill:none;opacity:1.0;stroke:black;stroke-width:0.5}
+</style>
+ <g id="Notes">
+ <rect height="2200" id="artboard" style="fill:white;opacity:1" width="3300" x="0" y="0"/>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="292" y2="292"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 322)">Weight/Scale Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 559.711 322)">Ultralight</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 856.422 322)">Thin</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1153.13 322)">Light</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1449.84 322)">Regular</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1746.56 322)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2043.27 322)">Semibold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2339.98 322)">Bold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2636.69 322)">Heavy</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2933.4 322)">Black</text>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1903" y2="1903"/>
+ <g transform="matrix(0.2 0 0 0.2 263 1933)">
+ <path d="m46.2402 4.15039c21.7773 0 39.4531-17.627 39.4531-39.4043s-17.6758-39.4043-39.4531-39.4043c-21.7285 0-39.4043 17.627-39.4043 39.4043s17.6758 39.4043 39.4043 39.4043Zm0-7.42188c-17.6758 0-31.9336-14.3066-31.9336-31.9824s14.2578-31.9824 31.9336-31.9824 31.9824 14.3066 31.9824 31.9824-14.3066 31.9824-31.9824 31.9824Zm-17.9688-31.9824c0 2.14844 1.51367 3.61328 3.75977 3.61328h10.498v10.5957c0 2.19727 1.46484 3.71094 3.61328 3.71094 2.24609 0 3.71094-1.51367 3.71094-3.71094v-10.5957h10.5957c2.19727 0 3.71094-1.46484 3.71094-3.61328 0-2.19727-1.51367-3.71094-3.71094-3.71094h-10.5957v-10.5469c0-2.24609-1.46484-3.75977-3.71094-3.75977-2.14844 0-3.61328 1.51367-3.61328 3.75977v10.5469h-10.498c-2.24609 0-3.75977 1.51367-3.75977 3.71094Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 281.506 1933)">
+ <path d="m58.5449 14.5508c27.4902 0 49.8047-22.3145 49.8047-49.8047s-22.3145-49.8047-49.8047-49.8047-49.8047 22.3145-49.8047 49.8047 22.3145 49.8047 49.8047 49.8047Zm0-8.30078c-22.9492 0-41.5039-18.5547-41.5039-41.5039s18.5547-41.5039 41.5039-41.5039 41.5039 18.5547 41.5039 41.5039-18.5547 41.5039-41.5039 41.5039Zm-22.6562-41.5039c0 2.39258 1.66016 4.00391 4.15039 4.00391h14.3555v14.4043c0 2.44141 1.66016 4.15039 4.05273 4.15039 2.44141 0 4.15039-1.66016 4.15039-4.15039v-14.4043h14.4043c2.44141 0 4.15039-1.61133 4.15039-4.00391 0-2.44141-1.70898-4.15039-4.15039-4.15039h-14.4043v-14.3555c0-2.49023-1.70898-4.19922-4.15039-4.19922-2.39258 0-4.05273 1.70898-4.05273 4.19922v14.3555h-14.3555c-2.49023 0-4.15039 1.70898-4.15039 4.15039Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 304.924 1933)">
+ <path d="m74.8535 28.3203c35.1074 0 63.623-28.4668 63.623-63.5742s-28.5156-63.623-63.623-63.623-63.5742 28.5156-63.5742 63.623 28.4668 63.5742 63.5742 63.5742Zm0-9.08203c-30.127 0-54.4922-24.3652-54.4922-54.4922s24.3652-54.4922 54.4922-54.4922 54.4922 24.3652 54.4922 54.4922-24.3652 54.4922-54.4922 54.4922Zm-28.8574-54.4922c0 2.58789 1.85547 4.39453 4.58984 4.39453h19.7266v19.7754c0 2.68555 1.85547 4.58984 4.44336 4.58984 2.68555 0 4.54102-1.85547 4.54102-4.58984v-19.7754h19.7754c2.68555 0 4.58984-1.80664 4.58984-4.39453 0-2.73438-1.85547-4.58984-4.58984-4.58984h-19.7754v-19.7266c0-2.73438-1.85547-4.63867-4.54102-4.63867-2.58789 0-4.44336 1.9043-4.44336 4.63867v19.7266h-19.7266c-2.73438 0-4.58984 1.85547-4.58984 4.58984Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 1953)">Design Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1971)">Symbols are supported in up to nine weights and three scales.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1989)">For optimal layout with text and other symbols, vertically align</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 2007)">symbols with the adjacent text.</text>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="776" x2="776" y1="1919" y2="1933"/>
+ <g transform="matrix(0.2 0 0 0.2 776 1933)">
+ <path d="m16.5527 0.78125c2.58789 0 3.85742-0.976562 4.78516-3.71094l6.29883-17.2363h28.8086l6.29883 17.2363c0.927734 2.73438 2.19727 3.71094 4.73633 3.71094 2.58789 0 4.24805-1.5625 4.24805-4.00391 0-0.830078-0.146484-1.61133-0.537109-2.63672l-22.9004-60.9863c-1.12305-2.97852-3.125-4.49219-6.25-4.49219-3.02734 0-5.07812 1.46484-6.15234 4.44336l-22.9004 61.084c-0.390625 1.02539-0.537109 1.80664-0.537109 2.63672 0 2.44141 1.5625 3.95508 4.10156 3.95508Zm13.4766-28.3691 11.8652-32.8613h0.244141l11.8652 32.8613Z"/>
+ </g>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="792.836" x2="792.836" y1="1919" y2="1933"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 776 1953)">Margins</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1971)">Leading and trailing margins on the left and right side of each symbol</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1989)">can be adjusted by modifying the x-location of the margin guidelines.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2007)">Modifications are automatically applied proportionally to all</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2025)">scales and weights.</text>
+ <g transform="matrix(0.2 0 0 0.2 1289 1933)">
+ <path d="m14.209 9.32617 8.49609 8.54492c4.29688 4.3457 9.22852 4.05273 13.8672-1.07422l53.4668-58.9355-4.83398-4.88281-53.0762 58.3984c-1.75781 2.00195-3.41797 2.49023-5.76172 0.146484l-5.85938-5.81055c-2.34375-2.29492-1.80664-4.00391 0.195312-5.81055l57.373-54.0039-4.88281-4.83398-57.959 54.4434c-4.93164 4.58984-5.32227 9.47266-1.02539 13.8184Zm32.0801-90.9668c-2.09961 2.05078-2.24609 4.93164-1.07422 6.88477 1.17188 1.80664 3.4668 2.97852 6.68945 2.14844 7.32422-1.70898 14.9414-2.00195 22.0703 2.68555l-2.92969 7.27539c-1.70898 4.15039-0.830078 7.08008 1.85547 9.81445l11.4746 11.5723c2.44141 2.44141 4.49219 2.53906 7.32422 2.05078l5.32227-0.976562 3.32031 3.36914-0.195312 2.7832c-0.195312 2.49023 0.439453 4.39453 2.88086 6.78711l3.80859 3.71094c2.39258 2.39258 5.46875 2.53906 7.8125 0.195312l14.5508-14.5996c2.34375-2.34375 2.24609-5.32227-0.146484-7.71484l-3.85742-3.80859c-2.39258-2.39258-4.24805-3.17383-6.64062-2.97852l-2.88086 0.244141-3.22266-3.17383 1.2207-5.61523c0.634766-2.83203-0.146484-5.0293-3.07617-7.95898l-10.9863-10.9375c-16.6992-16.6016-38.8672-16.2109-53.3203-1.75781Zm7.4707 1.85547c12.1582-8.88672 28.6133-7.37305 39.7461 3.75977l12.1582 12.0605c1.17188 1.17188 1.36719 2.09961 1.02539 3.80859l-1.61133 7.42188 7.51953 7.42188 4.93164-0.292969c1.26953-0.0488281 1.66016 0.0488281 2.63672 1.02539l2.88086 2.88086-12.207 12.207-2.88086-2.88086c-0.976562-0.976562-1.12305-1.36719-1.07422-2.68555l0.341797-4.88281-7.4707-7.42188-7.61719 1.26953c-1.61133 0.341797-2.34375 0.195312-3.56445-0.976562l-10.0098-10.0098c-1.26953-1.17188-1.41602-2.00195-0.634766-3.85742l4.39453-10.4492c-7.8125-7.27539-17.9688-10.4004-28.125-7.42188-0.78125 0.195312-1.07422-0.439453-0.439453-0.976562Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 1289 1953)">Exporting</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1971)">Symbols should be outlined when exporting to ensure the</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1989)">design is preserved when submitting to Xcode.</text>
+ <text id="template-version" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1933)">Template v.5.0</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1951)">Requires Xcode 15 or greater</text>
+ <text id="descriptive-name" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1969)">Generated from person.2.fill</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1987)">Typeset at 100.0 points</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 726)">Small</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1156)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1586)">Large</text>
+ </g>
+ <g id="Guides">
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 696)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="696" y2="696"/>
+ <line id="Capline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="625.541" y2="625.541"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1126)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1126" y2="1126"/>
+ <line id="Capline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1055.54" y2="1055.54"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1556)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1556" y2="1556"/>
+ <line id="Capline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1485.54" y2="1485.54"/>
+ <line id="right-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2996.51" x2="2996.51" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2870.29" x2="2870.29" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1511.86" x2="1511.86" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1387.83" x2="1387.83" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="621.133" x2="621.133" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="498.29" x2="498.29" y1="600.785" y2="720.121"/>
+ </g>
+ <g id="Symbols">
+ <g id="Black-S" transform="matrix(1 0 0 1 2870.29 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:secondary SFSymbolsPreviewWireframe" d="M38.4277-35.3516C46.3379-35.3516 52.4414-42.1387 52.4414-50.5371C52.4414-58.5449 46.2402-65.5273 38.4277-65.5273C30.6152-65.5273 24.4629-58.4961 24.4629-50.5371C24.4629-42.1387 30.5176-35.3516 38.4277-35.3516ZM18.4082 0.244141L58.4473 0.244141C65.0391 0.244141 67.0898-3.02734 67.0898-8.39844C67.0898-17.7734 54.7363-29.7363 38.4277-29.7363C22.1191-29.7363 9.76562-17.7734 9.76562-8.39844C9.76562-3.02734 11.8164 0.244141 18.4082 0.244141Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M60.498 7.51953L106.494 7.51953C119.043 7.51953 123.779 0.537109 123.779-6.88477C123.779-20.9473 107.178-37.0117 83.4961-37.0117C59.8145-37.0117 43.2129-20.9473 43.2129-6.88477C43.2129 0.634766 47.9004 7.51953 60.498 7.51953Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:primary SFSymbolsPreviewWireframe" d="M83.4961-36.1816C92.5781-36.1816 99.5605-43.9453 99.5605-53.6133C99.5605-62.793 92.4805-70.8008 83.4961-70.8008C74.5117-70.8008 67.4316-62.793 67.4316-53.6133C67.4316-43.9453 74.4141-36.1816 83.4961-36.1816ZM59.0332 0.195312L107.959 0.195312C113.281 0.195312 116.455-2.44141 116.455-6.88477C116.455-16.5527 103.32-29.6875 83.4961-29.6875C63.6719-29.6875 50.5371-16.5527 50.5371-6.88477C50.5371-2.44141 53.7109 0.195312 59.0332 0.195312Z"/>
+ </g>
+ <g id="Regular-S" transform="matrix(1 0 0 1 1387.83 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:secondary SFSymbolsPreviewWireframe" d="M37.8906-35.4492C45.0195-35.4492 51.3184-41.8945 51.3184-50.2441C51.3184-58.5938 45.0195-64.5996 37.8906-64.5996C30.8105-64.5996 24.4629-58.4473 24.4629-50.1465C24.4629-41.8945 30.8105-35.4492 37.8906-35.4492ZM16.8945-0.683594L58.9355-0.683594C64.1602-0.683594 66.0645-2.73438 66.0645-6.20117C66.0645-16.748 55.2246-29.5898 37.8906-29.5898C20.6055-29.5898 9.76562-16.748 9.76562-6.20117C9.76562-2.73438 11.6699-0.683594 16.8945-0.683594Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M58.3496 5.0293L105.566 5.0293C116.65 5.0293 119.922-0.341797 119.922-5.9082C119.922-19.0918 104.932-35.2051 81.9336-35.2051C58.9355-35.2051 43.9453-19.0918 43.9453-5.9082C43.9453-0.341797 47.2656 5.0293 58.3496 5.0293Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:primary SFSymbolsPreviewWireframe" d="M81.9336-36.3281C90.1367-36.3281 97.3633-43.7012 97.3633-53.3203C97.3633-62.8906 90.1367-69.8242 81.9336-69.8242C73.7793-69.8242 66.5527-62.6953 66.5527-53.2227C66.5527-43.7012 73.7793-36.3281 81.9336-36.3281ZM58.3496-0.683594L105.566-0.683594C112.109-0.683594 114.258-2.53906 114.258-5.9082C114.258-15.8203 101.855-29.4922 81.9336-29.4922C62.0605-29.4922 49.6582-15.8203 49.6582-5.9082C49.6582-2.53906 51.8066-0.683594 58.3496-0.683594Z"/>
+ </g>
+ <g id="Ultralight-S" transform="matrix(1 0 0 1 498.29 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:secondary SFSymbolsPreviewWireframe" d="M37.4365-35.2676C44.7471-35.2676 50.3648-41.4858 50.3648-49.6538C50.3648-57.2769 44.6108-63.7368 37.4365-63.7368C30.2656-63.7368 24.5537-57.2666 24.5537-49.647C24.5537-41.4858 30.1294-35.2676 37.4365-35.2676ZM14.8511-1.6372L59.7983-1.6372C63.0703-1.6372 64.8838-2.96142 64.8838-6.3374C64.8838-17.2021 54.3618-29.4082 37.3457-29.4082C20.333-29.4082 9.76562-17.2021 9.76562-6.3374C9.76562-2.96142 11.5791-1.6372 14.8511-1.6372Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M55.5342 1.39651L107.247 1.39651C112.972 1.39651 116.153-1.24999 116.153-6.04443C116.153-17.5025 102.616-32.2989 81.3887-32.2989C60.1616-32.2989 46.5791-17.5025 46.5791-6.04443C46.5791-1.24999 49.7632 1.39651 55.5342 1.39651Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:primary SFSymbolsPreviewWireframe" d="M81.4795-36.1011C89.8643-36.1011 96.2734-43.2925 96.2734-52.6392C96.2734-61.3921 89.728-68.8252 81.4795-68.8252C73.2344-68.8252 66.6436-61.3784 66.6436-52.6323C66.6436-43.2925 73.0981-36.1011 81.4795-36.1011ZM55.5342-1.6372L107.247-1.6372C110.974-1.6372 113.077-2.76611 113.077-6.04443C113.077-15.7749 100.947-29.2197 81.3887-29.2197C61.8335-29.2197 49.6582-15.7749 49.6582-6.04443C49.6582-2.76611 51.7612-1.6372 55.5342-1.6372Z"/>
+ </g>
+ </g>
+</svg>
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/Contents.json b/Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/Contents.json
new file mode 100644
index 000000000..d7f8cb83e
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/Contents.json
@@ -0,0 +1,15 @@
+{
+ "info" : {
+ "author" : "xcode",
+ "version" : 1
+ },
+ "properties" : {
+ "symbol-rendering-intent" : "multicolor"
+ },
+ "symbols" : [
+ {
+ "filename" : "guitars.fill.svg",
+ "idiom" : "universal"
+ }
+ ]
+}
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/guitars.fill.svg b/Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/guitars.fill.svg
new file mode 100644
index 000000000..c3db6e699
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/genres.symbolset/guitars.fill.svg
@@ -0,0 +1,125 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--Generator: Apple Native CoreSVG 341-->
+<!DOCTYPE svg
+PUBLIC "-//W3C//DTD SVG 1.1//EN"
+ "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3300 2200">
+ <!--glyph: "101B47", point size: 100.0, font version: "20.0d10e1", template writer version: "138.0.0"-->
+ <style>.monochrome-0 {-sfsymbols-motion-group:2;-sfsymbols-layer-tags:guitars.fill}
+.monochrome-1 {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:1;-sfsymbols-layer-tags:guitars.fill}
+.monochrome-2 {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:guitars.fill}
+.monochrome-3 {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:guitars.fill}
+.monochrome-4 {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:guitars.fill}
+
+.multicolor-0:tintColor {-sfsymbols-motion-group:2;-sfsymbols-layer-tags:guitars.fill}
+.multicolor-1:tintColor {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:1;-sfsymbols-layer-tags:guitars.fill}
+.multicolor-2:tintColor {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:guitars.fill}
+.multicolor-3:tintColor {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:guitars.fill}
+.multicolor-4:tintColor {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:guitars.fill}
+
+.hierarchical-0:tertiary {-sfsymbols-motion-group:2;-sfsymbols-layer-tags:guitars.fill}
+.hierarchical-1:primary {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:1;-sfsymbols-layer-tags:guitars.fill}
+.hierarchical-2:secondary {-sfsymbols-motion-group:1;-sfsymbols-layer-tags:guitars.fill}
+.hierarchical-3:primary {opacity:0.0;-sfsymbols-clear-behind:true;-sfsymbols-motion-group:0;-sfsymbols-layer-tags:guitars.fill}
+.hierarchical-4:primary {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:guitars.fill}
+
+.SFSymbolsPreviewWireframe {fill:none;opacity:1.0;stroke:black;stroke-width:0.5}
+</style>
+ <g id="Notes">
+ <rect height="2200" id="artboard" style="fill:white;opacity:1" width="3300" x="0" y="0"/>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="292" y2="292"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 322)">Weight/Scale Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 559.711 322)">Ultralight</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 856.422 322)">Thin</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1153.13 322)">Light</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1449.84 322)">Regular</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1746.56 322)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2043.27 322)">Semibold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2339.98 322)">Bold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2636.69 322)">Heavy</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2933.4 322)">Black</text>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1903" y2="1903"/>
+ <g transform="matrix(0.2 0 0 0.2 263 1933)">
+ <path d="m46.2402 4.15039c21.7773 0 39.4531-17.627 39.4531-39.4043s-17.6758-39.4043-39.4531-39.4043c-21.7285 0-39.4043 17.627-39.4043 39.4043s17.6758 39.4043 39.4043 39.4043Zm0-7.42188c-17.6758 0-31.9336-14.3066-31.9336-31.9824s14.2578-31.9824 31.9336-31.9824 31.9824 14.3066 31.9824 31.9824-14.3066 31.9824-31.9824 31.9824Zm-17.9688-31.9824c0 2.14844 1.51367 3.61328 3.75977 3.61328h10.498v10.5957c0 2.19727 1.46484 3.71094 3.61328 3.71094 2.24609 0 3.71094-1.51367 3.71094-3.71094v-10.5957h10.5957c2.19727 0 3.71094-1.46484 3.71094-3.61328 0-2.19727-1.51367-3.71094-3.71094-3.71094h-10.5957v-10.5469c0-2.24609-1.46484-3.75977-3.71094-3.75977-2.14844 0-3.61328 1.51367-3.61328 3.75977v10.5469h-10.498c-2.24609 0-3.75977 1.51367-3.75977 3.71094Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 281.506 1933)">
+ <path d="m58.5449 14.5508c27.4902 0 49.8047-22.3145 49.8047-49.8047s-22.3145-49.8047-49.8047-49.8047-49.8047 22.3145-49.8047 49.8047 22.3145 49.8047 49.8047 49.8047Zm0-8.30078c-22.9492 0-41.5039-18.5547-41.5039-41.5039s18.5547-41.5039 41.5039-41.5039 41.5039 18.5547 41.5039 41.5039-18.5547 41.5039-41.5039 41.5039Zm-22.6562-41.5039c0 2.39258 1.66016 4.00391 4.15039 4.00391h14.3555v14.4043c0 2.44141 1.66016 4.15039 4.05273 4.15039 2.44141 0 4.15039-1.66016 4.15039-4.15039v-14.4043h14.4043c2.44141 0 4.15039-1.61133 4.15039-4.00391 0-2.44141-1.70898-4.15039-4.15039-4.15039h-14.4043v-14.3555c0-2.49023-1.70898-4.19922-4.15039-4.19922-2.39258 0-4.05273 1.70898-4.05273 4.19922v14.3555h-14.3555c-2.49023 0-4.15039 1.70898-4.15039 4.15039Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 304.924 1933)">
+ <path d="m74.8535 28.3203c35.1074 0 63.623-28.4668 63.623-63.5742s-28.5156-63.623-63.623-63.623-63.5742 28.5156-63.5742 63.623 28.4668 63.5742 63.5742 63.5742Zm0-9.08203c-30.127 0-54.4922-24.3652-54.4922-54.4922s24.3652-54.4922 54.4922-54.4922 54.4922 24.3652 54.4922 54.4922-24.3652 54.4922-54.4922 54.4922Zm-28.8574-54.4922c0 2.58789 1.85547 4.39453 4.58984 4.39453h19.7266v19.7754c0 2.68555 1.85547 4.58984 4.44336 4.58984 2.68555 0 4.54102-1.85547 4.54102-4.58984v-19.7754h19.7754c2.68555 0 4.58984-1.80664 4.58984-4.39453 0-2.73438-1.85547-4.58984-4.58984-4.58984h-19.7754v-19.7266c0-2.73438-1.85547-4.63867-4.54102-4.63867-2.58789 0-4.44336 1.9043-4.44336 4.63867v19.7266h-19.7266c-2.73438 0-4.58984 1.85547-4.58984 4.58984Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 1953)">Design Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1971)">Symbols are supported in up to nine weights and three scales.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1989)">For optimal layout with text and other symbols, vertically align</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 2007)">symbols with the adjacent text.</text>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="776" x2="776" y1="1919" y2="1933"/>
+ <g transform="matrix(0.2 0 0 0.2 776 1933)">
+ <path d="m16.5527 0.78125c2.58789 0 3.85742-0.976562 4.78516-3.71094l6.29883-17.2363h28.8086l6.29883 17.2363c0.927734 2.73438 2.19727 3.71094 4.73633 3.71094 2.58789 0 4.24805-1.5625 4.24805-4.00391 0-0.830078-0.146484-1.61133-0.537109-2.63672l-22.9004-60.9863c-1.12305-2.97852-3.125-4.49219-6.25-4.49219-3.02734 0-5.07812 1.46484-6.15234 4.44336l-22.9004 61.084c-0.390625 1.02539-0.537109 1.80664-0.537109 2.63672 0 2.44141 1.5625 3.95508 4.10156 3.95508Zm13.4766-28.3691 11.8652-32.8613h0.244141l11.8652 32.8613Z"/>
+ </g>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="792.836" x2="792.836" y1="1919" y2="1933"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 776 1953)">Margins</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1971)">Leading and trailing margins on the left and right side of each symbol</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1989)">can be adjusted by modifying the x-location of the margin guidelines.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2007)">Modifications are automatically applied proportionally to all</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2025)">scales and weights.</text>
+ <g transform="matrix(0.2 0 0 0.2 1289 1933)">
+ <path d="m14.209 9.32617 8.49609 8.54492c4.29688 4.3457 9.22852 4.05273 13.8672-1.07422l53.4668-58.9355-4.83398-4.88281-53.0762 58.3984c-1.75781 2.00195-3.41797 2.49023-5.76172 0.146484l-5.85938-5.81055c-2.34375-2.29492-1.80664-4.00391 0.195312-5.81055l57.373-54.0039-4.88281-4.83398-57.959 54.4434c-4.93164 4.58984-5.32227 9.47266-1.02539 13.8184Zm32.0801-90.9668c-2.09961 2.05078-2.24609 4.93164-1.07422 6.88477 1.17188 1.80664 3.4668 2.97852 6.68945 2.14844 7.32422-1.70898 14.9414-2.00195 22.0703 2.68555l-2.92969 7.27539c-1.70898 4.15039-0.830078 7.08008 1.85547 9.81445l11.4746 11.5723c2.44141 2.44141 4.49219 2.53906 7.32422 2.05078l5.32227-0.976562 3.32031 3.36914-0.195312 2.7832c-0.195312 2.49023 0.439453 4.39453 2.88086 6.78711l3.80859 3.71094c2.39258 2.39258 5.46875 2.53906 7.8125 0.195312l14.5508-14.5996c2.34375-2.34375 2.24609-5.32227-0.146484-7.71484l-3.85742-3.80859c-2.39258-2.39258-4.24805-3.17383-6.64062-2.97852l-2.88086 0.244141-3.22266-3.17383 1.2207-5.61523c0.634766-2.83203-0.146484-5.0293-3.07617-7.95898l-10.9863-10.9375c-16.6992-16.6016-38.8672-16.2109-53.3203-1.75781Zm7.4707 1.85547c12.1582-8.88672 28.6133-7.37305 39.7461 3.75977l12.1582 12.0605c1.17188 1.17188 1.36719 2.09961 1.02539 3.80859l-1.61133 7.42188 7.51953 7.42188 4.93164-0.292969c1.26953-0.0488281 1.66016 0.0488281 2.63672 1.02539l2.88086 2.88086-12.207 12.207-2.88086-2.88086c-0.976562-0.976562-1.12305-1.36719-1.07422-2.68555l0.341797-4.88281-7.4707-7.42188-7.61719 1.26953c-1.61133 0.341797-2.34375 0.195312-3.56445-0.976562l-10.0098-10.0098c-1.26953-1.17188-1.41602-2.00195-0.634766-3.85742l4.39453-10.4492c-7.8125-7.27539-17.9688-10.4004-28.125-7.42188-0.78125 0.195312-1.07422-0.439453-0.439453-0.976562Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 1289 1953)">Exporting</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1971)">Symbols should be outlined when exporting to ensure the</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1989)">design is preserved when submitting to Xcode.</text>
+ <text id="template-version" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1933)">Template v.5.0</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1951)">Requires Xcode 15 or greater</text>
+ <text id="descriptive-name" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1969)">Generated from guitars.fill</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1987)">Typeset at 100.0 points</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 726)">Small</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1156)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1586)">Large</text>
+ </g>
+ <g id="Guides">
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 696)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="696" y2="696"/>
+ <line id="Capline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="625.541" y2="625.541"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1126)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1126" y2="1126"/>
+ <line id="Capline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1055.54" y2="1055.54"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1556)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1556" y2="1556"/>
+ <line id="Capline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1485.54" y2="1485.54"/>
+ <line id="right-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="3000.95" x2="3000.95" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2865.85" x2="2865.85" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1509.61" x2="1509.61" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1390.08" x2="1390.08" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="613.483" x2="613.483" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="505.94" x2="505.94" y1="600.785" y2="720.121"/>
+ </g>
+ <g id="Symbols">
+ <g id="Black-S" transform="matrix(1 0 0 1 2865.85 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:tertiary SFSymbolsPreviewWireframe" d="M105.664 9.47266C117.627 9.47266 125.342 3.56445 125.342-5.76172C125.342-14.4531 120.02-15.5273 120.02-19.4336C120.02-21.7285 121.24-23.9746 121.24-27.832C121.24-33.8867 116.602-37.9883 109.717-39.1113L109.717-63.5742C109.717-64.8438 109.766-65.0391 110.4-65.5273C111.523-66.2598 111.914-66.9922 111.865-68.0664L111.279-77.9297C111.182-79.2969 110.205-80.1758 108.936-80.1758L102.393-80.1758C101.123-80.1758 100.146-79.2969 100.049-77.9297L99.4629-68.0664C99.4141-66.9922 99.8047-66.2598 100.928-65.5273C101.562-65.0391 101.611-64.8438 101.611-63.5742L101.611-39.1113C94.7266-37.9883 90.0879-33.8867 90.0879-27.832C90.0879-23.9746 91.3086-21.7285 91.3086-19.4336C91.3086-15.5273 85.9863-14.4531 85.9863-5.76172C85.9863 3.56445 93.7012 9.47266 105.664 9.47266ZM105.713-15.7227C102.979-15.7227 100.781-17.8711 100.781-20.5566C100.781-23.1934 102.979-25.3906 105.713-25.3906C108.35-25.3906 110.547-23.1934 110.547-20.5566C110.547-17.8711 108.35-15.7227 105.713-15.7227ZM100.879-4.29688C99.5117-4.29688 98.4375-5.41992 98.4375-6.73828C98.4375-8.05664 99.5117-9.13086 100.879-9.13086L110.4-9.13086C111.768-9.13086 112.842-8.05664 112.842-6.73828C112.842-5.41992 111.768-4.29688 110.4-4.29688Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M68.8965 13.5254C82.8125 13.5254 92.4805 4.73633 92.4805-8.1543C92.4805-19.7754 87.5977-21.5332 87.5977-22.2656C87.5977-24.4629 90.4785-27.1973 90.4785-32.373C90.4785-37.9883 86.0352-42.3828 80.3711-42.3828C78.9551-42.3828 77.7832-42.1387 76.7578-41.748L76.7578-60.2539C78.0762-61.5723 78.6621-62.8906 78.8086-64.6484L79.5898-73.1934C79.7852-75.5371 78.8086-77.832 77.0996-79.2969L73.6328-82.3242C72.3633-83.3984 70.7031-84.082 68.8965-84.082C67.0898-84.082 65.4297-83.3984 64.1602-82.3242L60.6934-79.2969C58.9844-77.832 58.0078-75.5371 58.2031-73.1934L58.9844-64.6484C59.1309-62.8906 59.7168-61.5723 61.0352-60.2539L61.0352-41.748C60.0098-42.1387 58.8379-42.3828 57.4219-42.3828C51.7578-42.3828 47.3145-37.9883 47.3145-32.373C47.3145-27.1973 50.1953-24.4629 50.1953-22.2656C50.1953-21.5332 45.3125-19.7754 45.3125-8.1543C45.3125 4.73633 54.9805 13.5254 68.8965 13.5254Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:secondary SFSymbolsPreviewWireframe" d="M68.8965 9.61914C80.6641 9.61914 88.5742 2.53906 88.5742-8.1543C88.5742-17.041 83.6914-18.7988 83.6914-22.2656C83.6914-25.9277 86.5723-27.9785 86.5723-32.373C86.5723-35.8398 83.8867-38.4766 80.3711-38.4766C78.2227-38.4766 77.0996-37.5977 76.1719-36.8164C75.3906-36.2305 74.7559-35.5957 73.877-35.5957C73.1934-35.5957 72.8516-35.9863 72.8516-36.6699L72.8516-61.6699C72.8516-62.0117 72.9492-62.1582 73.3887-62.5C74.3652-63.2812 74.8047-63.7695 74.9023-64.9902L75.6836-73.5352C75.7812-74.6582 75.293-75.6836 74.5117-76.3672L71.0938-79.3457C70.459-79.8828 69.7266-80.1758 68.8965-80.1758C68.0664-80.1758 67.334-79.8828 66.6992-79.3457L63.2812-76.3672C62.5-75.6836 62.0117-74.6582 62.1094-73.5352L62.8906-64.9902C62.9883-63.7695 63.4277-63.2812 64.4043-62.5C64.8438-62.1582 64.9414-62.0117 64.9414-61.6699L64.9414-36.6699C64.9414-35.9863 64.5996-35.5957 63.916-35.5957C63.0371-35.5957 62.4023-36.2305 61.6211-36.8164C60.6934-37.5977 59.5703-38.4766 57.4219-38.4766C53.9062-38.4766 51.2207-35.8398 51.2207-32.373C51.2207-27.9785 54.1016-25.9277 54.1016-22.2656C54.1016-18.7988 49.2188-17.041 49.2188-8.1543C49.2188 2.53906 57.1289 9.61914 68.8965 9.61914ZM60.4004-8.74023C59.082-9.13086 58.3496-10.5469 58.6914-11.8164L60.7422-19.4336C61.1328-20.8008 62.5488-21.582 63.916-21.0938C65.2344-20.752 65.9668-19.2871 65.625-18.0176L63.6719-10.4004C63.3301-9.08203 61.7188-8.30078 60.4004-8.74023ZM77.2461-8.69141C75.8789-8.39844 74.4629-9.22852 74.1699-10.4004L72.168-18.0176C71.7773-19.5312 72.6562-20.9473 74.0234-21.1426C75.3906-21.4355 76.7578-20.6055 77.0508-19.4336L79.1016-11.8164C79.4922-10.4004 78.5645-8.88672 77.2461-8.69141Z"/>
+ <path class="monochrome-3 multicolor-3:tintColor hierarchical-3:primary SFSymbolsPreviewWireframe" d="M6.93359-1.41602C3.85742 5.51758 7.37305 13.5742 16.2598 13.5742C19.043 13.5742 21.6309 12.6465 25.1465 9.7168L33.0566 3.17383L41.0156 9.7168C44.5312 12.6465 47.1191 13.5742 49.9023 13.5742C58.7891 13.5742 62.3047 5.51758 59.2285-1.41602L41.0156-42.1875L41.0156-60.3027C41.0156-69.0918 42.5293-75.1953 42.5293-77.3926C42.5293-81.1523 39.6484-84.082 35.8887-84.082C33.9355-84.082 31.9824-83.3496 29.8828-80.957L21.0938-70.8496C18.2617-67.5293 19.2871-62.6465 23.291-60.8887C24.2188-60.498 24.8047-60.2539 25.0977-60.1562L25.0977-42.0898Z"/>
+ <path class="monochrome-4 multicolor-4:tintColor hierarchical-4:primary SFSymbolsPreviewWireframe" d="M10.498 0.195312C8.69141 4.24805 10.0098 9.66797 16.2598 9.66797C18.3105 9.66797 20.0684 8.83789 22.6562 6.68945L32.4707-1.36719C32.666-1.5625 32.8125-1.5625 33.0566-1.5625C33.3008-1.5625 33.4961-1.5625 33.6914-1.36719L43.5059 6.68945C46.0938 8.83789 47.8516 9.66797 49.9023 9.66797C56.1523 9.66797 57.4707 4.24805 55.6641 0.195312L37.1094-41.3574L37.1094-60.3027C37.1094-69.2383 38.623-75.9277 38.623-77.3926C38.623-79.0039 37.5-80.1758 35.8887-80.1758C34.8145-80.1758 33.9355-79.6387 32.8125-78.3691L24.0723-68.3105C22.9492-66.9922 23.2422-65.1855 24.8535-64.4531C28.3203-62.9883 29.0039-62.5977 29.0039-60.3027L29.0039-41.2598ZM37.0605-18.6035C35.6445-18.6035 34.375-19.8242 34.375-21.1914C34.375-22.6074 35.5957-23.7793 37.0605-23.7793C38.4277-23.7793 39.6484-22.6074 39.6484-21.1914C39.6484-19.8242 38.4277-18.6035 37.0605-18.6035ZM39.7461-12.5977C38.3301-12.5977 37.1094-13.7695 37.1094-15.1855C37.1094-16.5527 38.3301-17.7734 39.7461-17.7734C41.1133-17.7734 42.334-16.5527 42.334-15.1855C42.334-13.7695 41.1133-12.5977 39.7461-12.5977ZM42.5781-6.54297C41.1621-6.54297 39.9414-7.76367 39.9414-9.17969C39.9414-10.5957 41.1621-11.8164 42.5781-11.8164C43.9453-11.8164 45.166-10.6445 45.166-9.17969C45.166-7.76367 43.9941-6.54297 42.5781-6.54297Z"/>
+ </g>
+ <g id="Regular-S" transform="matrix(1 0 0 1 1390.08 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:tertiary SFSymbolsPreviewWireframe" d="M92.3828 5.56641C102.979 5.56641 109.766 0.488281 109.766-7.56836C109.766-15.5273 104.639-17.3828 104.639-20.7031C104.639-23.2422 105.762-25.5371 105.762-28.8086C105.762-34.1797 102.002-37.5977 95.3613-38.3789L95.3613-60.9375C95.3613-62.5 95.6055-62.8906 96.4844-63.5254C97.2656-64.0137 97.5098-64.502 97.4609-65.1855L96.875-74.6094C96.8262-75.4395 96.2891-76.0254 95.5078-76.0254L89.2578-76.0254C88.5254-76.0254 87.9395-75.4395 87.8906-74.6094L87.3047-65.1855C87.2559-64.502 87.5488-64.0137 88.3301-63.5254C89.209-62.8906 89.4043-62.5 89.4043-60.9375L89.4043-38.3789C82.7637-37.5977 79.0527-34.1797 79.0527-28.8086C79.0527-25.5371 80.1758-23.2422 80.1758-20.7031C80.1758-17.3828 75.0488-15.5273 75.0488-7.56836C75.0488 0.488281 81.8359 5.56641 92.3828 5.56641ZM92.3828-17.4805C89.9414-17.4805 87.9883-19.3848 87.9883-21.8262C87.9883-24.2676 89.9902-26.2207 92.3828-26.2207C94.8242-26.2207 96.7285-24.2676 96.7285-21.8262C96.7285-19.3848 94.8242-17.4805 92.3828-17.4805ZM87.3047-6.64062C86.2305-6.64062 85.4004-7.4707 85.4004-8.54492C85.4004-9.57031 86.2793-10.498 87.3047-10.498L97.4121-10.498C98.4375-10.498 99.3164-9.61914 99.3164-8.54492C99.3164-7.4707 98.4375-6.64062 97.4121-6.64062Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M61.6211 8.1543C73.3398 8.1543 81.4453 0.927734 81.4453-9.81445C81.4453-18.4082 76.709-22.168 76.709-23.3887C76.709-25.293 79.2969-27.4902 79.2969-32.6172C79.2969-36.8652 76.3184-40.0879 72.168-40.0879C69.9707-40.0879 68.2617-39.2578 66.9922-38.1348L67.041-59.082C68.1152-59.7168 68.7988-60.791 68.9453-62.5977L69.7266-70.459C69.8242-71.8262 69.2383-73.3398 68.0664-74.3652L64.7949-77.1973C63.8672-78.0273 62.6953-78.418 61.6211-78.418C60.5469-78.418 59.4238-78.0273 58.4473-77.1973L55.1758-74.3652C54.0039-73.3398 53.418-71.8262 53.5156-70.459L54.2969-62.5977C54.4434-60.791 55.127-59.7168 56.2012-59.082L56.25-38.1348C54.9805-39.2578 53.3203-40.0879 51.0742-40.0879C46.9238-40.0879 43.9453-36.8652 43.9453-32.6172C43.9453-27.4902 46.5332-25.293 46.5332-23.3887C46.5332-22.168 41.7969-18.4082 41.7969-9.81445C41.7969 0.927734 49.9023 8.1543 61.6211 8.1543Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:secondary SFSymbolsPreviewWireframe" d="M61.6211 5.76172C72.1191 5.76172 79.0527-0.439453 79.0527-9.81445C79.0527-17.2363 74.3164-20.9961 74.3164-23.3887C74.3164-26.2695 76.9043-28.6621 76.9043-32.6172C76.9043-35.5957 74.9512-37.6953 72.168-37.6953C69.7754-37.6953 68.3105-36.3281 67.334-35.0098C66.5039-33.8867 65.918-33.0566 65.4297-33.0566C64.6484-33.0566 64.5996-34.5215 64.5996-35.7422L64.6484-59.5215C64.6484-60.6445 64.6973-60.7422 65.2832-60.9375C66.2109-61.2305 66.4551-61.7188 66.5527-62.8418L67.334-70.6543C67.3828-71.3379 67.0898-72.0215 66.5039-72.5586L63.2324-75.3906C62.6953-75.8789 62.1094-76.0254 61.6211-76.0254C61.1328-76.0254 60.5469-75.8789 60.0586-75.3906L56.7871-72.5586C56.2012-72.0215 55.9082-71.3379 55.957-70.6543L56.7383-62.8418C56.8359-61.7188 57.0801-61.2305 57.959-60.9375C58.5938-60.7422 58.6426-60.6445 58.6426-59.5215L58.6914-35.7422C58.6914-34.5215 58.5938-33.0566 57.8125-33.0566C57.3242-33.0566 56.7383-33.8867 55.9082-35.0098C54.9316-36.3281 53.5156-37.6953 51.0742-37.6953C48.3398-37.6953 46.3867-35.5957 46.3867-32.6172C46.3867-28.6621 48.9746-26.2695 48.9746-23.3887C48.9746-20.9961 44.2383-17.2363 44.2383-9.81445C44.2383-0.439453 51.1719 5.76172 61.6211 5.76172ZM53.0273-10.498C52.1484-10.791 51.6602-11.8164 51.9531-12.6953L55.1758-21.582C55.5176-22.4609 56.543-22.9492 57.4219-22.6074C58.3008-22.3145 58.8379-21.2891 58.4961-20.3613L55.2246-11.5234C54.9316-10.6445 53.9062-10.1562 53.0273-10.498ZM70.2637-10.498C69.3359-10.1562 68.3594-10.6445 68.0176-11.5234L64.7949-20.3613C64.4531-21.2891 64.9902-22.3145 65.8203-22.6074C66.748-22.9492 67.7246-22.4609 68.0664-21.582L71.2891-12.6953C71.582-11.8164 71.0938-10.791 70.2637-10.498Z"/>
+ <path class="monochrome-3 multicolor-3:tintColor hierarchical-3:primary SFSymbolsPreviewWireframe" d="M8.1543-2.68555C6.20117 1.75781 7.86133 8.05664 14.502 8.05664C16.9922 8.05664 18.8477 6.98242 21.0938 5.07812L30.5176-2.83203L39.9902 5.07812C42.2363 6.98242 44.0918 8.05664 46.5332 8.05664C53.2227 8.05664 54.8828 1.75781 52.9297-2.68555L35.9375-40.8691L35.9375-57.7637C35.9375-66.2598 37.4023-72.6074 37.4023-74.2188C37.4023-76.6602 35.6445-78.418 33.252-78.418C31.8359-78.418 30.6641-77.832 29.1504-76.1719L20.7031-66.5039C18.9453-64.3555 19.5312-61.4746 21.9238-60.3516C25.0488-58.9844 25.0977-58.9355 25.0977-57.7637L25.0977-40.8691Z"/>
+ <path class="monochrome-4 multicolor-4:tintColor hierarchical-4:primary SFSymbolsPreviewWireframe" d="M10.4004-1.75781C8.88672 1.5625 10.0586 5.66406 14.502 5.66406C16.2109 5.66406 17.5781 4.88281 19.5801 3.22266L29.7852-5.32227C30.127-5.61523 30.3223-5.71289 30.5176-5.71289C30.7617-5.71289 30.957-5.61523 31.2988-5.32227L41.5039 3.22266C43.5059 4.88281 44.873 5.66406 46.5332 5.66406C51.0254 5.66406 52.1973 1.5625 50.6836-1.75781L33.5449-40.332L33.5449-57.7637C33.5449-66.4551 35.0098-72.9492 35.0098-74.2188C35.0098-75.293 34.2773-76.0254 33.252-76.0254C32.5195-76.0254 31.8848-75.5859 30.957-74.5605L22.5098-64.8926C21.7773-64.0137 21.9727-62.9883 22.9492-62.5C26.3184-61.0352 27.4902-60.498 27.4902-57.7637L27.4902-40.332ZM35.3027-18.4082C34.2285-18.4082 33.3008-19.2871 33.3008-20.3613C33.3008-21.4355 34.2285-22.4609 35.3027-22.4609C36.4258-22.4609 37.3047-21.4844 37.3047-20.3613C37.3047-19.2383 36.4258-18.4082 35.3027-18.4082ZM37.2559-13.7695C36.1328-13.7695 35.2051-14.6973 35.2051-15.7715C35.2051-16.8945 36.1328-17.8711 37.2559-17.8711C38.3301-17.8711 39.3066-16.9434 39.3066-15.7715C39.3066-14.6973 38.3301-13.7695 37.2559-13.7695ZM39.1602-9.17969C38.0371-9.17969 37.1582-10.1074 37.1582-11.1816C37.1582-12.3047 38.0859-13.2812 39.1602-13.2812C40.2832-13.2812 41.2109-12.3047 41.2109-11.1816C41.2109-10.1562 40.2344-9.17969 39.1602-9.17969Z"/>
+ </g>
+ <g id="Ultralight-S" transform="matrix(1 0 0 1 505.94 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:tertiary SFSymbolsPreviewWireframe" d="M82.4835 3.47756C91.9439 3.47756 97.7774-0.783193 97.7774-7.56836C97.7774-14.6646 92.6051-16.9741 92.6051-20.7031C92.6051-23.6509 93.7735-25.9458 93.7735-28.7632C93.7735-32.8628 90.3316-35.7359 84.9171-36.3809L84.9171-59.666C84.9171-61.501 85.2066-62.0732 86.2218-62.7534C86.9122-63.1963 87.0655-63.3667 87.0167-63.9141L86.4307-73.3379C86.3819-73.8501 86.0264-74.209 85.6085-74.209L79.3585-74.209C78.9439-74.209 78.6304-73.8501 78.5816-73.3379L77.9957-63.9141C77.9469-63.3667 78.0582-63.1963 78.7486-62.7534C79.7637-62.0732 80.0953-61.501 80.0953-59.666L80.0953-36.3809C74.6353-35.7359 71.1968-32.8628 71.1968-28.7632C71.1968-25.9458 72.3653-23.6509 72.3653-20.7031C72.3653-16.9741 67.1929-14.6646 67.1929-7.56836C67.1929-0.783193 73.0718 3.47756 82.4835 3.47756ZM82.4835-18.0254C80.4053-18.0254 78.7247-19.748 78.7247-21.8262C78.7247-23.9043 80.4088-25.585 82.4835-25.585C84.5616-25.585 86.2389-23.9043 86.2389-21.8262C86.2389-19.748 84.5616-18.0254 82.4835-18.0254ZM77.587-7.458C77.1031-7.458 76.6363-7.87939 76.6363-8.4541C76.6363-9.02539 77.1065-9.40821 77.587-9.40821L87.3311-9.40821C87.857-9.40821 88.3272-9.02881 88.3272-8.4541C88.3272-7.87939 87.857-7.458 87.3311-7.458Z"/>
+ <path class="monochrome-1 multicolor-1:tintColor hierarchical-1:primary SFSymbolsPreviewWireframe" d="M55.9449 5.65676C66.2105 5.65676 73.2715-0.479969 73.2715-9.76904C73.2715-19.6343 68.5352-21.3506 68.5352-23.3433C68.5352-26.1558 71.1231-28.353 71.1231-32.6172C71.1231-35.73 68.962-37.7266 66.4009-37.7266C63.8404-37.7266 62.3584-35.8521 60.4078-33.0035L60.4112-58.4917C61.5308-58.9902 62.169-59.9282 62.3155-61.417L63.0513-69.2783C63.149-70.5093 62.6539-71.6143 61.7544-72.3672L58.4376-75.2446C57.7823-75.8023 56.8374-76.1929 55.9449-76.1929C55.0523-76.1929 54.1109-75.8023 53.4976-75.2446L50.1807-72.3672C49.2813-71.6143 48.7862-70.5093 48.8838-69.2783L49.6197-61.417C49.7662-59.9282 50.4043-58.9902 51.524-58.4917L51.5274-32.958C49.5313-35.8521 48.0528-37.7266 45.4888-37.7266C42.9278-37.7266 40.7666-35.73 40.7666-32.6172C40.7666-28.353 43.3545-26.1558 43.3545-23.3433C43.3545-21.3506 38.6182-19.6343 38.6182-9.76904C38.6182-0.479969 45.7246 5.65676 55.9449 5.65676Z"/>
+ <path class="monochrome-2 multicolor-2:tintColor hierarchical-2:secondary SFSymbolsPreviewWireframe" d="M55.9449 3.67287C65.1714 3.67287 71.2877-1.62011 71.2877-9.76904C71.2877-18.0991 66.5513-20.2241 66.5513-23.3433C66.5513-26.9053 69.1392-29.2978 69.1392-32.6172C69.1392-34.4605 68.0489-35.7427 66.4009-35.7427C64.4624-35.7427 63.3609-33.876 62.3843-32.4214C61.7359-31.48 61.2408-30.7407 60.5254-30.7407C58.7906-30.7407 58.4239-34.249 58.4239-35.8784L58.4273-58.25C58.4273-59.5093 58.5215-59.9248 59.4253-60.2564C60.0352-60.4585 60.2339-60.7651 60.3316-61.6157L61.0674-69.4282C61.1163-70.0664 60.8687-70.523 60.4644-70.8784L57.1475-73.7559C56.8374-74.0171 56.3877-74.209 55.9449-74.209C55.502-74.209 55.0523-74.0171 54.7456-73.7559L51.4288-70.8784C51.0699-70.523 50.8223-70.0664 50.8711-69.4282L51.607-61.6157C51.7046-60.7651 51.9034-60.4585 52.4644-60.2564C53.417-59.9248 53.5113-59.5093 53.5113-58.25L53.5147-35.8784C53.5147-34.249 53.0992-30.7407 51.4097-30.7407C50.6944-30.7407 50.1993-31.48 49.5508-32.4214C48.5743-33.876 47.4307-35.7427 45.4888-35.7427C43.8897-35.7427 42.7539-34.4605 42.7539-32.6172C42.7539-29.2978 45.3418-26.9053 45.3418-23.3433C45.3418-20.2241 40.6055-18.0991 40.6055-9.76904C40.6055-1.62011 46.7671 3.67287 55.9449 3.67287ZM48.4864-10.3164C47.9707-10.5186 47.6641-11.1353 47.8662-11.6055L51.3614-21.2642C51.5669-21.7798 52.1382-22.041 52.6993-21.8355C53.2149-21.6787 53.4795-21.062 53.3194-20.543L49.7754-10.9331C49.5733-10.4175 49.0474-10.1562 48.4864-10.3164ZM63.4976-10.3164C62.9332-10.1562 62.3653-10.4175 62.1597-10.9331L58.6646-20.543C58.459-21.062 58.7691-21.6787 59.2813-21.8355C59.8458-22.041 60.3682-21.7798 60.5738-21.2642L64.1143-11.6055C64.3165-11.1353 64.0098-10.5186 63.4976-10.3164Z"/>
+ <path class="monochrome-3 multicolor-3:tintColor hierarchical-3:primary SFSymbolsPreviewWireframe" d="M8.29053-1.36866C6.70068 2.25732 8.81493 5.60451 12.4131 5.60451C13.4956 5.60451 14.8062 5.25685 16.2803 4.07911L28.4287-6.01072L40.5806 4.07911C42.0547 5.25685 43.3652 5.60451 44.4444 5.60451C48.0459 5.60451 50.1602 2.25732 48.5703-1.36866L32.895-37.5088L32.895-56.4922C32.895-65.0337 34.3599-71.5176 34.3599-72.9473C34.3599-74.8438 33.0108-76.1929 31.1631-76.1929C30.1104-76.1929 29.2109-75.7432 27.8335-74.2193L19.4317-64.5513C18.0825-62.9024 18.5322-60.7935 20.2891-60.0337C23.6411-58.6211 24.0078-58.436 24.0078-56.4922L24.0078-37.645Z"/>
+ <path class="monochrome-4 multicolor-4:tintColor hierarchical-4:primary SFSymbolsPreviewWireframe" d="M10.1279-0.577158C9.15918 1.60791 10.104 3.62062 12.4131 3.62062C13.1685 3.62062 13.9453 3.38429 14.9937 2.54151L26.5157-7.04784C27.4478-7.74949 27.961-8.0742 28.4287-8.0742C28.8999-8.0742 29.4131-7.74949 30.3452-7.04784L41.8672 2.54151C42.9155 3.38429 43.6924 3.62062 44.4444 3.62062C46.7569 3.62062 47.7017 1.60791 46.7329-0.577158L30.9112-37.1079L30.9112-56.4922C30.9112-65.229 32.376-71.7686 32.376-72.9473C32.376-73.749 31.916-74.209 31.1631-74.209C30.6577-74.209 30.2046-73.9058 29.3223-72.9258L20.9204-63.2578C20.415-62.6514 20.4741-62.1255 21.0874-61.8643C24.502-60.3994 25.9917-59.6353 25.9917-56.4922L25.9917-37.2896ZM37.0737-8.05477C36.3628-8.05477 35.7075-8.70663 35.7075-9.41757C35.7075-10.1739 36.4082-10.836 37.0737-10.836C37.8789-10.836 38.5308-10.2227 38.5308-9.41757C38.5308-8.70321 37.8789-8.05477 37.0737-8.05477ZM35.3941-12.044C34.6797-12.044 34.0244-12.6538 34.0244-13.4102C34.0244-14.1699 34.6797-14.8286 35.3941-14.8286C36.1958-14.8286 36.8545-14.2188 36.8545-13.4102C36.8545-12.6992 36.1958-12.044 35.3941-12.044ZM33.711-16.0366C32.9966-16.0366 32.3902-16.6464 32.3902-17.4028C32.3902-18.1626 33.0454-18.8212 33.711-18.8212C34.5162-18.8212 35.126-18.208 35.126-17.4028C35.126-16.6953 34.4673-16.0366 33.711-16.0366Z"/>
+ </g>
+ </g>
+</svg>
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/Contents.json b/Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/Contents.json
new file mode 100644
index 000000000..baa04697e
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/Contents.json
@@ -0,0 +1,15 @@
+{
+ "info" : {
+ "author" : "xcode",
+ "version" : 1
+ },
+ "properties" : {
+ "symbol-rendering-intent" : "multicolor"
+ },
+ "symbols" : [
+ {
+ "filename" : "music.note.svg",
+ "idiom" : "universal"
+ }
+ ]
+}
diff --git a/Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/music.note.svg b/Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/music.note.svg
new file mode 100644
index 000000000..5ec5a1aa1
--- /dev/null
+++ b/Resources/iOS/Images.xcassets/MenuNavigation/songs.symbolset/music.note.svg
@@ -0,0 +1,101 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--Generator: Apple Native CoreSVG 341-->
+<!DOCTYPE svg
+PUBLIC "-//W3C//DTD SVG 1.1//EN"
+ "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3300 2200">
+ <!--glyph: "10046A", point size: 100.0, font version: "20.0d10e1", template writer version: "138.0.0"-->
+ <style>.monochrome-0 {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:music.note}
+
+.multicolor-0:tintColor {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:music.note}
+
+.hierarchical-0:primary {-sfsymbols-motion-group:0;-sfsymbols-layer-tags:music.note}
+
+.SFSymbolsPreviewWireframe {fill:none;opacity:1.0;stroke:black;stroke-width:0.5}
+</style>
+ <g id="Notes">
+ <rect height="2200" id="artboard" style="fill:white;opacity:1" width="3300" x="0" y="0"/>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="292" y2="292"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 322)">Weight/Scale Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 559.711 322)">Ultralight</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 856.422 322)">Thin</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1153.13 322)">Light</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1449.84 322)">Regular</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 1746.56 322)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2043.27 322)">Semibold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2339.98 322)">Bold</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2636.69 322)">Heavy</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:middle;" transform="matrix(1 0 0 1 2933.4 322)">Black</text>
+ <line style="fill:none;stroke:black;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1903" y2="1903"/>
+ <g transform="matrix(0.2 0 0 0.2 263 1933)">
+ <path d="m46.2402 4.15039c21.7773 0 39.4531-17.627 39.4531-39.4043s-17.6758-39.4043-39.4531-39.4043c-21.7285 0-39.4043 17.627-39.4043 39.4043s17.6758 39.4043 39.4043 39.4043Zm0-7.42188c-17.6758 0-31.9336-14.3066-31.9336-31.9824s14.2578-31.9824 31.9336-31.9824 31.9824 14.3066 31.9824 31.9824-14.3066 31.9824-31.9824 31.9824Zm-17.9688-31.9824c0 2.14844 1.51367 3.61328 3.75977 3.61328h10.498v10.5957c0 2.19727 1.46484 3.71094 3.61328 3.71094 2.24609 0 3.71094-1.51367 3.71094-3.71094v-10.5957h10.5957c2.19727 0 3.71094-1.46484 3.71094-3.61328 0-2.19727-1.51367-3.71094-3.71094-3.71094h-10.5957v-10.5469c0-2.24609-1.46484-3.75977-3.71094-3.75977-2.14844 0-3.61328 1.51367-3.61328 3.75977v10.5469h-10.498c-2.24609 0-3.75977 1.51367-3.75977 3.71094Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 281.506 1933)">
+ <path d="m58.5449 14.5508c27.4902 0 49.8047-22.3145 49.8047-49.8047s-22.3145-49.8047-49.8047-49.8047-49.8047 22.3145-49.8047 49.8047 22.3145 49.8047 49.8047 49.8047Zm0-8.30078c-22.9492 0-41.5039-18.5547-41.5039-41.5039s18.5547-41.5039 41.5039-41.5039 41.5039 18.5547 41.5039 41.5039-18.5547 41.5039-41.5039 41.5039Zm-22.6562-41.5039c0 2.39258 1.66016 4.00391 4.15039 4.00391h14.3555v14.4043c0 2.44141 1.66016 4.15039 4.05273 4.15039 2.44141 0 4.15039-1.66016 4.15039-4.15039v-14.4043h14.4043c2.44141 0 4.15039-1.61133 4.15039-4.00391 0-2.44141-1.70898-4.15039-4.15039-4.15039h-14.4043v-14.3555c0-2.49023-1.70898-4.19922-4.15039-4.19922-2.39258 0-4.05273 1.70898-4.05273 4.19922v14.3555h-14.3555c-2.49023 0-4.15039 1.70898-4.15039 4.15039Z"/>
+ </g>
+ <g transform="matrix(0.2 0 0 0.2 304.924 1933)">
+ <path d="m74.8535 28.3203c35.1074 0 63.623-28.4668 63.623-63.5742s-28.5156-63.623-63.623-63.623-63.5742 28.5156-63.5742 63.623 28.4668 63.5742 63.5742 63.5742Zm0-9.08203c-30.127 0-54.4922-24.3652-54.4922-54.4922s24.3652-54.4922 54.4922-54.4922 54.4922 24.3652 54.4922 54.4922-24.3652 54.4922-54.4922 54.4922Zm-28.8574-54.4922c0 2.58789 1.85547 4.39453 4.58984 4.39453h19.7266v19.7754c0 2.68555 1.85547 4.58984 4.44336 4.58984 2.68555 0 4.54102-1.85547 4.54102-4.58984v-19.7754h19.7754c2.68555 0 4.58984-1.80664 4.58984-4.39453 0-2.73438-1.85547-4.58984-4.58984-4.58984h-19.7754v-19.7266c0-2.73438-1.85547-4.63867-4.54102-4.63867-2.58789 0-4.44336 1.9043-4.44336 4.63867v19.7266h-19.7266c-2.73438 0-4.58984 1.85547-4.58984 4.58984Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 263 1953)">Design Variations</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1971)">Symbols are supported in up to nine weights and three scales.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1989)">For optimal layout with text and other symbols, vertically align</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 2007)">symbols with the adjacent text.</text>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="776" x2="776" y1="1919" y2="1933"/>
+ <g transform="matrix(0.2 0 0 0.2 776 1933)">
+ <path d="m16.5527 0.78125c2.58789 0 3.85742-0.976562 4.78516-3.71094l6.29883-17.2363h28.8086l6.29883 17.2363c0.927734 2.73438 2.19727 3.71094 4.73633 3.71094 2.58789 0 4.24805-1.5625 4.24805-4.00391 0-0.830078-0.146484-1.61133-0.537109-2.63672l-22.9004-60.9863c-1.12305-2.97852-3.125-4.49219-6.25-4.49219-3.02734 0-5.07812 1.46484-6.15234 4.44336l-22.9004 61.084c-0.390625 1.02539-0.537109 1.80664-0.537109 2.63672 0 2.44141 1.5625 3.95508 4.10156 3.95508Zm13.4766-28.3691 11.8652-32.8613h0.244141l11.8652 32.8613Z"/>
+ </g>
+ <line style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="792.836" x2="792.836" y1="1919" y2="1933"/>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 776 1953)">Margins</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1971)">Leading and trailing margins on the left and right side of each symbol</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 1989)">can be adjusted by modifying the x-location of the margin guidelines.</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2007)">Modifications are automatically applied proportionally to all</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 776 2025)">scales and weights.</text>
+ <g transform="matrix(0.2 0 0 0.2 1289 1933)">
+ <path d="m14.209 9.32617 8.49609 8.54492c4.29688 4.3457 9.22852 4.05273 13.8672-1.07422l53.4668-58.9355-4.83398-4.88281-53.0762 58.3984c-1.75781 2.00195-3.41797 2.49023-5.76172 0.146484l-5.85938-5.81055c-2.34375-2.29492-1.80664-4.00391 0.195312-5.81055l57.373-54.0039-4.88281-4.83398-57.959 54.4434c-4.93164 4.58984-5.32227 9.47266-1.02539 13.8184Zm32.0801-90.9668c-2.09961 2.05078-2.24609 4.93164-1.07422 6.88477 1.17188 1.80664 3.4668 2.97852 6.68945 2.14844 7.32422-1.70898 14.9414-2.00195 22.0703 2.68555l-2.92969 7.27539c-1.70898 4.15039-0.830078 7.08008 1.85547 9.81445l11.4746 11.5723c2.44141 2.44141 4.49219 2.53906 7.32422 2.05078l5.32227-0.976562 3.32031 3.36914-0.195312 2.7832c-0.195312 2.49023 0.439453 4.39453 2.88086 6.78711l3.80859 3.71094c2.39258 2.39258 5.46875 2.53906 7.8125 0.195312l14.5508-14.5996c2.34375-2.34375 2.24609-5.32227-0.146484-7.71484l-3.85742-3.80859c-2.39258-2.39258-4.24805-3.17383-6.64062-2.97852l-2.88086 0.244141-3.22266-3.17383 1.2207-5.61523c0.634766-2.83203-0.146484-5.0293-3.07617-7.95898l-10.9863-10.9375c-16.6992-16.6016-38.8672-16.2109-53.3203-1.75781Zm7.4707 1.85547c12.1582-8.88672 28.6133-7.37305 39.7461 3.75977l12.1582 12.0605c1.17188 1.17188 1.36719 2.09961 1.02539 3.80859l-1.61133 7.42188 7.51953 7.42188 4.93164-0.292969c1.26953-0.0488281 1.66016 0.0488281 2.63672 1.02539l2.88086 2.88086-12.207 12.207-2.88086-2.88086c-0.976562-0.976562-1.12305-1.36719-1.07422-2.68555l0.341797-4.88281-7.4707-7.42188-7.61719 1.26953c-1.61133 0.341797-2.34375 0.195312-3.56445-0.976562l-10.0098-10.0098c-1.26953-1.17188-1.41602-2.00195-0.634766-3.85742l4.39453-10.4492c-7.8125-7.27539-17.9688-10.4004-28.125-7.42188-0.78125 0.195312-1.07422-0.439453-0.439453-0.976562Z"/>
+ </g>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;font-weight:bold;" transform="matrix(1 0 0 1 1289 1953)">Exporting</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1971)">Symbols should be outlined when exporting to ensure the</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 1289 1989)">design is preserved when submitting to Xcode.</text>
+ <text id="template-version" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1933)">Template v.5.0</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1951)">Requires Xcode 15 or greater</text>
+ <text id="descriptive-name" style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1969)">Generated from music.note</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;text-anchor:end;" transform="matrix(1 0 0 1 3036 1987)">Typeset at 100.0 points</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 726)">Small</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1156)">Medium</text>
+ <text style="stroke:none;fill:black;font-family:sans-serif;font-size:13;" transform="matrix(1 0 0 1 263 1586)">Large</text>
+ </g>
+ <g id="Guides">
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 696)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="696" y2="696"/>
+ <line id="Capline-S" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="625.541" y2="625.541"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1126)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1126" y2="1126"/>
+ <line id="Capline-M" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1055.54" y2="1055.54"/>
+ <g id="H-reference" style="fill:#27AAE1;stroke:none;" transform="matrix(1 0 0 1 339 1556)">
+ <path d="M0.993654 0L3.63775 0L29.3281-67.1323L30.0303-67.1323L30.0303-70.459L28.1226-70.459ZM11.6885-24.4799L46.9815-24.4799L46.2315-26.7285L12.4385-26.7285ZM55.1196 0L57.7637 0L30.6382-70.459L29.4326-70.459L29.4326-67.1323Z"/>
+ </g>
+ <line id="Baseline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1556" y2="1556"/>
+ <line id="Capline-L" style="fill:none;stroke:#27AAE1;opacity:1;stroke-width:0.5;" x1="263" x2="3036" y1="1485.54" y2="1485.54"/>
+ <line id="right-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2969.68" x2="2969.68" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Black-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="2897.12" x2="2897.12" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1483.46" x2="1483.46" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Regular-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="1416.23" x2="1416.23" y1="600.785" y2="720.121"/>
+ <line id="right-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="590.446" x2="590.446" y1="600.785" y2="720.121"/>
+ <line id="left-margin-Ultralight-S" style="fill:none;stroke:#00AEEF;stroke-width:0.5;opacity:1.0;" x1="528.976" x2="528.976" y1="600.785" y2="720.121"/>
+ </g>
+ <g id="Symbols">
+ <g id="Black-S" transform="matrix(1 0 0 1 2897.12 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:primary SFSymbolsPreviewWireframe" d="M62.793-55.8594L62.793-69.9219C62.793-73.5352 59.7168-76.0742 56.2012-75.293L36.2793-70.9473C32.5684-70.166 30.5664-67.9688 30.5664-64.6973L30.5664-23.1934C30.5664-22.3145 30.3223-22.0215 29.7363-21.875L23.3887-20.5566C14.502-18.75 9.76562-13.8672 9.76562-6.49414C9.76562 1.07422 15.332 6.20117 23.4375 6.20117C33.0078 6.20117 40.332-1.2207 40.332-11.1328L40.332-46.3867C40.332-47.2656 39.7949-46.7773 40.7227-47.0215L58.8379-50.9766C61.2305-51.4648 62.793-53.418 62.793-55.8594Z"/>
+ </g>
+ <g id="Regular-S" transform="matrix(1 0 0 1 1416.23 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:primary SFSymbolsPreviewWireframe" d="M57.4707-55.6152L57.4707-70.2148C57.4707-72.3145 55.7617-73.7305 53.6621-73.291L33.5449-68.8965C30.9082-68.3105 29.4922-66.9434 29.4922-64.6484L29.4922-21.6797C29.7363-19.9219 28.9062-18.7988 27.3438-18.5059L21.2402-17.2363C13.4277-15.5762 9.76562-11.5723 9.76562-5.61523C9.76562 0.390625 14.4043 4.58984 20.8984 4.58984C26.6113 4.58984 35.2051 0.341797 35.2051-10.9863L35.2051-46.3379C35.2051-48.291 35.5469-48.584 37.2559-48.9258L55.2734-52.9297C56.5918-53.2227 57.4707-54.248 57.4707-55.6152Z"/>
+ </g>
+ <g id="Ultralight-S" transform="matrix(1 0 0 1 528.976 696)">
+ <path class="monochrome-0 multicolor-0:tintColor hierarchical-0:primary SFSymbolsPreviewWireframe" d="M51.7037-54.3892L51.7037-67.7627C51.7037-69.3174 50.4942-70.2339 49.0303-69.9307L31.5923-66.2173C30-65.8584 29.1289-64.8999 29.1289-63.377L29.356-22.5425C29.373-20.1943 28.1343-18.5718 25.9815-18.1426L19.9688-16.873C13.1099-15.4399 9.76562-12.1172 9.76562-6.8413C9.76562-1.65282 13.6777 1.91067 19.3545 1.91067C24.6587 1.91067 32.1626-1.74705 32.1626-12.0762L32.1626-45.4751C32.1626-47.9277 32.8223-48.7656 35.167-49.2891L50.2329-52.6118C51.1426-52.814 51.7037-53.4761 51.7037-54.3892Z"/>
+ </g>
+ </g>
+</svg>
diff --git a/Sources/Media Library/MediaViewControllers/AudioViewController.swift b/Sources/Media Library/MediaViewControllers/AudioViewController.swift
index f0cb9d7a3..338906dbf 100644
--- a/Sources/Media Library/MediaViewControllers/AudioViewController.swift
+++ b/Sources/Media Library/MediaViewControllers/AudioViewController.swift
@@ -38,3 +38,107 @@ class AudioViewController: MediaViewController {
navigationItem.titleView = nil
}
}
+
+class ArtistsViewController: MediaViewController {
+ override init(mediaLibraryService: MediaLibraryService) {
+ super.init(mediaLibraryService: mediaLibraryService)
+ setupUI()
+ }
+
+ private func setupUI() {
+ let localizedTitle: String = NSLocalizedString("ARTISTS", comment: "")
+ title = localizedTitle
+
+ let image: UIImage?
+ if #available(iOS 13.0, *) {
+ let color: UIColor = PresentationTheme.current.colors.tabBarIconColor
+ image = UIImage(named: "artists")?.withTintColor(color)
+ } else {
+ image = UIImage(named: "artists")
+ }
+
+ tabBarItem = UITabBarItem(title: localizedTitle, image: image, selectedImage: image)
+ }
+
+ override func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
+ return [ArtistCategoryViewController(mediaLibraryService)]
+ }
+}
+
+class AlbumsViewController: MediaViewController {
+ override init(mediaLibraryService: MediaLibraryService) {
+ super.init(mediaLibraryService: mediaLibraryService)
+ setupUI()
+ }
+
+ private func setupUI() {
+ let localizedTitle: String = NSLocalizedString("ALBUMS", comment: "")
+ title = localizedTitle
+
+ let image: UIImage?
+ if #available(iOS 13.0, *) {
+ let color: UIColor = PresentationTheme.current.colors.tabBarIconColor
+ image = UIImage(named: "albums")?.withTintColor(color)
+ } else {
+ image = UIImage(named: "albums")
+ }
+
+ tabBarItem = UITabBarItem(title: localizedTitle, image: image, selectedImage: image)
+ }
+
+ override func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
+ return [AlbumCategoryViewController(mediaLibraryService)]
+ }
+}
+
+class TracksViewController: MediaViewController {
+ override init(mediaLibraryService: MediaLibraryService) {
+ super.init(mediaLibraryService: mediaLibraryService)
+ setupUI()
+ }
+
+ private func setupUI() {
+ let localizedTitle: String = NSLocalizedString("SONGS", comment: "")
+ title = localizedTitle
+
+ let image: UIImage?
+ if #available(iOS 13.0, *) {
+ let color: UIColor = PresentationTheme.current.colors.tabBarIconColor
+ image = UIImage(named: "songs")?.withTintColor(color)
+ } else {
+ image = UIImage(named: "songs")
+ }
+
+ tabBarItem = UITabBarItem(title: localizedTitle, image: image, selectedImage: image)
+ }
+
+ override func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
+ return [TrackCategoryViewController(mediaLibraryService)]
+ }
+}
+
+class GenresViewController: MediaViewController {
+ override init(mediaLibraryService: MediaLibraryService) {
+ super.init(mediaLibraryService: mediaLibraryService)
+ setupUI()
+ }
+
+ private func setupUI() {
+ let localizedTitle: String = NSLocalizedString("GENRES", comment: "")
+ title = localizedTitle
+
+ let image: UIImage?
+ if #available(iOS 13.0, *) {
+ let color: UIColor = PresentationTheme.current.colors.tabBarIconColor
+ image = UIImage(named: "genres")?.withTintColor(color)
+ } else {
+ image = UIImage(named: "genres")
+ }
+
+ tabBarItem = UITabBarItem(title: localizedTitle, image: image, selectedImage: image)
+ }
+
+ override func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
+ return [GenreCategoryViewController(mediaLibraryService)]
+ }
+}
--
GitLab
From 56904965735ffcbc7b8c43e789b7cdfe74cf9f69 Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:44:03 +0100
Subject: [PATCH 6/7] TabBarCoordinator: Enable the side bar navigation
The side bar navigation is now enabled on iPad running iPadOS 18
and versions above.
This is a wip prototype that was aimed to check the amount of work
needed in order to make this happen.
Currently each tab of the Audio section are made as proper navigation
tabs in that side bar only to avoid any huge refactor around the
PagingViewController and related classes.
---
Sources/App/iOS/TabBarCoordinator.swift | 133 ++++++++++++++++++++++--
1 file changed, 124 insertions(+), 9 deletions(-)
diff --git a/Sources/App/iOS/TabBarCoordinator.swift b/Sources/App/iOS/TabBarCoordinator.swift
index 9686ad4bf..2cb4eed84 100644
--- a/Sources/App/iOS/TabBarCoordinator.swift
+++ b/Sources/App/iOS/TabBarCoordinator.swift
@@ -21,6 +21,54 @@ class TabBarCoordinator: NSObject {
private lazy var editToolbar = EditToolbar()
+ private lazy var videoNavigationController: UINavigationController = {
+ let rootViewController = VideoViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var audioNavigationController: UINavigationController = {
+ let rootViewController = AudioViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var artistsNavigationController: UINavigationController = {
+ let rootViewController = ArtistsViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var albumsNavigationController: UINavigationController = {
+ let rootViewController = AlbumsViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var tracksNavigationController: UINavigationController = {
+ let rootViewController = TracksViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var genresNavigationController: UINavigationController = {
+ let rootViewController = GenresViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var playlistsNavigationController: UINavigationController = {
+ let rootViewController = PlaylistViewController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var browseNavigationController: UINavigationController? = {
+ guard let rootViewController = VLCServerListViewController(medialibraryService: mediaLibraryService) else {
+ return nil
+ }
+
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
+ private lazy var settingsNavigationController: UINavigationController = {
+ let rootViewController = SettingsController(mediaLibraryService: mediaLibraryService)
+ return UINavigationController(rootViewController: rootViewController)
+ }()
+
// MARK: - Init
@objc init(tabBarController: BottomTabBarController, mediaLibraryService: MediaLibraryService) {
@@ -38,21 +86,79 @@ class TabBarCoordinator: NSObject {
setupViewControllers()
setupEditToolbar()
updateTheme()
+ tabBarController.title = "VLC iOS"
+ if #available(iOS 18.0, *) {
+ tabBarController.mode = .tabSidebar
+ let sideBar = tabBarController.sidebar
+ sideBar.isHidden = false
+ sideBar.preferredLayout = .overlap
+ sideBar.delegate = self
+ }
}
private func setupViewControllers() {
- let controllers: [UIViewController] = [
- VideoViewController(mediaLibraryService: mediaLibraryService),
- AudioViewController(mediaLibraryService: mediaLibraryService),
- PlaylistViewController(mediaLibraryService: mediaLibraryService),
- VLCServerListViewController(medialibraryService: mediaLibraryService),
- SettingsController(mediaLibraryService: mediaLibraryService)
- ]
-
- tabBarController.viewControllers = controllers.map { UINavigationController(rootViewController: $0) }
+ var controllers: [UINavigationController] = [videoNavigationController]
+
+ if #available(iOS 18.0, *), UIDevice.current.userInterfaceIdiom == .pad,
+ !tabBarController.sidebar.isHidden {
+ controllers.append(artistsNavigationController)
+ controllers.append(albumsNavigationController)
+ controllers.append(tracksNavigationController)
+ controllers.append(genresNavigationController)
+ controllers.append(playlistsNavigationController)
+
+ if let browseNavigationController = browseNavigationController {
+ controllers.append(browseNavigationController)
+ }
+
+ controllers.append(settingsNavigationController)
+ tabBarController.viewControllers = controllers
+ } else {
+ controllers.append(audioNavigationController)
+ controllers.append(playlistsNavigationController)
+
+ if let browseNavigationController = browseNavigationController {
+ controllers.append(browseNavigationController)
+ }
+
+ controllers.append(settingsNavigationController)
+ tabBarController.viewControllers = controllers
+ }
+
tabBarController.selectedIndex = UserDefaults.standard.integer(forKey: kVLCTabBarIndex)
}
+ private func updateTabBarIndexIfNeeded() {
+ let userDefaults = UserDefaults.standard
+ var tabIndex: Int = userDefaults.integer(forKey: kVLCTabBarIndex)
+
+ if #available(iOS 18.0, *), UIDevice.current.userInterfaceIdiom == .pad,
+ !tabBarController.sidebar.isHidden {
+ switch tabIndex {
+ case 0, 1:
+ break
+ default:
+ tabIndex += 3
+ break
+ }
+ } else {
+ switch tabIndex {
+ case 0:
+ tabIndex = 0
+ break
+ case 1, 2, 3, 4:
+ tabIndex = 1
+ break
+ default:
+ tabIndex -= 3
+ break
+ }
+ }
+
+ tabBarController.selectedIndex = tabIndex
+ userDefaults.set(tabIndex, forKey: kVLCTabBarIndex)
+ }
+
func setupEditToolbar() {
editToolbar.isHidden = true
editToolbar.translatesAutoresizingMaskIntoConstraints = false
@@ -108,6 +214,7 @@ class TabBarCoordinator: NSObject {
bottomBarLayer.shadowOpacity = 0.6
bottomBarLayer.shadowPath = UIBezierPath(rect: bottomBar.bounds).cgPath
+ tabBarController.view.backgroundColor = colors.background
editToolbar.backgroundColor = colors.tabBarColor
tabBarController.viewControllers?.forEach {
@@ -162,3 +269,11 @@ extension TabBarCoordinator: UITabBarControllerDelegate {
UserDefaults.standard.set(viewControllerIndex, forKey: kVLCTabBarIndex)
}
}
+
+@available(iOS 18.0, *)
+extension TabBarCoordinator: UITabBarController.Sidebar.Delegate {
+ func tabBarController(_ tabBarController: UITabBarController, sidebarVisibilityWillChange sidebar: UITabBarController.Sidebar, animator: any UITabBarController.Sidebar.Animating) {
+ setupViewControllers()
+ updateTabBarIndexIfNeeded()
+ }
+}
--
GitLab
From 367edbfb51aa3a5cb86372cd3e1efff40f8a52d3 Mon Sep 17 00:00:00 2001
From: Diogo Simao Marques <dogo@videolabs.io>
Date: Tue, 11 Feb 2025 16:47:58 +0100
Subject: [PATCH 7/7] BottomTabBarController: Disable the bottom tab bar
This disables the bottom tab bar hack in order to properly have a
side bar navigation on iPad.
---
.../View Controller/BottomTabBarController.swift | 10 +++++-----
1 file changed, 5 insertions(+), 5 deletions(-)
diff --git a/Sources/UI Elements/View Controller/BottomTabBarController.swift b/Sources/UI Elements/View Controller/BottomTabBarController.swift
index 2017354b2..38db94a80 100644
--- a/Sources/UI Elements/View Controller/BottomTabBarController.swift
+++ b/Sources/UI Elements/View Controller/BottomTabBarController.swift
@@ -21,11 +21,11 @@ class BottomTabBarController: UITabBarController {
}()
lazy var isBottomBarActive: Bool = {
- if #available(iOS 18.0, *), UIDevice.current.userInterfaceIdiom == .pad,
- self.responds(to: Selector("setTabBarHidden:animated:")) {
- self.perform(Selector("setTabBarHidden:animated:"), with: true, with: true)
- return true
- }
+// if #available(iOS 18.0, *), UIDevice.current.userInterfaceIdiom == .pad,
+// self.responds(to: Selector("setTabBarHidden:animated:")) {
+// self.perform(Selector("setTabBarHidden:animated:"), with: true, with: true)
+// return true
+// }
return false
}()
--
GitLab