From a4a83e4b549e858d4f8c821591bfb74706d846e8 Mon Sep 17 00:00:00 2001 From: Vidhu Kant Sharma Date: Sat, 28 May 2022 14:45:09 +0530 Subject: Moved the blog to new repository --- src/web/styles/theme/_global.scss | 39 ++++++++++++++++++++++++ src/web/styles/theme/_home.scss | 17 +++++++++++ src/web/styles/theme/_navbar.scss | 10 +++++++ src/web/styles/theme/_post.scss | 62 +++++++++++++++++++++++++++++++++++++++ 4 files changed, 128 insertions(+) create mode 100644 src/web/styles/theme/_global.scss create mode 100644 src/web/styles/theme/_home.scss create mode 100644 src/web/styles/theme/_navbar.scss create mode 100644 src/web/styles/theme/_post.scss (limited to 'src/web/styles/theme') diff --git a/src/web/styles/theme/_global.scss b/src/web/styles/theme/_global.scss new file mode 100644 index 0000000..de77f99 --- /dev/null +++ b/src/web/styles/theme/_global.scss @@ -0,0 +1,39 @@ +// global color definitions +// background +// $defBackgroundColor: #061820; +$defBackgroundColor: #151718; +// $altBackgroundColor: #1a2a30; +// $defBackgroundColor: #383A59; +// $altBackgroundColor: #282A36; +$altBackgroundColor: #232627; +$selectionBackground: #8215D2; + +// foreground +$defForegroundColor: #dfdfdf; +$altForegroundColor: #FFFFFF; +$boringForeground: #b5c4c2; +$selectionForeground: #FFFFFF; +// $defLinkForeground: #3691b8; +$defLinkForeground: #6d8ee2; + +// colored foregrounds +$fg-purple0: #9c79c5; + +$fg-pink0: #e82884; + +$fg-green0: #9c79c5; + +$fg-yellow0: #FFFF99; + + +// apply text selection/highlight colors easily +@mixin selectionColors($background, $foreground) { + ::selection { + color: $foreground; + background-color: $background; + } + ::-moz-selection { + color: $foreground; + background-color: $background; + } +} diff --git a/src/web/styles/theme/_home.scss b/src/web/styles/theme/_home.scss new file mode 100644 index 0000000..037c2d3 --- /dev/null +++ b/src/web/styles/theme/_home.scss @@ -0,0 +1,17 @@ +@import "global"; +@import "post"; + +$buttonBackgroundColor: $altBackgroundColor; + +$buttonBorderColor: #000000; + +$welcomeHeadingFG: $fg-purple0; +$welcomeHeadingAltFG: $fg-yellow0; +$recentsLabelFG: $fg-pink0; + +$recentsItemBG: $altBackgroundColor; + +// $postTitleFG: #d28bf0; +$postTitleFG: $defForegroundColor; +// $postCreatedAtFG: #959495; +$postCreatedAtFG: #c2c1c2; diff --git a/src/web/styles/theme/_navbar.scss b/src/web/styles/theme/_navbar.scss new file mode 100644 index 0000000..1f01882 --- /dev/null +++ b/src/web/styles/theme/_navbar.scss @@ -0,0 +1,10 @@ +// color definitions +$navbarBackgroundColor: $defBackgroundColor; +// $navbarForegroundColor: #bbf2c0; +$navbarForegroundColor: #EDEDED; + +// $navbarShadow: 0 0.5em 1em $navbarBackgroundColor; +$navbarShadow: none; + +// size definitions +$navbarHeight: 3rem; diff --git a/src/web/styles/theme/_post.scss b/src/web/styles/theme/_post.scss new file mode 100644 index 0000000..3a05a74 --- /dev/null +++ b/src/web/styles/theme/_post.scss @@ -0,0 +1,62 @@ +@import "global"; + +// color definitions +// background +$postDefBackgroundColor: $altBackgroundColor; +$postAltBackgroundColor: #384044; +$codeBlockBackgroundColor: $postAltBackgroundColor; +$codeBlockHighlightBackground: pink; + +// foreground +$postDefForegroundColor: $defForegroundColor; +$postAltForegroundColor: $altForegroundColor; +$postInfoForegroundColor: $boringForeground; +$codeBlockForegroundColor: $postAltForegroundColor; +$codeCommentForegroundColor: gray; +$codeBlockHighlightForeground: $altBackgroundColor; + +// $fg1: #d305e8; +// $fg1: #AB47BC; +// $fg2: #28c7d4; +// $fg3: #F26413; +// $fg4: #23DEBA; +// $fg5: #A600FF; +// $fg6: #B623DE; + +$fg1: #FF79C6; +$fg2: #50FA7B; +$fg3: #E659A9; +$fg4: #8E5EBC; +$fg5: #23DEBA; +$fg6: #A600FF; + +$listItemForeground: $fg3; + +// other +$articleBorderColor: $defForegroundColor; + +// $postTitleColor: #2aa386; +// $postTitleColor: #dd237d; +// $postTitleColor: #ffbb00; +// $postTitleColor: #dea2c2; +// $postTitleColor: #BD93F9; +$postTitleColor: $fg-purple0; + +// size definitions +$postTitleFontSize: 2.5em; +$postTitleAlignment: center; + +$codeBlockBorderRadius: 0.4em; +$codeBlockPadding: 0.2em 1em; + +// responsive +$post-800px-padding: 1em; +$post-600px-padding: 1em; + +$posts_postTitleColor: $defForegroundColor; +$posts_postHighlightedTitleColor: $defLinkForeground; +$posts_postInfoForegroundColor: $postInfoForegroundColor; +$posts_postTagForegroundColor: $postInfoForegroundColor; + +$tagsMenuLabelFG: $postTitleColor; +$tagButtonActiveBG: $tagsMenuLabelFG; -- cgit v1.2.3