update global styles

webdevelop-pro · Oct 16, 2024 · b4e7bc4 · b4e7bc4
1 parent dc16bb1
commit b4e7bc4
Show file tree

Hide file tree

Showing 23 changed files with 707 additions and 465 deletions.
diff --git a/src/components/BaseTag/BaseTag.vue b/src/components/BaseTag/BaseTag.vue
@@ -54,6 +54,7 @@ const tagClasses = computed(() => {
 	align-items: center
 	border-radius: $base-tag-default-border-radius
 	font-family: $base-tag-font-family
+	text-decoration: none
 	$root: &
 	&.is--size-small
 		padding: $base-tag-small-padding

diff --git a/src/components/common/PostItem/PostItem.vue b/src/components/common/PostItem/PostItem.vue
@@ -176,7 +176,7 @@ const route = computed(() => (props.data.route ? props.data.route : props.defaul
     @media screen and (max-width: 767px)
       order: 1
       width: 100%
-      margin-bottom: 15px
+      margin-bottom: 20px
       height: 122px
       min-width: 100%
 

diff --git a/src/helpers/general.ts b/src/helpers/general.ts
@@ -71,3 +71,13 @@ export function urlize(input: string): string {
 
   return urlFriendlyString;
 }
+
+
+export function stripHtml(html: string) {
+  if (typeof document !== 'undefined') {
+    const tmp = document.createElement('DIV');
+    tmp.innerHTML = html;
+    return tmp.textContent || tmp.innerText || '';
+  }
+  return html;
+}
diff --git a/src/styles/_colors.sass b/src/styles/_colors.sass
@@ -30,7 +30,7 @@ $gray-80: #343A40
 $gray-90: #1A202D
 $black: #12161F
 
-// backgrounds
+// BACKGROUNDS
 .is--background-primary
   background-color: $primary
 .is--background-primary-dark

diff --git a/src/styles/_fonts.sass b/src/styles/_fonts.sass
@@ -46,169 +46,15 @@
 @import 'UiKit/styles/_mixins.sass'
 @import 'UiKit/styles/_colors.sass'
 
-html,
-body
-  -webkit-overflow-scrolling: touch
-  color: $black
-  font-family: 'Avenir', arial, helvetica, sans-serif
-p
-  +font(400)
-  font-size: inherit
-  line-height: inherit
-  font-style: normal
-p,
-span,
-div
-  &.is--small-text
-    +font(400)
-    font-size: 12px
-    line-height: 18px
+
 em,
 i
   +font(300)
   font-style: italic
 strong, b
   +font(800)
-  &.is--small-text
-    font-size: 12px
-    line-height: 18px
 
 sup
   font-size: 100%
 
-h1
-  +font(900)
-  font-size: 44px
-  line-height: 66px
-  @media screen and (max-width: 767px)
-    font-size: 38px
-    line-height: 57px
-h2
-  +font(900)
-  font-size: 34px
-  line-height: 51px
-  @media screen and (max-width: 767px)
-    font-size: 28px
-    line-height: 42px
-h3
-  +font(900)
-  margin: 0
-  font-size: 24px
-  line-height: 36px
-  &.is--subheading
-    +font(400)
-h4
-  +font(800)
-  font-size: 20px
-  line-height: 30px
-  @media screen and (max-width: 767px)
-    font-size: 18px
-    line-height: 28px
-  &.is--subheading
-    +font(400)
-h5
-  +font(800)
-  font-size: 16px
-  line-height: 24px
-h6
-  +font(800)
-  font-size: 14px
-  line-height: 21px
-
-// H - titles by class
-.is--h1__title
-  @extend h1
-.is--h2__title
-  @extend h2
-.is--h3__title
-  @extend h3
-.is--h4__title
-  @extend h4
-.is--h5__title
-  @extend h5
-.is--h6__title
-  @extend h6
 
-.is--display-1
-  +font(900)
-  font-size: 100px
-  line-height: 100px
-.is--display-2
-  +font(900)
-  font-size: 50px
-  line-height: 75px
-  @media screen and (max-width: 767px)
-    font-size: 44px
-    line-height: 66px
-.is--subheading-1
-  +font(300)
-  font-size: 24px
-  line-height: 36px
-  letter-spacing: 0.1px
-  @media screen and (max-width: 767px)
-    font-size: 20px
-    line-height: 30px
-.is--subheading-2
-  +font(300)
-  font-size: 20px
-  line-height: 30px
-  // @media screen and (max-width: 767px)
-  //   font-size: 18px
-  //   line-height: 28px
-.is--body
-  +font(400)
-  font-size: 16px
-  line-height: 26px
-.is--body-italic
-  @extend .is--body
-  font-style: italic
-.is--small
-  +font(500)
-  font-size: 12px
-  line-height: 18px
-.is--small-2
-  +font(800)
-  font-size: 12px
-  line-height: 18px
-.is--link-1
-  +font(800)
-  font-size: 16px
-  line-height: 26px
-  text-decoration: underline
-  transition: 0.3s all  ease-in-out
-  color: $primary
-  cursor: pointer
-  &:hover
-    text-decoration: none
-.is--link-2
-  +font(800)
-  font-size: 12px
-  line-height: 18px
-  text-decoration: underline
-  transition: 0.3s all  ease-in-out
-  color: $primary
-  cursor: pointer
-  &:hover
-    text-decoration: none
-.is--h1__mobile
-  +font(900)
-  font-size: 38px
-  font-style: normal
-  line-height: 57px
-.is--h2__mobile
-  +font(900)
-  font-size: 28px
-  font-style: normal
-  line-height: 42px
-.is--link-regular
-  +font(800)
-  font-size: 14px
-  line-height: 21px
-  text-decoration: underline
-  transition: 0.3s all  ease-in-out
-  color: $primary
-  cursor: pointer
-  &:hover
-    text-decoration: none
-.is--gray-10
-  color: $gray-10