diff --git a/src/settings/icons.scss b/src/settings/icons.scss index ad7061418..70e844c2b 100644 --- a/src/settings/icons.scss +++ b/src/settings/icons.scss @@ -1,100 +1,97 @@ /* SETTINGS SIDEBAR ICONS */ %settingsSidebar { - // USER SETTINGS - [aria-label='User Settings'] { - // ICON MAP - $icons: ( - // My Account - 'my-account': 'https://clearvision.gitlab.io/icons/person.svg', - // User Profile - 'profile-customization': 'https://clearvision.gitlab.io/icons/user_profile.svg', - // Privacy & Safety - 'privacy-&-safety': 'https://clearvision.gitlab.io/icons/security.svg', - // Authorized Apps - 'authorized-apps': 'https://clearvision.gitlab.io/icons/apps.svg', - // Connections - 'connections': 'https://clearvision.gitlab.io/icons/link.svg', + // ICON MAP + $icons: ( + // My Account + 'my-account': 'https://clearvision.gitlab.io/icons/person.svg', + // User Profile + 'profile-customization': 'https://clearvision.gitlab.io/icons/user_profile.svg', + // Privacy & Safety + 'privacy-&-safety': 'https://clearvision.gitlab.io/icons/security.svg', + // Authorized Apps + 'authorized-apps': 'https://clearvision.gitlab.io/icons/apps.svg', + // Connections + 'connections': 'https://clearvision.gitlab.io/icons/link.svg', - // Discord Nitro - 'discord-nitro': 'https://clearvision.gitlab.io/icons/nitro.svg', - // Server Boost - 'nitro-server-boost': 'https://clearvision.gitlab.io/icons/server_boost.svg', - // Subscriptions - 'subscriptions': 'https://clearvision.gitlab.io/icons/subscriptions.svg', - // Gift Inventory - 'library-inventory': 'https://clearvision.gitlab.io/icons/gift.svg', - // Billing - 'billing': 'https://clearvision.gitlab.io/icons/payment.svg', + // Discord Nitro + 'discord-nitro': 'https://clearvision.gitlab.io/icons/nitro.svg', + // Server Boost + 'nitro-server-boost': 'https://clearvision.gitlab.io/icons/server_boost.svg', + // Subscriptions + 'subscriptions': 'https://clearvision.gitlab.io/icons/subscriptions.svg', + // Gift Inventory + 'library-inventory': 'https://clearvision.gitlab.io/icons/gift.svg', + // Billing + 'billing': 'https://clearvision.gitlab.io/icons/payment.svg', - // Appearance - 'appearance': 'https://clearvision.gitlab.io/icons/camera.svg', - // Accessibility - 'accessibility': 'https://clearvision.gitlab.io/icons/accessibility.svg', - // Voice & Video - 'voice-&-video': 'https://clearvision.gitlab.io/icons/mic.svg', - // Text & Images - 'text-&-images': 'https://clearvision.gitlab.io/icons/chat.svg', - // Notifications - 'notifications': 'https://clearvision.gitlab.io/icons/notifications.svg', - // Keybinds - 'keybinds': 'https://clearvision.gitlab.io/icons/keyboard.svg', - // Language - 'language': 'https://clearvision.gitlab.io/icons/language.svg', - // Windows Settings - 'windows': 'https://clearvision.gitlab.io/icons/windows.svg', - // Linux Settings - 'linux': 'https://clearvision.gitlab.io/icons/linux.svg', - // Streamer Mode - 'streamer-mode': 'https://clearvision.gitlab.io/icons/videocam.svg', - // Advanced - 'advanced': 'https://clearvision.gitlab.io/icons/bug.svg', + // Appearance + 'appearance': 'https://clearvision.gitlab.io/icons/camera.svg', + // Accessibility + 'accessibility': 'https://clearvision.gitlab.io/icons/accessibility.svg', + // Voice & Video + 'voice-&-video': 'https://clearvision.gitlab.io/icons/mic.svg', + // Text & Images + 'text-&-images': 'https://clearvision.gitlab.io/icons/chat.svg', + // Notifications + 'notifications': 'https://clearvision.gitlab.io/icons/notifications.svg', + // Keybinds + 'keybinds': 'https://clearvision.gitlab.io/icons/keyboard.svg', + // Language + 'language': 'https://clearvision.gitlab.io/icons/language.svg', + // Windows Settings + 'windows': 'https://clearvision.gitlab.io/icons/windows.svg', + // Linux Settings + 'linux': 'https://clearvision.gitlab.io/icons/linux.svg', + // Streamer Mode + 'streamer-mode': 'https://clearvision.gitlab.io/icons/videocam.svg', + // Advanced + 'advanced': 'https://clearvision.gitlab.io/icons/bug.svg', - // Game Activity - 'game-activity': 'https://clearvision.gitlab.io/icons/games.svg', - // Overlay - 'overlay': 'https://clearvision.gitlab.io/icons/aspect_ratio.svg', + // Game Activity + 'game-activity': 'https://clearvision.gitlab.io/icons/games.svg', + // Overlay + 'overlay': 'https://clearvision.gitlab.io/icons/aspect_ratio.svg', - // Change Log - 'changelog': 'https://clearvision.gitlab.io/icons/history.svg', - // HypeSquad - 'hypesquad-online': 'https://clearvision.gitlab.io/icons/hypesquad.svg', + // Change Log + 'changelog': 'https://clearvision.gitlab.io/icons/history.svg', + // HypeSquad + 'hypesquad-online': 'https://clearvision.gitlab.io/icons/hypesquad.svg', - /* Log Out - for reference only - 'logout': 'https://clearvision.gitlab.io/icons/exit.svg' - */ - ); + /* Log Out - for reference only + 'logout': 'https://clearvision.gitlab.io/icons/exit.svg' + */ + ); - // GENERAL STYLES - %tabBarItem { - padding-left: 50px !important; - &:before { - content: ''; - position: absolute; - width: 24px; - height: 24px; - left: 15px; - margin-top: -2px; - } - &:hover:before { - transform: rotateY(180deg); - transition: all 0.15s ease-in-out; - } + // GENERAL STYLES + %tabBarItem { + padding-left: 50px !important; + &:before { + content: ''; + position: absolute; + width: 24px; + height: 24px; + left: 15px; + margin-top: -2px; + } + &:hover:before { + transform: rotateY(180deg); + transition: all 0.15s ease-in-out; } + } - // ICON STYLES - @each $i, $u in $icons { - %tabBarItem[aria-controls='#{$i}-tab']:before { - background-image: url(#{$u}); - } + // ICON STYLES + @each $i, $u in $icons { + %tabBarItem[aria-controls='#{$i}-tab']:before { + background-image: url(#{$u}); } + } - // DANGER - %tabBarItem { - &[aria-controls=logout-tab] { - &:before { - -webkit-mask: url(https://clearvision.gitlab.io/icons/exit.svg); - mask: url(https://clearvision.gitlab.io/icons/exit.svg); - } + // DANGER + %tabBarItem { + &[aria-controls=logout-tab] { + &:before { + -webkit-mask: url(https://clearvision.gitlab.io/icons/exit.svg); + mask: url(https://clearvision.gitlab.io/icons/exit.svg); } } } diff --git a/src/settings/sidebar.scss b/src/settings/sidebar.scss index cb14ba93a..547aba065 100644 --- a/src/settings/sidebar.scss +++ b/src/settings/sidebar.scss @@ -55,7 +55,7 @@ text-overflow: ellipsis; } } - [aria-label='User Settings'] %tabBarItem { + %tabBarItem { &:nth-child(6), &:nth-child(13), &:nth-child(25) { @@ -153,4 +153,4 @@ color: hsla(0, 0%, 100%, 0.7); } } -} \ No newline at end of file +}