summaryrefslogtreecommitdiff
path: root/_sass/misc
diff options
context:
space:
mode:
authorJeffrey Tse <jeffreytse.mail@gmail.com>2019-09-11 12:19:34 +0800
committerJeffrey Tse <jeffreytse.mail@gmail.com>2019-09-11 12:21:17 +0800
commit61eae5c5f9881cab29712f6e696085baa977e1f9 (patch)
treebb301b58b94fee5dcefbdfae8f0c8fc13ee5bd21 /_sass/misc
parentcd3a8163dd997d0a7c4d320816651efa8f7dce60 (diff)
release: v1.0.0
Diffstat (limited to '_sass/misc')
-rw-r--r--_sass/misc/article-menu.scss47
-rw-r--r--_sass/misc/common-list.scss49
-rw-r--r--_sass/misc/google-translate.scss189
3 files changed, 285 insertions, 0 deletions
diff --git a/_sass/misc/article-menu.scss b/_sass/misc/article-menu.scss
new file mode 100644
index 0000000..006f6ee
--- /dev/null
+++ b/_sass/misc/article-menu.scss
@@ -0,0 +1,47 @@
+/*
+ * Post menu
+ */
+
+.post-menu {
+ padding: 0 20px;
+ max-width: 250px;
+
+ .post-menu-title {
+ font-size: $base-font-size * 1.35;
+ margin-bottom: 6px;
+ font-weight: 600;
+ color: #4e4e4e;
+
+ &:before {
+ content: '\f02e';
+ margin-right: 5px;
+ font-size: $base-font-size * 1.15;
+ }
+ }
+
+ .post-menu-content {
+ ul {
+ @for $i from 2 to 7 {
+ .h-h#{$i} {
+ padding-left: ($i - 2) * $base-font-size * 0.9;
+ font-size: (7 - $i) + $base-font-size * 0.9;
+ }
+ }
+
+ a {
+ display: flex;
+ padding: 0px 8px;
+
+ * {
+ pointer-events: none;
+ }
+ }
+
+ .active {
+ color: white;
+ background: mix(invert($theme-color), darkorange);
+ transition: background 0.5s;
+ }
+ }
+ }
+}
diff --git a/_sass/misc/common-list.scss b/_sass/misc/common-list.scss
new file mode 100644
index 0000000..97f7b31
--- /dev/null
+++ b/_sass/misc/common-list.scss
@@ -0,0 +1,49 @@
+/**
+ * Common list
+ */
+.common-list {
+ @include relative-font-size(1.0);
+
+ background: #eaeaea;
+ box-shadow: 0px 0px 3px 0px #a9a9a9;
+ border-radius: 3px;
+ min-width: 200px;
+
+ ul {
+ list-style: none;
+ margin: 0;
+ }
+
+ li {
+ border-bottom: 1px solid $background-color;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ a {
+ display: flex;
+ justify-content: space-between;
+ padding: 8px 12px;
+ text-decoration: none;
+ font-weight: 600;
+ color: mix($theme-color, #666);
+ transition: background 0.2s;
+
+ &:hover {
+ background: mix($theme-color, #fff, 20%);
+ }
+ }
+
+ span {
+ @include relative-font-size(0.8);
+ display: inline-block;
+ border-radius: 10px;
+ align-self: center;
+ background: darken(invert($theme-color), 20%);
+ padding: 0px 8px;
+ margin-left: 20px;
+ color: $white-color;
+ }
+ }
+}
diff --git a/_sass/misc/google-translate.scss b/_sass/misc/google-translate.scss
new file mode 100644
index 0000000..97519a5
--- /dev/null
+++ b/_sass/misc/google-translate.scss
@@ -0,0 +1,189 @@
+/* OVERRIDE GOOGLE TRANSLATE WIDGET CSS BEGIN */
+
+%goog-te-menu {
+ a.goog-te-menu-value {
+ vertical-align: top !important;
+
+ &:hover {
+ text-decoration: none;
+ }
+
+ span {
+ color: #aaa;
+ }
+
+ span:hover {
+ color: white;
+ }
+
+ /* Remove the down arrow */
+ /* when dropdown open */
+ span[style="color: rgb(213, 213, 213);"] {
+ display: none;
+ }
+ /* after clicked/touched */
+ span[style="color: rgb(118, 118, 118);"] {
+ display: none;
+ }
+ /* on page load (not yet touched or clicked) */
+ span[style="color: rgb(155, 155, 155);"] {
+ display: none;
+ }
+
+ /* Remove span with left border line | (next to the arrow) in Chrome & Firefox */
+ span[style="border-left: 1px solid rgb(187, 187, 187);"] {
+ display: none;
+ }
+ /* Remove span with left border line | (next to the arrow) in Edge & IE11 */
+ span[style="border-left-color: rgb(187, 187, 187); border-left-width: 1px; border-left-style: solid;"] {
+ display: none;
+ }
+ }
+}
+
+div#google_translate_element {
+ display: inline;
+
+ div.goog-te-gadget {
+ display: inline;
+ font-size: 0;
+ }
+
+ div[id=':0.targetLanguage'] {
+ display: inline;
+ }
+
+ div.goog-te-gadget-simple {
+ border: none;
+ background-color: transparent;
+
+ @extend %goog-te-menu;
+ }
+
+ a.goog-logo-link {
+ display: none;
+ }
+
+ .goog-te-gadget-icon {
+ display: none !important;
+ /*background: url("url for the icon") 0 0 no-repeat !important;*/
+ }
+
+ a.goog-te-menu-value {
+ margin: 0;
+
+ span:first-child {
+ display: none;
+ }
+
+ &:before {
+ content: "\f1ab \f0d7";
+ font-family: FontAwesome;
+ font-size: initial;
+ color: #fefefe;
+ border: 1px solid #fefefe85;
+ border-radius: 3px;
+ padding: 3px 6px;
+ }
+ }
+}
+
+.goog-te-menu-frame .goog-te-menu2 {
+ max-width: 100%;
+ overflow-x: auto;
+ box-sizing: border-box;
+ height: auto;
+}
+
+/* HIDE the google translate toolbar */
+.goog-te-banner-frame.skiptranslate {
+ display: none !important;
+ border: none;
+ box-shadow: 0 0;
+ -webkit-box-shadow: 0 0;
+}
+
+body {
+ top: 0px !important;
+}
+
+/* OVERRIDE GOOGLE TRANSLATE WIDGET CSS END */
+
+
+// Main look
+
+.ct-language-selected {
+ background: lighten($theme-color, 10%) !important;
+}
+
+.ct-language-dropdown {
+ overflow: hidden;
+ max-height: 0;
+ position: absolute;
+ top: 110%;
+ right: -10px;
+ -webkit-transition: all 0.25s ease-in-out;
+ transition: all 0.25s ease-in-out;
+ width: 100px;
+ text-align: center;
+ padding-top: 0;
+ z-index: 200;
+
+ li {
+ background: lighten($theme-color, 5%);
+ padding: 5px;
+
+ a {
+ display: block;
+
+ img {
+ width: 24px;
+ max-height: 24px;
+ }
+ }
+
+ &:first-child {
+ padding-top: 10px;
+ border-radius: 3px 3px 0 0;
+ }
+
+ &:last-child {
+ padding-bottom: 10px;
+ border-radius: 0 0 3px 3px;
+ }
+
+ &:hover {
+ @extend .ct-language-selected;
+ }
+ }
+
+}
+
+.list-unstyled {
+ display: inline-block;
+ list-style: none;
+ margin-left: 0;
+}
+
+.ct-language {
+ display: inline-block;
+ position: relative;
+ background: #fefefe2b;
+ padding: 3px 10px;
+ border-radius: 3px;
+
+ &:hover {
+ cursor: pointer;
+
+ .ct-language-dropdown {
+ padding-top: 8px;
+ max-height: 10000px;
+ }
+ }
+
+ &:before {
+ content: "\f1ab \f0d7";
+ font-family: FontAwesome;
+ }
+}
+