monica-alexandria 2.7.0 → 2.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.es.js +9 -10
  2. package/dist/index.js +15 -16
  3. package/package.json +1 -1
  4. package/src/components/navbar/Navbar.jsx +9 -10
package/dist/index.es.js CHANGED
@@ -827,8 +827,7 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
827
827
  z-index: 15;
828
828
  width: 100%;
829
829
  padding: 1rem 4rem;
830
- background: ${r=>"dark"===r.theme?"var(--dark)":"var(--white)"};
831
- box-shadow: ${r=>"dark"===r.theme?"0 1px 3px var(--shine)":"0 1px 3px var(--shadow)"};
830
+ background: ${r=>r.theme.color};
832
831
  `,vr=r.div`
833
832
  display: flex;
834
833
  gap: 1rem;
@@ -893,8 +892,8 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
893
892
  top: 6rem;
894
893
  right: 4rem;
895
894
  width: 30rem;
896
- background: ${r=>"dark"===r.theme?"var(--gloomDark)":"var(--greyLight)"};
897
- box-shadow: ${r=>"dark"===r.theme?"var(--outShine)":"var(--outShadow)"};
895
+ background: ${r=>r.theme.low};
896
+ box-shadow: ${r=>r.theme.out};
898
897
  border-radius: var(--normalRadius);
899
898
  overflow: hidden;
900
899
  transition: height .5s ease;
@@ -965,7 +964,7 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
965
964
 
966
965
  svg{
967
966
  width: var(--buttonNormalIcon);
968
- color: ${r=>"dark"===r.theme?"var(--gloom)":"var(--black)"};
967
+ color: ${r=>r.theme.mid};
969
968
  }
970
969
 
971
970
  img{
@@ -976,7 +975,7 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
976
975
  }
977
976
 
978
977
  &:hover{
979
- background: ${r=>"dark"===r.theme?"var(--dark)":"var(--white)"};
978
+ background: ${r=>r.theme.background};
980
979
  }
981
980
  `,br=r.div`
982
981
  display: flex;
@@ -996,7 +995,7 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
996
995
  height: 3rem;
997
996
  width: 3rem;
998
997
  border-radius: 50%;
999
- background: ${r=>"dark"===r.theme?"var(--gloom)":"var(--grey)"};
998
+ background: ${r=>r.theme.mid};
1000
999
  overflow: hidden;
1001
1000
  display: flex;
1002
1001
  align-items: center;
@@ -1004,7 +1003,7 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
1004
1003
 
1005
1004
  svg{
1006
1005
  width: var(--buttonNormalIcon);
1007
- color: ${r=>"dark"===r.theme?"var(--gloom)":"var(--black)"};
1006
+ color: ${r=>r.theme.mid};
1008
1007
  }
1009
1008
 
1010
1009
  img{
@@ -1018,12 +1017,12 @@ import r,{keyframes as a}from"styled-components";const e=r.button`
1018
1017
  aside{
1019
1018
  svg{
1020
1019
  height: var(--buttonNormalIcon);
1021
- color: ${r=>"dark"===r.theme?"var(--blanc)":"var(--black)"};
1020
+ color: ${r=>r.theme.color};
1022
1021
  }
1023
1022
  }
1024
1023
 
1025
1024
  &:hover{
1026
- background: ${r=>"dark"===r.theme?"var(--dark)":"var(--white)"};
1025
+ background: ${r=>r.theme.background};
1027
1026
  }
1028
1027
  `,fr=r(br)`
1029
1028
  display: none;
package/dist/index.js CHANGED
@@ -242,7 +242,7 @@
242
242
  &:hover{
243
243
  background: var(--mainLight);
244
244
  }
245
- `,x=e.default(o)`
245
+ `,b=e.default(o)`
246
246
  background: transparent;
247
247
  border: 1px solid transparent;
248
248
 
@@ -264,7 +264,7 @@
264
264
  fill: var(--mainLight);
265
265
  }
266
266
  }
267
- `,b=e.default(i)`
267
+ `,x=e.default(i)`
268
268
  background: transparent;
269
269
  border: 1px solid transparent;
270
270
 
@@ -827,8 +827,7 @@
827
827
  z-index: 15;
828
828
  width: 100%;
829
829
  padding: 1rem 4rem;
830
- background: ${r=>"dark"===r.theme?"var(--dark)":"var(--white)"};
831
- box-shadow: ${r=>"dark"===r.theme?"0 1px 3px var(--shine)":"0 1px 3px var(--shadow)"};
830
+ background: ${r=>r.theme.color};
832
831
  `,gr=e.default.div`
833
832
  display: flex;
834
833
  gap: 1rem;
@@ -893,8 +892,8 @@
893
892
  top: 6rem;
894
893
  right: 4rem;
895
894
  width: 30rem;
896
- background: ${r=>"dark"===r.theme?"var(--gloomDark)":"var(--greyLight)"};
897
- box-shadow: ${r=>"dark"===r.theme?"var(--outShine)":"var(--outShadow)"};
895
+ background: ${r=>r.theme.low};
896
+ box-shadow: ${r=>r.theme.out};
898
897
  border-radius: var(--normalRadius);
899
898
  overflow: hidden;
900
899
  transition: height .5s ease;
@@ -946,7 +945,7 @@
946
945
  }
947
946
  `,kr=e.default.div`
948
947
 
949
- `,xr=e.default.div`
948
+ `,br=e.default.div`
950
949
  display: flex;
951
950
  align-items: center;
952
951
  gap: 1rem;
@@ -965,7 +964,7 @@
965
964
 
966
965
  svg{
967
966
  width: var(--buttonNormalIcon);
968
- color: ${r=>"dark"===r.theme?"var(--gloom)":"var(--black)"};
967
+ color: ${r=>r.theme.mid};
969
968
  }
970
969
 
971
970
  img{
@@ -976,9 +975,9 @@
976
975
  }
977
976
 
978
977
  &:hover{
979
- background: ${r=>"dark"===r.theme?"var(--dark)":"var(--white)"};
978
+ background: ${r=>r.theme.background};
980
979
  }
981
- `,br=e.default.div`
980
+ `,xr=e.default.div`
982
981
  display: flex;
983
982
  align-items: center;
984
983
  justify-content: space-between;
@@ -996,7 +995,7 @@
996
995
  height: 3rem;
997
996
  width: 3rem;
998
997
  border-radius: 50%;
999
- background: ${r=>"dark"===r.theme?"var(--gloom)":"var(--grey)"};
998
+ background: ${r=>r.theme.mid};
1000
999
  overflow: hidden;
1001
1000
  display: flex;
1002
1001
  align-items: center;
@@ -1004,7 +1003,7 @@
1004
1003
 
1005
1004
  svg{
1006
1005
  width: var(--buttonNormalIcon);
1007
- color: ${r=>"dark"===r.theme?"var(--gloom)":"var(--black)"};
1006
+ color: ${r=>r.theme.mid};
1008
1007
  }
1009
1008
 
1010
1009
  img{
@@ -1018,14 +1017,14 @@
1018
1017
  aside{
1019
1018
  svg{
1020
1019
  height: var(--buttonNormalIcon);
1021
- color: ${r=>"dark"===r.theme?"var(--blanc)":"var(--black)"};
1020
+ color: ${r=>r.theme.color};
1022
1021
  }
1023
1022
  }
1024
1023
 
1025
1024
  &:hover{
1026
- background: ${r=>"dark"===r.theme?"var(--dark)":"var(--white)"};
1025
+ background: ${r=>r.theme.background};
1027
1026
  }
1028
- `,yr=e.default(br)`
1027
+ `,yr=e.default(xr)`
1029
1028
  display: none;
1030
1029
 
1031
1030
  @media ${vr.md} {
@@ -1294,4 +1293,4 @@
1294
1293
  display: none;
1295
1294
  }
1296
1295
  }
1297
- `;exports.AuthActions=Er,exports.AuthCap=Wr,exports.AuthCheck=Gr,exports.AuthContainer=Mr,exports.AuthForm=Ar,exports.AuthLogo=Ir,exports.AuthSecondary=Cr,exports.AuthWrapper=jr,exports.BoxActions=rr,exports.BoxContent=Z,exports.BoxGrid=K,exports.BoxWrapper=Q,exports.Container=zr,exports.CtaButtonLarge=s,exports.CtaButtonNormal=n,exports.CtaButtonSmall=l,exports.DeleteButtonLarge=N,exports.DeleteButtonNormal=D,exports.DeleteButtonSmall=S,exports.EditList=Yr,exports.EditSelect=Ur,exports.EditTips=Vr,exports.EditUploadAvatar=Or,exports.EditUploadCover=Xr,exports.EditWrapper=Hr,exports.ErrorValidator=_,exports.FocusButtonLarge=g,exports.FocusButtonNormal=m,exports.FocusButtonSmall=v,exports.FocusPlainButtonLarge=h,exports.FocusPlainButtonNormal=p,exports.FocusPlainButtonSmall=u,exports.GreyButtonLarge=T,exports.GreyButtonNormal=B,exports.GreyButtonSmall=P,exports.GreyDropdownNormal=tr,exports.GreyLinkButtonLarge=F,exports.GreyLinkButtonNormal=z,exports.GreyLinkButtonSmall=R,exports.InputAdd=O,exports.InputGroup=H,exports.InputIcon=V,exports.InputLarge=A,exports.InputMandatory=U,exports.InputNormal=j,exports.InputSearch=X,exports.InputSmall=M,exports.LabelLarge=E,exports.LabelNormal=W,exports.LabelSmall=G,exports.MainButtonLarge=k,exports.MainButtonNormal=f,exports.MainButtonSmall=c,exports.MainPlainButtonLarge=y,exports.MainPlainButtonNormal=b,exports.MainPlainButtonSmall=x,exports.Navbar=mr,exports.NavbarCta=pr,exports.NavbarHam=fr,exports.NavbarHamList=kr,exports.NavbarHamListItem=br,exports.NavbarHamMobileItem=yr,exports.NavbarHamTitle=xr,exports.NavbarList=cr,exports.NavbarLogo=gr,exports.NavbarRight=hr,exports.NavbarText=ur,exports.PageAlwaysVisible=Pr,exports.PageForty=Nr,exports.PageMobileHidden=Br,exports.PagePaddings=wr,exports.PageSamePaddings=Lr,exports.PageSixty=Dr,exports.PageTopPaddings=Sr,exports.Section=Fr,exports.SlideIn=$r,exports.Slider=_r,exports.SliderBg=qr,exports.SliderContainer=Jr,exports.SliderTitle=Qr,exports.SliderWrapper=Kr,exports.SuccessValidator=q,exports.TextareaLarge=lr,exports.TextareaNormal=dr,exports.TextareaSmall=ir,exports.Theme=Tr,exports.ThemeDark={id:"dark",background:"var(--dark)",color:"var(--blanc)",low:"var(--gloomLight)",mid:"var(--gloom)",high:"var(--gloomDark)",overlay:"var(--blancOverlay)",in:"var(--insetShine)",inFocus:"var(--insetShineFocus)",out:"var(--outShine)",outFocus:"var(--outShineFocus)"},exports.ThemeLight={id:"light",background:"var(--light)",color:"var(--black)",low:"var(--greyLight)",mid:"var(--grey)",high:"var(--greyDark)",overlay:"var(--blackOverlay)",in:"var(--insetShadow)",inFocus:"var(--insetShadowFocus)",out:"var(--outShadow)",outFocus:"var(--outShadowFocus)"},exports.TipValidator=J,exports.WhitePlainButtonLarge=L,exports.WhitePlainButtonNormal=w,exports.WhitePlainButtonSmall=$,exports.Wrapper=Rr,exports.breakPoints=nr,exports.breakSize=sr,exports.device=vr;
1296
+ `;exports.AuthActions=Er,exports.AuthCap=Wr,exports.AuthCheck=Gr,exports.AuthContainer=Mr,exports.AuthForm=Ar,exports.AuthLogo=Ir,exports.AuthSecondary=Cr,exports.AuthWrapper=jr,exports.BoxActions=rr,exports.BoxContent=Z,exports.BoxGrid=K,exports.BoxWrapper=Q,exports.Container=zr,exports.CtaButtonLarge=s,exports.CtaButtonNormal=n,exports.CtaButtonSmall=l,exports.DeleteButtonLarge=N,exports.DeleteButtonNormal=D,exports.DeleteButtonSmall=S,exports.EditList=Yr,exports.EditSelect=Ur,exports.EditTips=Vr,exports.EditUploadAvatar=Or,exports.EditUploadCover=Xr,exports.EditWrapper=Hr,exports.ErrorValidator=_,exports.FocusButtonLarge=g,exports.FocusButtonNormal=m,exports.FocusButtonSmall=v,exports.FocusPlainButtonLarge=h,exports.FocusPlainButtonNormal=p,exports.FocusPlainButtonSmall=u,exports.GreyButtonLarge=T,exports.GreyButtonNormal=B,exports.GreyButtonSmall=P,exports.GreyDropdownNormal=tr,exports.GreyLinkButtonLarge=F,exports.GreyLinkButtonNormal=z,exports.GreyLinkButtonSmall=R,exports.InputAdd=O,exports.InputGroup=H,exports.InputIcon=V,exports.InputLarge=A,exports.InputMandatory=U,exports.InputNormal=j,exports.InputSearch=X,exports.InputSmall=M,exports.LabelLarge=E,exports.LabelNormal=W,exports.LabelSmall=G,exports.MainButtonLarge=k,exports.MainButtonNormal=f,exports.MainButtonSmall=c,exports.MainPlainButtonLarge=y,exports.MainPlainButtonNormal=x,exports.MainPlainButtonSmall=b,exports.Navbar=mr,exports.NavbarCta=pr,exports.NavbarHam=fr,exports.NavbarHamList=kr,exports.NavbarHamListItem=xr,exports.NavbarHamMobileItem=yr,exports.NavbarHamTitle=br,exports.NavbarList=cr,exports.NavbarLogo=gr,exports.NavbarRight=hr,exports.NavbarText=ur,exports.PageAlwaysVisible=Pr,exports.PageForty=Nr,exports.PageMobileHidden=Br,exports.PagePaddings=wr,exports.PageSamePaddings=Lr,exports.PageSixty=Dr,exports.PageTopPaddings=Sr,exports.Section=Fr,exports.SlideIn=$r,exports.Slider=_r,exports.SliderBg=qr,exports.SliderContainer=Jr,exports.SliderTitle=Qr,exports.SliderWrapper=Kr,exports.SuccessValidator=q,exports.TextareaLarge=lr,exports.TextareaNormal=dr,exports.TextareaSmall=ir,exports.Theme=Tr,exports.ThemeDark={id:"dark",background:"var(--dark)",color:"var(--blanc)",low:"var(--gloomLight)",mid:"var(--gloom)",high:"var(--gloomDark)",overlay:"var(--blancOverlay)",in:"var(--insetShine)",inFocus:"var(--insetShineFocus)",out:"var(--outShine)",outFocus:"var(--outShineFocus)"},exports.ThemeLight={id:"light",background:"var(--light)",color:"var(--black)",low:"var(--greyLight)",mid:"var(--grey)",high:"var(--greyDark)",overlay:"var(--blackOverlay)",in:"var(--insetShadow)",inFocus:"var(--insetShadowFocus)",out:"var(--outShadow)",outFocus:"var(--outShadowFocus)"},exports.TipValidator=J,exports.WhitePlainButtonLarge=L,exports.WhitePlainButtonNormal=w,exports.WhitePlainButtonSmall=$,exports.Wrapper=Rr,exports.breakPoints=nr,exports.breakSize=sr,exports.device=vr;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "monica-alexandria",
3
- "version": "2.7.0",
3
+ "version": "2.7.1",
4
4
  "description": "A styled-components styles library for Doitforme platorm and universal tweeks to create your own new styled library for your project",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.es.js",
package/src/components/navbar/Navbar.jsx CHANGED
@@ -13,8 +13,7 @@ export const Navbar = styled.nav`
13
13
  z-index: 15;
14
14
  width: 100%;
15
15
  padding: 1rem 4rem;
16
- background: ${props => props.theme === 'dark' ? "var(--dark)" : "var(--white)"};
17
- box-shadow: ${props => props.theme === 'dark' ? "0 1px 3px var(--shine)" : "0 1px 3px var(--shadow)"};
16
+ background: ${props => props.theme.color};
18
17
  `
19
18
 
20
19
  export const NavbarLogo = styled.div`
@@ -91,8 +90,8 @@ export const NavbarHam = styled.div`
91
90
  top: 6rem;
92
91
  right: 4rem;
93
92
  width: 30rem;
94
- background: ${props => props.theme === 'dark' ? 'var(--gloomDark)' : 'var(--greyLight)'};
95
- box-shadow: ${props => props.theme === 'dark' ? 'var(--outShine)' : 'var(--outShadow)'};
93
+ background: ${props => props.theme.low};
94
+ box-shadow: ${props => props.theme.out};
96
95
  border-radius: var(--normalRadius);
97
96
  overflow: hidden;
98
97
  transition: height .5s ease;
@@ -167,7 +166,7 @@ export const NavbarHamTitle = styled.div`
167
166
 
168
167
  svg{
169
168
  width: var(--buttonNormalIcon);
170
- color: ${props => props.theme === 'dark' ? 'var(--gloom)' : 'var(--black)'};
169
+ color: ${props => props.theme.mid};
171
170
  }
172
171
 
173
172
  img{
@@ -178,7 +177,7 @@ export const NavbarHamTitle = styled.div`
178
177
  }
179
178
 
180
179
  &:hover{
181
- background: ${props => props.theme === 'dark' ? 'var(--dark)' : 'var(--white)'};
180
+ background: ${props => props.theme.background};
182
181
  }
183
182
  `
184
183
 
@@ -200,7 +199,7 @@ export const NavbarHamListItem = styled.div`
200
199
  height: 3rem;
201
200
  width: 3rem;
202
201
  border-radius: 50%;
203
- background: ${props => props.theme === 'dark' ? 'var(--gloom)' : 'var(--grey)'};
202
+ background: ${props => props.theme.mid};
204
203
  overflow: hidden;
205
204
  display: flex;
206
205
  align-items: center;
@@ -208,7 +207,7 @@ export const NavbarHamListItem = styled.div`
208
207
 
209
208
  svg{
210
209
  width: var(--buttonNormalIcon);
211
- color: ${props => props.theme === 'dark' ? 'var(--gloom)' : 'var(--black)'};
210
+ color: ${props => props.theme.mid};
212
211
  }
213
212
 
214
213
  img{
@@ -222,12 +221,12 @@ export const NavbarHamListItem = styled.div`
222
221
  aside{
223
222
  svg{
224
223
  height: var(--buttonNormalIcon);
225
- color: ${props => props.theme === 'dark' ? 'var(--blanc)' : 'var(--black)'};
224
+ color: ${props => props.theme.color};
226
225
  }
227
226
  }
228
227
 
229
228
  &:hover{
230
- background: ${props => props.theme === 'dark' ? 'var(--dark)' : 'var(--white)'};
229
+ background: ${props => props.theme.background};
231
230
  }
232
231
  `
233
232