diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1ac3bae..861ff4c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,9 @@
# Changelog
+## 1.8.0
+* Added colorblind mode (settings -> rising -> colorblind mode)
+
+
## 1.7.0
* Option for serving ads in random order
* Fixed Twitter previews crashing the app
diff --git a/README.md b/README.md
index 0954309..d1e7b37 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,7 @@
# Download
-[Windows](https://github.com/mrstallion/fchat-rising/releases/download/v1.7.0/F-Chat-Rising-1.7.0-win.exe) (75 MB)
-| [MacOS](https://github.com/mrstallion/fchat-rising/releases/download/v1.7.0/F-Chat-Rising-1.7.0-macos.dmg) (76 MB)
-| [Linux](https://github.com/mrstallion/fchat-rising/releases/download/v1.7.0/F-Chat-Rising-1.7.0-linux.AppImage) (76 MB)
+[Windows](https://github.com/mrstallion/fchat-rising/releases/download/v1.8.0/F-Chat-Rising-1.8.0-win.exe) (75 MB)
+| [MacOS](https://github.com/mrstallion/fchat-rising/releases/download/v1.8.0/F-Chat-Rising-1.8.0-macos.dmg) (76 MB)
+| [Linux](https://github.com/mrstallion/fchat-rising/releases/download/v1.8.0/F-Chat-Rising-1.8.0-linux.AppImage) (76 MB)
# F-Chat Rising
@@ -66,6 +66,7 @@ This repository contains a heavily customized version of the mainline F-Chat 3.0
* PM list shows characters' online status as a colored icon
* Use `Ctrl+Tab`, `Ctrl+Shift+Tab`, `Ctrl+PgDown`, and `Ctrl+PgUp` to switch between character tabs
* Show number of unread notes and messages in the bottom right corner
+ * Colorblind mode
* Technical Details for Nerds
* Upgraded to Electron 10.x
* Replaced `node-spellchecker` with the built-in spellchecker that ships with Electron 8+
diff --git a/chat/ChatView.vue b/chat/ChatView.vue
index 88208c4..f2c787f 100644
--- a/chat/ChatView.vue
+++ b/chat/ChatView.vue
@@ -362,6 +362,10 @@
getClasses(conversation: Conversation): string {
return conversation === core.conversations.selectedConversation ? ' active' : unreadClasses[conversation.unread];
}
+
+ isColorblindModeActive(): boolean {
+ return core.state.settings.risingColorblindMode;
+ }
}
diff --git a/chat/ConversationView.vue b/chat/ConversationView.vue
index 749edb1..c2ba950 100644
--- a/chat/ConversationView.vue
+++ b/chat/ConversationView.vue
@@ -785,8 +785,8 @@
padding-bottom: 2px;
&.unicorn {
- background-color: #00adad;
- border: solid 1px #1d9a9a;
+ background-color: var(--scoreUnicornMatchBg);
+ border: 1px solid var(--scoreUnicornMatchFg);
box-shadow: 0 0 5px 0 rgba(255, 255, 255, 0.5);
&::before {
diff --git a/chat/SettingsView.vue b/chat/SettingsView.vue
index 6de751a..8f6d8f8 100644
--- a/chat/SettingsView.vue
+++ b/chat/SettingsView.vue
@@ -192,6 +192,13 @@
+
+
+
+
@@ -260,6 +267,7 @@
risingComparisonInSearch!: boolean;
risingShowUnreadOfflineCount!: boolean;
+ risingColorblindMode!: boolean;
async load(): Promise {
@@ -295,6 +303,8 @@
this.risingComparisonInUserMenu = settings.risingComparisonInUserMenu;
this.risingComparisonInSearch = settings.risingComparisonInSearch;
this.risingShowUnreadOfflineCount = settings.risingShowUnreadOfflineCount;
+
+ this.risingColorblindMode = settings.risingColorblindMode;
}
async doImport(): Promise {
@@ -347,7 +357,9 @@
risingCharacterPreview: this.risingCharacterPreview,
risingComparisonInUserMenu: this.risingComparisonInUserMenu,
risingComparisonInSearch: this.risingComparisonInSearch,
- risingShowUnreadOfflineCount: this.risingShowUnreadOfflineCount
+ risingShowUnreadOfflineCount: this.risingShowUnreadOfflineCount,
+
+ risingColorblindMode: this.risingColorblindMode
};
if(this.notifications) await core.notifications.requestPermission();
}
diff --git a/chat/assets/filters.svg b/chat/assets/filters.svg
new file mode 100644
index 0000000..5708e81
--- /dev/null
+++ b/chat/assets/filters.svg
@@ -0,0 +1,79 @@
+
+
diff --git a/chat/common.ts b/chat/common.ts
index 68745fb..b7d72fb 100644
--- a/chat/common.ts
+++ b/chat/common.ts
@@ -53,6 +53,7 @@ export class Settings implements ISettings {
risingComparisonInSearch = true;
risingShowUnreadOfflineCount = true;
+ risingColorblindMode = false;
}
diff --git a/chat/interfaces.ts b/chat/interfaces.ts
index c83fbac..f055624 100644
--- a/chat/interfaces.ts
+++ b/chat/interfaces.ts
@@ -219,6 +219,7 @@ export namespace Settings {
readonly risingComparisonInSearch: boolean;
readonly risingShowUnreadOfflineCount: boolean;
+ readonly risingColorblindMode: boolean;
}
}
diff --git a/docs/_config.yml b/docs/_config.yml
index ca2acfa..3a493c4 100644
--- a/docs/_config.yml
+++ b/docs/_config.yml
@@ -49,7 +49,7 @@ theme: jekyll-theme-slate
changelog: https://github.com/mrstallion/fchat-rising/blob/master/CHANGELOG.md
download:
- version: 1.7.0
+ version: 1.8.0
url: https://github.com/mrstallion/fchat-rising/releases/download/v%VERSION%/F-Chat-Rising-%VERSION%-%PLATFORM_TAIL%
diff --git a/electron/Index.vue b/electron/Index.vue
index bbc2382..858c52d 100644
--- a/electron/Index.vue
+++ b/electron/Index.vue
@@ -443,11 +443,17 @@
}
- getThemeClass(): string {
- return `theme-${this.settings.theme}`;
+ getThemeClass(): Record {
+ try {
+ return {
+ [`theme-${this.settings.theme}`]: true,
+ colorblindMode: core.state.settings.risingColorblindMode
+ };
+ } catch(err) {
+ return { [`theme-${this.settings.theme}`]: true };
+ }
}
-
nextProfile(): void {
if (!this.nextProfileAvailable()) {
return;
diff --git a/electron/package.json b/electron/package.json
index 4ee680e..af0106f 100644
--- a/electron/package.json
+++ b/electron/package.json
@@ -1,6 +1,6 @@
{
"name": "fchat",
- "version": "1.6.0",
+ "version": "1.8.0",
"author": "The F-List Team and Mister Stallion (Esq.)",
"description": "F-List.net Chat Client",
"main": "main.js",
diff --git a/package.json b/package.json
index 0ead2a0..38d1155 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "f-list-rising",
- "version": "1.6.0",
+ "version": "1.8.0",
"author": "The F-List Team and and Mister Stallion (Esq.)",
"description": "A heavily modded F-Chat 3.0 client for F-List",
"license": "MIT",
diff --git a/scss/_rising.scss b/scss/_rising.scss
index 19eb594..e52bc45 100644
--- a/scss/_rising.scss
+++ b/scss/_rising.scss
@@ -1,55 +1,54 @@
-:root {
- --scoreMatchBg: #{$scoreMatchBg};
- --scoreMatchFg: #{$scoreMatchFg};
- --scoreWeakMatchBg: #{$scoreWeakMatchBg};
- --scoreWeakMatchFg: #{$scoreWeakMatchFg};
- --scoreWeakMismatchBg: #{$scoreWeakMismatchBg};
- --scoreWeakMismatchFg: #{$scoreWeakMismatchFg};
- --scoreMismatchBg: #{$scoreMismatchBg};
- --scoreMismatchFg: #{$scoreMismatchFg};
- --scoreTitleColor: #{$scoreTitleColor};
- --scoreMinimizeButtonFg: #{$scoreMinimizeButtonFg};
- --scoreMinimizeButtonBg: #{$scoreMinimizeButtonBg};
- --scoreReportBg: #{$scoreReportBg};
+$risingVariables: (
+ scoreMatchBg: #{$scoreMatchBg},
+ scoreMatchFg: #{$scoreMatchFg},
+ scoreWeakMatchBg: #{$scoreWeakMatchBg},
+ scoreWeakMatchFg: #{$scoreWeakMatchFg},
+ scoreWeakMismatchBg: #{$scoreWeakMismatchBg},
+ scoreWeakMismatchFg: #{$scoreWeakMismatchFg},
+ scoreMismatchBg: #{$scoreMismatchBg},
+ scoreMismatchFg: #{$scoreMismatchFg},
+ scoreTitleColor: #{$scoreTitleColor},
+ scoreMinimizeButtonFg: #{$scoreMinimizeButtonFg},
+ scoreMinimizeButtonBg: #{$scoreMinimizeButtonBg},
+ scoreReportBg: #{$scoreReportBg},
- --scoreFadedMatchBg: #{$scoreFadedMatchBg};
- --scoreFadedMatchFg: #{$scoreFadedMatchFg};
- --scoreFadedWeakMatchBg: #{$scoreFadedWeakMatchBg};
- --scoreFadedWeakMatchFg: #{$scoreFadedWeakMatchFg};
- --scoreFadedWeakMismatchBg: #{$scoreFadedWeakMismatchBg};
- --scoreFadedWeakMismatchFg: #{$scoreFadedWeakMismatchFg};
- --scoreFadedMismatchBg: #{$scoreFadedMismatchBg};
- --scoreFadedMismatchFg: #{$scoreFadedMismatchFg};
+ scoreFadedMatchBg: #{$scoreFadedMatchBg},
+ scoreFadedMatchFg: #{$scoreFadedMatchFg},
+ scoreFadedWeakMatchBg: #{$scoreFadedWeakMatchBg},
+ scoreFadedWeakMatchFg: #{$scoreFadedWeakMatchFg},
+ scoreFadedWeakMismatchBg: #{$scoreFadedWeakMismatchBg},
+ scoreFadedWeakMismatchFg: #{$scoreFadedWeakMismatchFg},
+ scoreFadedMismatchBg: #{$scoreFadedMismatchBg},
+ scoreFadedMismatchFg: #{$scoreFadedMismatchFg},
- --scoreStandoutMatchBorderColor: #{$scoreStandoutMatchBorderColor};
- --scoreStandoutMatchBgColor: #{$scoreStandoutMatchBgColor};
- --scoreStandoutWeakMatchBorderColor: #{$scoreStandoutWeakMatchBorderColor};
- --scoreStandoutWeakMatchBgColor: #{$scoreStandoutWeakMatchBgColor};
- --scoreStandoutNeutralBorderColor: #{$scoreStandoutNeutralBorderColor};
- --scoreStandoutWeakMismatchBorderColor: #{$scoreStandoutWeakMismatchBorderColor};
- --scoreStandoutWeakMismatchBgColor: #{$scoreStandoutWeakMismatchBgColor};
- --scoreStandoutMismatchBorderColor: #{$scoreStandoutMismatchBorderColor};
+ scoreStandoutMatchBorderColor: #{$scoreStandoutMatchBorderColor},
+ scoreStandoutMatchBgColor: #{$scoreStandoutMatchBgColor},
+ scoreStandoutWeakMatchBorderColor: #{$scoreStandoutWeakMatchBorderColor},
+ scoreStandoutWeakMatchBgColor: #{$scoreStandoutWeakMatchBgColor},
+ scoreStandoutNeutralBorderColor: #{$scoreStandoutNeutralBorderColor},
+ scoreStandoutWeakMismatchBorderColor: #{$scoreStandoutWeakMismatchBorderColor},
+ scoreStandoutWeakMismatchBgColor: #{$scoreStandoutWeakMismatchBgColor},
+ scoreStandoutMismatchBorderColor: #{$scoreStandoutMismatchBorderColor},
- --characterImageWrapperBg: #{$characterImageWrapperBg};
- --characterGuestbookPostBg: #{$characterGuestbookPostBg};
- --characterGuestbookPostBorderColor: #{$characterGuestbookPostBorderColor};
- --characterGuestbookReplyBg: #{$characterGuestbookReplyBg};
- --characterGuestbookTimestampFg: #{$characterGuestbookTimestampFg};
- --characterKinkCustomColor: #{$characterKinkCustomColor};
- --characterKinkCustomBorderColor: #{$characterKinkCustomBorderColor};
- --characterKinkStockColor: #{$characterKinkStockColor};
- --characterKinkStockHighlightedColor: #{$characterKinkStockHighlightedColor};
- --characterInfotagColor: #{$characterInfotagColor};
+ characterImageWrapperBg: #{$characterImageWrapperBg},
+ characterGuestbookPostBg: #{$characterGuestbookPostBg},
+ characterGuestbookPostBorderColor: #{$characterGuestbookPostBorderColor},
+ characterGuestbookReplyBg: #{$characterGuestbookReplyBg},
+ characterGuestbookTimestampFg: #{$characterGuestbookTimestampFg},
+ characterKinkCustomColor: #{$characterKinkCustomColor},
+ characterKinkCustomBorderColor: #{$characterKinkCustomBorderColor},
+ characterKinkStockColor: #{$characterKinkStockColor},
+ characterKinkStockHighlightedColor: #{$characterKinkStockHighlightedColor},
+ characterInfotagColor: #{$characterInfotagColor},
- --messageTimeBgColor: #{$messageTimeBgColor};
- --messageTimeFgColor: #{$messageTimeFgColor};
+ messageTimeBgColor: #{$messageTimeBgColor},
+ messageTimeFgColor: #{$messageTimeFgColor},
- --headerBackgroundMaskColor: #{$headerBackgroundMaskColor};
+ headerBackgroundMaskColor: #{$headerBackgroundMaskColor},
- --linkForcedColor: #{$linkForcedColor};
- --tabSecondaryFgColor: #{$tabSecondaryFgColor};
-
- --input-bg: #{$input-bg};
- --input-color: #{$input-color};
-}
+ linkForcedColor: #{$linkForcedColor},
+ tabSecondaryFgColor: #{$tabSecondaryFgColor},
+ input-bg: #{$input-bg},
+ input-color: #{$input-color},
+);
diff --git a/scss/themes/_chat.scss b/scss/themes/_chat.scss
index f7ef985..53fc493 100644
--- a/scss/themes/_chat.scss
+++ b/scss/themes/_chat.scss
@@ -34,6 +34,14 @@
@import "../flist_overrides";
@import "../rising";
+
+:root {
+ @each $varName, $value in $risingVariables {
+ --#{$varName}: #{$value};
+ }
+}
+
+
* {
&::-webkit-scrollbar-track {
box-shadow: inset 0 0 8px $card-border-color;
diff --git a/scss/themes/_colorblind.scss b/scss/themes/_colorblind.scss
new file mode 100644
index 0000000..a1a5556
--- /dev/null
+++ b/scss/themes/_colorblind.scss
@@ -0,0 +1,40 @@
+$scoreUnicornMatchBg: #0093d2;
+$scoreUnicornMatchFg: #0093d2;
+$scoreMatchBg: #006cb7;
+$scoreMatchFg: #006cb7;
+$scoreWeakMatchBg: #015486;
+$scoreWeakMatchFg: #015486;
+$scoreWeakMismatchBg: #606060;
+$scoreWeakMismatchFg: #606060;
+$scoreMismatchBg: #ab0000;
+$scoreMismatchFg: #ab0000;
+
+$scoreStandoutMatchBorderColor: #049ada;
+$scoreStandoutMatchBgColor: rgba(4, 132, 186, 0.47);
+$scoreStandoutWeakMatchBorderColor: #006cb7;
+$scoreStandoutWeakMatchBgColor: rgba(2, 91, 153, 0.4);
+$scoreStandoutNeutralBorderColor: rgba(0, 0, 0, 0);
+$scoreStandoutWeakMismatchBorderColor: #888;
+$scoreStandoutWeakMismatchBgColor: rgba(170, 170, 170, 0.0);
+$scoreStandoutMismatchBorderColor: #ab0000;
+
+$genders: (
+ "shemale": #e2445f,
+ "herm": #d40759,
+ "none": $gray-500,
+ "female": #66ff74,
+ "male": #6699ff,
+ "male-herm": #007fff,
+ "transgender": #ee8822,
+ "cunt-boy": #63ee22,
+);
+
+@each $gender, $color in $genders {
+ .gender-#{$gender} {
+ color: $color;
+ }
+
+ .message-event .gender-#{$gender} {
+ color: lighten($color, 5%)
+ }
+}
diff --git a/scss/themes/chat/dark.scss b/scss/themes/chat/dark.scss
index 95fd132..1c4eeee 100644
--- a/scss/themes/chat/dark.scss
+++ b/scss/themes/chat/dark.scss
@@ -31,3 +31,12 @@
}
}
}
+
+.colorblindMode {
+ @import "../colorblind";
+ @import "../../rising";
+
+ @each $varName, $value in $risingVariables {
+ --#{$varName}: #{$value};
+ }
+}
diff --git a/scss/themes/chat/default.scss b/scss/themes/chat/default.scss
index 75bd1ed..0cf5681 100644
--- a/scss/themes/chat/default.scss
+++ b/scss/themes/chat/default.scss
@@ -31,3 +31,28 @@
}
}
}
+
+.colorblindMode {
+ @import "../colorblind";
+ @import "../../rising";
+
+ @each $varName, $value in $risingVariables {
+ --#{$varName}: #{$value};
+ }
+}
+
+//@import "../../util/accecss";
+//
+//@include accecss(
+// 'html body',
+// false,
+// false,
+// tritanopia
+//);
+
+// deuteranomaly
+// protanomaly
+// protanopia
+// deuteranopia
+// tritanomaly
+// tritanopia
diff --git a/scss/themes/chat/light.scss b/scss/themes/chat/light.scss
index 0e6b94f..d27368b 100644
--- a/scss/themes/chat/light.scss
+++ b/scss/themes/chat/light.scss
@@ -31,3 +31,12 @@
}
}
}
+
+.colorblindMode {
+ @import "../colorblind";
+ @import "../../rising";
+
+ @each $varName, $value in $risingVariables {
+ --#{$varName}: #{$value};
+ }
+}
diff --git a/scss/themes/variables/_dark_variables.scss b/scss/themes/variables/_dark_variables.scss
index d7aa9b0..a693db7 100644
--- a/scss/themes/variables/_dark_variables.scss
+++ b/scss/themes/variables/_dark_variables.scss
@@ -60,6 +60,8 @@ $text-background-color: $gray-100;
$text-background-color-disabled: $gray-200;
// F-List Rising
+$scoreUnicornMatchBg: rgb(0, 173, 173);
+$scoreUnicornMatchFg: rgb(29, 154, 154);
$scoreMatchBg: rgb(0, 142, 0);
$scoreMatchFg: rgb(0, 113, 0);
$scoreWeakMatchBg: rgb(0, 80, 0);
@@ -73,6 +75,8 @@ $scoreMinimizeButtonFg: rgba(255, 255, 255, 0.7);
$scoreMinimizeButtonBg: rgba(0,0,0,0.2);
$scoreReportBg: rgba(0,0,0,0.2);
+$scoreFadedUnicornMatchBg: adjust-color($scoreUnicornMatchBg, $alpha: -0.6);
+$scoreFadedUnicornMatchFg: adjust-color($scoreUnicornMatchFg, $alpha: -0.6);
$scoreFadedMatchBg: adjust-color($scoreMatchBg, $alpha: -0.6);
$scoreFadedMatchFg: adjust-color($scoreMatchFg, $alpha: -0.6);
$scoreFadedWeakMatchBg: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
diff --git a/scss/themes/variables/_default_variables.scss b/scss/themes/variables/_default_variables.scss
index decdad0..f81a00b 100644
--- a/scss/themes/variables/_default_variables.scss
+++ b/scss/themes/variables/_default_variables.scss
@@ -59,6 +59,8 @@ $text-background-color: $gray-200;
$text-background-color-disabled: $gray-100;
// F-List Rising
+$scoreUnicornMatchBg: rgb(0, 173, 173);
+$scoreUnicornMatchFg: rgb(29, 154, 154);
$scoreMatchBg: rgb(0, 142, 0);
$scoreMatchFg: rgb(0, 113, 0);
$scoreWeakMatchBg: rgb(0, 80, 0);
@@ -72,6 +74,8 @@ $scoreMinimizeButtonFg: rgba(255, 255, 255, 0.7);
$scoreMinimizeButtonBg: rgba(0,0,0,0.2);
$scoreReportBg: rgba(0,0,0,0.2);
+$scoreFadedUnicornMatchBg: adjust-color($scoreUnicornMatchBg, $alpha: -0.6);
+$scoreFadedUnicornMatchFg: adjust-color($scoreUnicornMatchFg, $alpha: -0.6);
$scoreFadedMatchBg: adjust-color($scoreMatchBg, $alpha: -0.6);
$scoreFadedMatchFg: adjust-color($scoreMatchFg, $alpha: -0.6);
$scoreFadedWeakMatchBg: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
diff --git a/scss/themes/variables/_light_variables.scss b/scss/themes/variables/_light_variables.scss
index 38b7c8a..6b39f0f 100644
--- a/scss/themes/variables/_light_variables.scss
+++ b/scss/themes/variables/_light_variables.scss
@@ -15,6 +15,8 @@ $text-muted: $gray-500;
// F-List Rising
+$scoreUnicornMatchBg: rgb(0, 173, 173);
+$scoreUnicornMatchFg: rgb(29, 154, 154);
$scoreMatchBg: rgba(0, 180, 0, 0.65);
$scoreMatchFg: rgba(0, 133, 0, 0.4);
$scoreWeakMatchBg: rgba(0, 180, 0, 0.22);
@@ -28,6 +30,8 @@ $scoreMinimizeButtonFg: rgba(255, 255, 255, 0.6);
$scoreMinimizeButtonBg: rgba(0,0,0,0.1);
$scoreReportBg: rgba(0,0,0,0.08);
+$scoreFadedUnicornMatchBg: adjust-color($scoreUnicornMatchBg, $alpha: -0.6);
+$scoreFadedUnicornMatchFg: adjust-color($scoreUnicornMatchFg, $alpha: -0.6);
$scoreFadedMatchBg: adjust-color($scoreMatchBg, $alpha: -0.6);
$scoreFadedMatchFg: adjust-color($scoreMatchFg, $alpha: -0.6);
$scoreFadedWeakMatchBg: adjust-color($scoreWeakMatchBg, $alpha: -0.6);
diff --git a/scss/util/accecss.scss b/scss/util/accecss.scss
new file mode 100644
index 0000000..ae2d58d
--- /dev/null
+++ b/scss/util/accecss.scss
@@ -0,0 +1,175 @@
+/// GRID
+
+$path-to-filter: '../../../chat/assets';
+
+@mixin log(){
+ content:'.'attr(class);position: absolute;
+ top: 0;left: 0;z-index: 99999999;padding: .1em;background: rgba(0,0,0, .9);
+ opacity: .1;
+ color: #fff !important;
+ font-size: 14px;
+}
+
+@mixin grid(){
+
+
+ box-shadow: inset 0 0 0 1px rgba(purple, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(purple, 1) !important;
+ }
+ *{
+ box-shadow: inset 0 0 0 1px rgba(red, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(red, 1) !important;
+ }
+ + *{
+ box-shadow: inset 0 0 0 1px rgba(blue, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(blue, 1) !important;
+ }
+ + *{
+ box-shadow: inset 0 0 0 1px rgba(green, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(green, 1) !important;
+ }
+ + *{
+ box-shadow: inset 0 0 0 1px rgba(purple, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(purple, 1) !important;
+ }
+ + *{
+ box-shadow: inset 0 0 0 1px rgba(red, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(red, 1) !important;
+ }
+ + *{
+ box-shadow: inset 0 0 0 1px rgba(blue, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(blue, 1) !important;
+ }
+ + *{
+ box-shadow: inset 0 0 0 1px rgba(green, .1) !important;
+ &:hover{
+ box-shadow: inset 0 0 0 1px rgba(green, 1) !important;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+
+/// Mixin debug
+/// @include debug(, , , );
+/// Param :
+/// [1]: Specified debug element
+/// [2]: css zone
+/// [3]: Grayscale view
+/// [4]: Colorblind filters **
+///
+/// ** Available filters : `protanopia`, `protanomaly`, `deuteranopia`, `deuteranomaly`, `tritanopia`, `tritanomaly`, `achromatopsia`, `achromatomal
+///
+///
+/// Usage :
+/// `@include accecss(, , , );`
+///
+/// @group helpers
+
+@mixin accecss($element: false, $zones: false, $grayscale: false, $cbFilter: false){
+
+ @if $grayscale == true and $cbFilter == false {
+ @if $element != false {
+ #{$element} {
+ filter: grayscale(100%);
+ }
+ }
+
+ @else {
+ html body {
+ filter: grayscale(100%);
+ }
+ }
+ }
+ @else if $grayscale == true and $cbFilter != false {
+ @if $element != false {
+ #{$element} {
+
+
+ filter: url('#{$path-to-filter}/filters.svg##{$cbFilter}');
+
+ }
+ }
+
+ @else {
+ html body {
+ filter: url('#{$path-to-filter}/filters.svg##{$cbFilter}') grayscale(0) !important;
+ }
+ }
+ }
+
+ @else if $grayscale == false and $cbFilter != false{
+ @if $element != false {
+ #{$element} {
+
+
+ filter: url('#{$path-to-filter}/filters.svg##{$cbFilter}');
+
+ }
+ }
+
+ @else {
+ html body {
+ filter: url('#{$path-to-filter}/filters.svg##{$cbFilter}') grayscale(0) !important;
+ }
+ }
+ }
+
+ @else if $cbFilter != false and $element != false {
+ @if $element != false {
+ #{$element} {
+
+ filter: url('#{$path-to-filter}/filters.svg##{$cbFilter}');
+
+ }
+ }
+
+ @else {
+ html body {
+ filter: url('#{$path-to-filter}/filters.svg##{$cbFilter}') grayscale(0) !important;
+ }
+ }
+ }
+
+ @if $zones == true or
+ $zones == 'logs' or
+ $grayscale == true and $cbFilter == false and $zones == true or
+ $grayscale == true and $cbFilter != false and $zones == true or
+ $grayscale == false and $cbFilter != false and $zones == true {
+ /*
+ CSS accecss : TRUE
+ */
+
+ @if $element == false {
+ html, body{
+ @include grid();
+ }
+ }
+
+ @else if $element != false {
+ #{$element}{
+ @include grid();
+ }
+ }
+ }
+
+
+ @else{
+ /*
+ CSS accecss : FALSE
+ */
+ }
+}
+