remove theme from css and used variables instead
audric
4 years ago
parent
350f00283b
commit
bd7d88e170
@ -1,139 +0,0 @@
|
||||
// 13592 lines for manifest.css on date 25 august
|
||||
|
||||
$white: #ffffff;
|
||||
$black: #000000;
|
||||
$destructive: #ff453a;
|
||||
$warning: #e7b100;
|
||||
$accentLightTheme: #00e97b;
|
||||
$accentDarkTheme: #00f782;
|
||||
|
||||
$borderLightTheme: #f1f1f1; // search for references on ts TODO: make this exposed on ts
|
||||
$borderDarkTheme: rgba($white, 0.06);
|
||||
$inputBackgroundColor: #8e8e93;
|
||||
|
||||
$onionPathLineColor: rgba(#7a7a7a, 0.6);
|
||||
|
||||
$borderAvatarColor: unquote(
|
||||
'#00000059'
|
||||
); // search for references on ts TODO: make this exposed on ts
|
||||
|
||||
$themes: (
|
||||
light: (
|
||||
accent: $accentLightTheme,
|
||||
accentButton: $black,
|
||||
cellBackground: #fcfcfc,
|
||||
warning: $warning,
|
||||
destructive: $destructive,
|
||||
modalBackground: #fcfcfc,
|
||||
fakeChatBubbleBackground: #f5f5f5,
|
||||
// input
|
||||
inputBackground: rgba($inputBackgroundColor, 0.12),
|
||||
// text
|
||||
textColor: $black,
|
||||
textColorSubtle: rgba($black, 0.6),
|
||||
textColorOpposite: $white,
|
||||
textHighlight: rgba($black, 0.2),
|
||||
// inbox
|
||||
inboxBackground: $white,
|
||||
// buttons
|
||||
backgroundPrimary: #272726,
|
||||
foregroundPrimary: $white,
|
||||
buttonGreen: #272726,
|
||||
// conversation view
|
||||
composeViewBackground: #fcfcfc,
|
||||
receivedMessageBackground: #f5f5f5,
|
||||
sentMessageBackground: $accentLightTheme,
|
||||
receivedMessageText: $black,
|
||||
sentMessageText: $white,
|
||||
sessionShadow: 0 0 4px 0 rgba($black, 0.37),
|
||||
sessionShadowColor: rgba($black, 0.37),
|
||||
// left pane
|
||||
conversationList: $white,
|
||||
conversationItemHasUnread: #fcfcfc,
|
||||
conversationItemSelected: #f0f0f0,
|
||||
clickableHovered: #dfdfdf,
|
||||
sessionBorder: 1px solid $borderLightTheme,
|
||||
sessionUnreadBorder: 4px solid $accentLightTheme,
|
||||
leftpaneOverlayBackground: $white,
|
||||
// scrollbars
|
||||
scrollBarTrack: #fcfcfc,
|
||||
scrollBarThumb: #474646,
|
||||
// pill divider:
|
||||
pillDividerColor: rgba($black, 0.1),
|
||||
pillDividerTextColor: #555555,
|
||||
// context menu
|
||||
contextMenuBackground: #f5f5f5,
|
||||
filterSessionText: brightness(0) saturate(100%),
|
||||
),
|
||||
dark: (
|
||||
accent: $accentDarkTheme,
|
||||
accentButton: $accentDarkTheme,
|
||||
warning: $warning,
|
||||
destructive: $destructive,
|
||||
cellBackground: #1b1b1b,
|
||||
modalBackground: #101011,
|
||||
fakeChatBubbleBackground: #212121,
|
||||
// input
|
||||
inputBackground: rgba($inputBackgroundColor, 0.12),
|
||||
// text
|
||||
textColor: $white,
|
||||
textColorSubtle: rgba($white, 0.6),
|
||||
textColorOpposite: $black,
|
||||
textHighlight: rgba($accentDarkTheme, 0.6),
|
||||
// inbox
|
||||
// buttons
|
||||
inboxBackground: linear-gradient(180deg, #171717 0%, #121212 100%),
|
||||
backgroundPrimary: #474646,
|
||||
foregroundPrimary: $white,
|
||||
buttonGreen: $accentDarkTheme,
|
||||
// conversation view
|
||||
composeViewBackground: #171717,
|
||||
receivedMessageBackground: #2d2d2d,
|
||||
sentMessageBackground: $accentDarkTheme,
|
||||
receivedMessageText: $white,
|
||||
sentMessageText: $black,
|
||||
sessionShadow: 0 0 4px 0 rgba($white, 0.2),
|
||||
sessionShadowColor: rgba($white, 0.2),
|
||||
// left pane
|
||||
conversationList: #1b1b1b,
|
||||
conversationItemHasUnread: #2c2c2c,
|
||||
conversationItemSelected: #404040,
|
||||
clickableHovered: #414347,
|
||||
sessionBorder: 1px solid $borderDarkTheme,
|
||||
sessionUnreadBorder: 4px solid $accentDarkTheme,
|
||||
leftpaneOverlayBackground: linear-gradient(180deg, #171717 0%, #121212 100%),
|
||||
// scrollbars
|
||||
scrollBarTrack: #1b1b1b,
|
||||
scrollBarThumb: #474646,
|
||||
// pill divider:
|
||||
pillDividerColor: #353535,
|
||||
pillDividerTextColor: #a0a0a0,
|
||||
// context menu
|
||||
contextMenuBackground: #212121,
|
||||
filterSessionText: none,
|
||||
),
|
||||
);
|
||||
|
||||
@mixin themify($themes: $themes) {
|
||||
@each $theme, $map in $themes {
|
||||
.#{$theme}-theme & {
|
||||
$theme-map: () !global;
|
||||
@each $key, $submap in $map {
|
||||
$value: map-get(map-get($themes, $theme), '#{$key}');
|
||||
$theme-map: map-merge(
|
||||
$theme-map,
|
||||
(
|
||||
$key: $value,
|
||||
)
|
||||
) !global;
|
||||
}
|
||||
|
||||
@content;
|
||||
$theme-map: null !global;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@function themed($key) {
|
||||
@return map-get($theme-map, $key);
|
||||
}
|
||||
Loading…
Reference in New Issue