oddsgate-ds 1.0.61 → 1.0.62

package/dist/esm/types/styles/variables.d.ts

@@ -23,7 +23,7 @@ export declare const spacesNegative: Record<string, string>;
 export declare const typography: Record<string, Record<string, unknown>>;
 export declare const radius: Record<string, string>;
 export declare const shadows: Record<string, string>;
-export declare const zIndexes: Record<string, string>;
+export declare const zIndexes: Record<number, number>;
 export declare const grid_conf: {
     gridSize: number;
     gutter: number;

package/dist/types.d.ts

@@ -28,7 +28,7 @@ declare const spacesNegative: Record<string, string>;
 declare const typography: Record<string, Record<string, unknown>>;
 declare const radius: Record<string, string>;
 declare const shadows: Record<string, string>;
-declare const zIndexes: Record<string, string>;
+declare const zIndexes: Record<number, number>;
 declare const grid_conf: {
     gridSize: number;
     gutter: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oddsgate-ds",
-  "version": "1.0.61",
+  "version": "1.0.62",
   "description": "Miew theme component library",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/molecules/BlogCard/BlogCard.theme.ts

@@ -4,12 +4,13 @@ import styled, { css } from 'styled-components';
 import Card from '../Card/Card.component';
 import { IBlogCard } from './BlogCard.interface';
 import { StyledChip } from '@/components/atoms/Chip/Chip.theme';
+import { variables } from '@/index';
 
 export const StyledBlogCard = styled(Card) <IBlogCard>`
   padding: 1rem;
   background-color: ${colors.primary50};
   border-radius: ${radius.sm};
-
+  text-align: center;
 
   ${StyledChip}{
     position: absolute;
@@ -22,11 +23,14 @@ export const StyledBlogCard = styled(Card) <IBlogCard>`
 
   }
 
-
   &:hover{
     & figcaption{
 
     }
   }
+
+  @media only screen and (min-width: ${variables.responsiveMedia}) {
+    text-align:left;
+  }
 `;
 

package/src/components/molecules/EventsCard/EventsCard.theme.ts

@@ -16,7 +16,6 @@ export const StyledEventsCard = styled(Card) <IEventsCard>`
     margin-top: 1rem;
   }
 
-
   &:hover{
 
   }

package/src/components/molecules/NewsCard/NewsCard.theme.ts

@@ -4,13 +4,14 @@ import styled, { css } from 'styled-components';
 import Card from '../Card/Card.component';
 import { INewsCard } from './NewsCard.interface';
 import { StyledChip } from '@/components/atoms/Chip/Chip.theme';
+import { variables } from '@/index';
 
 export const StyledNewsCard = styled(Card) <INewsCard>`
   padding: 1rem;
   color: ${colors.secondary50};
   background-color: ${colors.third10};
   border-radius: ${radius.sm};
-
+  text-align:center;
 
   ${StyledChip}{
     position: absolute;
@@ -62,5 +63,10 @@ export const StyledNewsCard = styled(Card) <INewsCard>`
 
     }
   }
+
+
+  @media only screen and (min-width: ${variables.responsiveMedia}) {
+    text-align:left;
+  }
 `;
 

package/src/styles/Global.ts

@@ -222,7 +222,7 @@ const GlobalStyles = createGlobalStyle`
 
     background: var(--color-secondary-70);
 
-    z-index: ${zIndexes.progress};
+    z-index: 200;
 
     transition: all 0.1s $ease-out-expo;
   }
@@ -239,7 +239,7 @@ const GlobalStyles = createGlobalStyle`
     flex-flow: row wrap;
     min-height: 100%;
 
-    z-index: ${zIndexes.content};
+    z-index: 96;
     transition: all 1.3s $ease-out-expo;
   }
 
@@ -268,7 +268,7 @@ const GlobalStyles = createGlobalStyle`
     border-radius: 50px;
 
     transform: translateX(-50%);
-    z-index: ${zIndexes.preloader};
+    z-index: 96;
   }
 
   .textEllipsis{

package/src/styles/utilities.ts

@@ -7,7 +7,8 @@ import {
   shadows,
   spaces,
   spacesNegative,
-  typography
+  typography,
+  zIndexes
 } from './variables';
 
 export const fontSize = (typo: string) => {
@@ -312,6 +313,11 @@ export const utilities: {
     class: "radius",
     values: radius
   },
+  "zIndex": {
+    property: "z-index",
+    class: "zIndex",
+    values: zIndexes
+  },
 };
 
 export function generateUtilities(utility: string, breakpoint: string): string {

package/src/styles/variables.ts

@@ -146,12 +146,12 @@ export const shadows = <Record<string, string>>{
   md: '10px 30px 30px rgba(0, 78, 210, 0.05)',
   lg: '10px 40px 40px rgba(0, 78, 210, 0.07)',
 }
-export const zIndexes = <Record<string, string>>{
-  progress: '200',
-  modal: '100',
-  content: '99',
-  preloader: '96',
-  linker: '95'
+export const zIndexes = <Record<number, number>>{
+  1: 1,
+  2: 2,
+  3: 3,
+  4: 4,
+  5: 5
 }
 export const grid_conf: {
   gridSize: number,