profile
viewpoint
If you are wondering where the data of this site comes from, please visit https://api.github.com/users/agriffis/events. GitMemory does not store any data, but only uses NGINX to cache data for a period of time. The idea behind GitMemory is simply to give users a better reading experience.

agriffis/adiff 3

Like GNU wdiff with context and unified diffs based on wordwise diff

agriffis/accoutrement-scale 0

Size and scale helpers for typography and layout

agriffis/agcom 0

Source code for my personal website

agriffis/ansible 0

Ansible is a radically simple IT automation platform that makes your applications and systems easier to deploy. Avoid writing scripts or custom code to deploy and update your applications — automate in a language that approaches plain English, using SSH, with no agents to install on remote systems. https://docs.ansible.com/ansible/

agriffis/arongriffis.com 0

Source code for my website

agriffis/aws-codepipeline-s3-codedeploy-linux 0

Use this sample when creating a simple pipeline in AWS CodePipeline while following the Simple Pipeline Walkthrough tutorial. http://docs.aws.amazon.com/codepipeline/latest/userguide/getting-started-w.html

agriffis/bing-wallpaper-gnome-extension 0

Simple GNOME shell extension change your wallpaper every day to Microsoft Bing's wallpaper (the background when you visit Bing.com).

issue openedgregberge/xstyled

Scale object in theme

💬 Questions and Help

I wonder is there any way to do responsive scale in theme object, like how styled-system does https://styled-system.com/theme-specification#scale-objects.

{
...
  variants: {
    heading: {
      fontSize: { sx: '14px', md: '16px', lg: '18px' }, // does't work with xstyled
      // fontSize: ['14px', '16px', '18px'], with styled-system
    },
  }

Thanks!

created time in 17 hours

issue commentgregberge/xstyled

Failed to resolve entry for package "@xstyled/styled-components"

I have the same error under ViteJS/React install : http://host.electroheadfx.fr/efxbox/laurent/Capturedecran2021-06-19a18.34.32.png I have not any issue with styled-components, chakra-ui (so styled-system) packages with VITE

electroheadfx

comment created time in 3 days

pull request commentgregberge/xstyled

fix: move away from mjs extension to work in more environments

I have the same error under ViteJS/React install : http://host.electroheadfx.fr/efxbox/laurent/Capturedecran2021-06-19a18.34.32.png I have not any issue with styled-components, chakra-ui (so styled-system) packages with VITE

AhmedAymanM

comment created time in 3 days

startedidentinet/sanctuary-cheat-sheet

started time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha 3e2e76632453582def5d1a6aec182ed408c6dfdd

chore: fix yarn.lock

view details

push time in 5 days

created taggregberge/xstyled

tagv3.0.2

A utility-first CSS-in-JS framework built for React. 💅👩‍🎤⚡️

created time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha 2f74a07671c544e65728a156ff8eb2d7a29dc5e2

v3.0.2

view details

push time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha b5280b6332a79a238bf7811562c9c9ddf1b5acbe

chore: upgrade deps

view details

Greg Bergé

commit sha 466b3a7cb87b2d67402c291695cda2adee976b4d

chore: fix types import

view details

Greg Bergé

commit sha c255d5e1fd554a200c8b01daa9709a9513d65987

chore: force resolution of gatsby-plugin-robots-txt https://github.com/mdreizin/gatsby-plugin-robots-txt/issues/457#issuecomment-850499932

view details

Greg Bergé

commit sha a7e32ffad8de2a903740e72ac7c944bb48d69a87

chore: fix tests

view details

Greg Bergé

commit sha 8daafcf9963fe60f497659f2ffb25903a5290d79

chore: adjust max size

view details

push time in 5 days

delete branch gregberge/xstyled

delete branch : upgrade-deps

delete time in 5 days

PR merged gregberge/xstyled

chore: upgrade deps
+2306 -1089

1 comment

9 changed files

gregberge

pr closed time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha aabf3101739b036b799144374fbc55525e01d904

chore: adjust max size

view details

push time in 5 days

pull request commentgregberge/xstyled

chore: upgrade deps

Codecov Report

Merging #282 (fbe5a1c) into main (9098b83) will increase coverage by 0.01%. The diff coverage is n/a.

Impacted file tree graph

@@            Coverage Diff             @@
##             main     #282      +/-   ##
==========================================
+ Coverage   92.73%   92.74%   +0.01%     
==========================================
  Files          60       60              
  Lines        1252     1255       +3     
  Branches      244      244              
==========================================
+ Hits         1161     1164       +3     
  Misses         91       91              
Impacted Files Coverage Δ
packages/system/src/unit.ts 97.50% <0.00%> (+0.20%) :arrow_up:

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 9098b83...fbe5a1c. Read the comment docs.

gregberge

comment created time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha fbe5a1cc4d6397c23bec5dbc9011c40b3a4ec59e

chore: fix tests

view details

push time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha bcfda4b77531487ac5a6b8c30b715dd2bcfd08bd

fix(breakpoints): add _ into breakpoints Fix #277

view details

push time in 5 days

delete branch gregberge/xstyled

delete branch : fix-breakpoints

delete time in 5 days

PR merged gregberge/xstyled

fix(breakpoints): add _ into breakpoints

Fix #277

+1 -0

1 comment

1 changed file

gregberge

pr closed time in 5 days

issue closedgregberge/xstyled

breakpoints function does not work with _ in v3

💥 Regression Report

Because _ breakpoint value is no longer present in the defaultTheme breakpoints function now returns null { ... } media query for objects with _ key. _ key was removed in fe74ec9cbb6ca6876737f0ffc965534193c8bb12.

Fix should be pretty straightforward, either _ breakpoint should be added back or getBreakpointMin should account for this. https://github.com/gregberge/xstyled/blob/4865316ed1d0881e3833c0c6aad139040927e08c/packages/system/src/media.ts#L18

Last working version

Worked up to version: 2.5.0

Stopped working in version: 3.0.0

To Reproduce

Steps to reproduce the behavior:

breakpoints({ _: { width: 10 } })({ theme: defaultTheme })

Expected behavior

Expected:

[{ width: 10 }]

Current:

["null {", { width: 10 }, "}"]

Link to repl or repo (highly encouraged)

https://codesandbox.io/s/magical-framework-6qjbh?file=/src/App.js

closed time in 5 days

AlfonzAlfonz

push eventgregberge/xstyled

Greg Bergé

commit sha 560b8db4ff4a70a6106a6d98581d54d19f6cc94e

chore: force resolution of gatsby-plugin-robots-txt https://github.com/mdreizin/gatsby-plugin-robots-txt/issues/457#issuecomment-850499932

view details

push time in 5 days

delete branch gregberge/xstyled

delete branch : fix-rpx-transformers

delete time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha 339f7fcf59fb79b6e042564a03c07d40514a6c87

fix(system): fix rpx transformers Fix #274

view details

push time in 5 days

PR merged gregberge/xstyled

fix(system): fix rpx transformers

Fix #274

+9 -4

1 comment

3 changed files

gregberge

pr closed time in 5 days

issue closedgregberge/xstyled

rpxTransformers not working as expected in V3

💥 Regression Report

After upgrading from 2.5.0 to 3.0.1, all of my unitless elements are no longer being converted to rem, but rather get rendered as their unitless value, which leads to a broken layout.

Last working version

Worked up to version: 2.5.0

Stopped working in version: 3.0.1

To Reproduce

Add rpxTransformers to your theme object.

import { defaultTheme, DefaultTheme, rpxTransformers } from '@xstyled/styled-components'
// import { rpxTransformers } from '@xstyled/system'

const bhsTheme: DefaultTheme = {
  ...defaultTheme,
    transformers: {
      ...rpxTransformers,
    },
    sizes: {
      ...defaultTheme.sizes,
      cardWidth: 320 - 32,
      }
  }

note - rpxTransformers is now imported from @xstyled/styled-components instead of @xstyled/system as before. Didn't see this documented in the migration guide, but this page indicate this change.
The same issue persists importing this either way.

Create a component using this feature, example.

const ToolsArea = styled.divBox`
  display: grid;
  grid-template-columns: 1fr;
  gap: 8;
  @media (min-width: md) {
    gap: 120;
    height: 5000;
    grid-template-columns: repeat(
      auto-fit,
      minmax(${th.size('cardWidth')}, 1fr)
    );
  }
`

Expected behavior

gap: 8 maps to the default theme size key, and works as expected (2 rem). gap: 120 doesn't map to a theme value, so I expect it to be converted to the rem equivalent, but it comes out as gap: 120, which is an invalid value.

grid-template-columns uses a size from my theme, but the value does not get converted to it's rem equivalent (7.5rem), but instead comes out as... grid-template-columns: repeat( auto-fit,minmax(288,1fr) );

  1. Put in height for the example, which also doesn't convert. height: 5000; vs the expected height: 312.5rem;

npx envinfo --system --binaries --npmPackages @xstyled/system,@xstyled/styled-components,styled-components --markdown --clipboard

Paste the results here:

## System:
 - OS: macOS 11.2.3
 - CPU: (4) x64 Intel(R) Core(TM) i5-7267U CPU @ 3.10GHz
 - Memory: 521.88 MB / 8.00 GB
 - Shell: 5.8 - /bin/zsh
## Binaries:
 - Node: 12.16.1 - ~/.nvm/versions/node/v12.16.1/bin/node
 - Yarn: 1.22.5 - ~/.yarn/bin/yarn
 - npm: 6.14.6 - ~/.nvm/versions/node/v12.16.1/bin/npm
 - Watchman: 4.9.0 - /usr/local/bin/watchman
## npmPackages:
 - @xstyled/styled-components: ^3.0.1 => 3.0.1 
 - styled-components: ^5.3.0 => 5.3.0

closed time in 5 days

SpicyPete

push eventgregberge/xstyled

Greg Bergé

commit sha 4d88c18712f9c020af988b8072157a836a6cd0d7

fix(emotion): fix color prop Fix #276

view details

Greg Bergé

commit sha d5c953dd88f24485ba3d76f22629359617a2ea59

refactor: rename type

view details

push time in 5 days

issue closedgregberge/xstyled

Color prop responsive type v3

🐛 Bug Report

Since the original issue got closed and I'm unable to reopen it, I'm creating a new one. There is a problem with the type definition of a color prop because it combines the type of a color attribute prop and color utility prop. This means that only strings are valid inputs.

I'd gladly help to resolve this issue :)

To Reproduce

Use color prop with an object.

<x.a
  href="#"
  color={{
    _: 'indigo-500',
    hover: 'indigo-600',
    visited: { hover: 'indigo-900' },
  }}
>
  Link
</x.a>

Expected behavior

The color prop should accept objects with responsive/state values as described in docs. https://xstyled.dev/docs/hover-focus-other-states/

Link to repl or repo (highly encouraged)

https://codesandbox.io/s/xstyled-color-type-error-forked-v3kz2?file=/src/App.tsx

closed time in 5 days

AlfonzAlfonz

delete branch gregberge/xstyled

delete branch : fix-color-prop

delete time in 5 days

PR merged gregberge/xstyled

fix color prop
  • fix(emotion): fix color prop
  • refactor: rename type
+3 -3

1 comment

2 changed files

gregberge

pr closed time in 5 days

push eventgregberge/xstyled

Greg Bergé

commit sha 979caefac151e649d68356b6888917c24337098e

chore: fix types import

view details

push time in 5 days

create barnchgregberge/xstyled

branch : upgrade-deps

created branch time in 5 days

PR opened gregberge/xstyled

chore: upgrade deps
+2283 -1061

0 comment

7 changed files

pr created time in 5 days

pull request commentgregberge/xstyled

fix(system): fix rpx transformers

Codecov Report

Merging #281 (cf86fb9) into main (9098b83) will increase coverage by 0.01%. The diff coverage is 100.00%.

Impacted file tree graph

@@            Coverage Diff             @@
##             main     #281      +/-   ##
==========================================
+ Coverage   92.73%   92.74%   +0.01%     
==========================================
  Files          60       60              
  Lines        1252     1255       +3     
  Branches      244      244              
==========================================
+ Hits         1161     1164       +3     
  Misses         91       91              
Impacted Files Coverage Δ
packages/system/src/unit.ts 97.50% <100.00%> (+0.20%) :arrow_up:

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 9098b83...cf86fb9. Read the comment docs.

gregberge

comment created time in 5 days