search

eser / aya-website

açık yazılım ağı web sitesi kaynak kodları
https://acikyazilimagi.com
Apache License 2.0
35 stars 16 forks source link

Text overlapping on 'community' page #30

Open mertssmnoglu opened 1 year ago

mertssmnoglu commented 1 year ago

On the community page Açık Yazılım Ağı text overlapping on the logo when the width>=768

page: 'https://acikyazilimagi.com/elements'

Batuhandgenc commented 1 year ago

Could you please write the problem with screenshots so that it can be more clearly understood? I didn't fully grasp it because when I looked at it.

mertssmnoglu commented 1 year ago

On current view 20230724_21h06m41s_grim

On 768x878 20230724_21h13m15s_grim

As you can see the Eser Ozvataf is overlapping. I hope I was able to explain the problem @Batuhandgenc

Batuhandgenc commented 1 year ago

I actually discussed this with Eser in the early hours today. I experienced the same issue when connecting with Linux/Ubuntu using Chrome. Based on my brief experiences, I thought it was because the code wasn't contained in separate boxes.

However, in the screenshot Eser sent, there doesn't seem to be any problem.

image-4.png

Still, could you please let me know the version you are using and whether you are on Windows/Ubuntu/iOS?

mertssmnoglu commented 1 year ago

I actually discussed this with Eser in the early hours today. I experienced the same issue when connecting with Linux/Ubuntu using Chrome. Based on my brief experiences, I thought it was because the code wasn't contained in separate boxes.

However, in the screenshot Eser sent, there doesn't seem to be any problem.

image-4.png

Still, could you please let me know the version you are using and whether you are on Windows/Ubuntu/iOS?

This is products page, i mean /elements could you please check it again?

mertssmnoglu commented 1 year ago

I'm using Firefox 115.0.2 (64-bit) on my 1920x1080 Arch Linux laptop.

OmerFI commented 1 year ago

I faced the same issue with my 27" monitor (you can also see the overflow if you zoom out with the scroll wheel)

https://github.com/acikkaynak/aya-website/assets/54645034/c5a90395-aeda-4cca-8e66-37dec8847e7e

The easiest solution I found to solve this problem is to use min-height not just height here:

https://github.com/acikkaynak/aya-website/blob/d60f170e2714950c7291151610107e585e705652/packages/web/src/shared/components/profiles/widgets/cards.module.css#L16