diff --git a/data/administracja.json b/data/administracja.json
index 81abdfa..50ccfcb 100644
--- a/data/administracja.json
+++ b/data/administracja.json
@@ -2,8 +2,7 @@
{
"name": "jamesen",
"desc": "Frontendowiec nie jebany.",
- "img": "https://pbs.twimg.com/profile_images/1605591811921149953/Ogr8ALPa_400x400.jpg",
- "profilehref": "jamesen"
+ "img": "https://pbs.twimg.com/profile_images/1605591811921149953/Ogr8ALPa_400x400.jpg"
},
{
"name": "Mollin",
diff --git a/pages/o-gractwie.tsx b/pages/o-gractwie.tsx
index cf524cd..4d80c65 100644
--- a/pages/o-gractwie.tsx
+++ b/pages/o-gractwie.tsx
@@ -51,7 +51,9 @@ const PageInfo = () => {
return (
diff --git a/styles/oGractwie.module.scss b/styles/oGractwie.module.scss
index 076392a..34132e1 100644
--- a/styles/oGractwie.module.scss
+++ b/styles/oGractwie.module.scss
@@ -50,43 +50,47 @@
a {
color: inherit;
text-decoration: inherit;
- }
- article {
- --radius: 6px;
- flex: 1;
- display: flex;
- flex-direction: row;
- background: var(--black1);
- border-radius: var(--radius);
- box-shadow: var(--shadow0);
- img {
- width: 128px;
- max-width: 156px;
- flex: 1;
- border-top-left-radius: var(--radius);
- border-bottom-left-radius: var(--radius);
- // for alt text
- color: var(--grey);
- // for mollin's vertical picture to display well
- aspect-ratio: 1 / 1;
- object-fit: cover;
- object-position: 50% 35%;
- }
- div {
- min-width: 14rem;
- padding: 0 1rem;
- }
- }
- @media screen and (max-width: 400px) {
article {
- flex-direction: column;
- width: 100%;
+ --radius: 6px;
+ flex: 1;
+ display: flex;
+ flex-direction: row;
+ background: var(--black1);
+ border-radius: var(--radius);
+ box-shadow: var(--shadow0);
+ transition-duration: 100ms;
img {
- margin: 1rem auto;
- border-radius: 8px;
+ width: 128px;
+ max-width: 156px;
+ flex: 1;
+ border-top-left-radius: var(--radius);
+ border-bottom-left-radius: var(--radius);
+ // for alt text
+ color: var(--grey);
+ // for mollin's vertical picture to display well
+ aspect-ratio: 1 / 1;
+ object-fit: cover;
+ object-position: 50% 35%;
}
div {
- padding-bottom: 1rem;
+ min-width: 14rem;
+ padding: 0 1rem;
+ }
+ &:hover {
+ background: var(--black2);
+ }
+ }
+ @media screen and (max-width: 400px) {
+ article {
+ flex-direction: column;
+ width: 100%;
+ img {
+ margin: 1rem auto;
+ border-radius: 8px;
+ }
+ div {
+ padding-bottom: 1rem;
+ }
}
}
}