Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add basic setup for showing open source projects #693

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

Siilwyn
Copy link
Member

@Siilwyn Siilwyn commented Jun 16, 2023

What changes were made

  • Add basic component to show open source projects.
  • Allow app-link to be styled as a underlined link, I'll create a separate PR to refactor app-button and use app-link in other places. This simplifies the styling and allows for long links to be wrapped on narrow viewports.

How to test or check results

/en/open-source

Checks

@Siilwyn Siilwyn force-pushed the basic-os-projects branch 2 times, most recently from 831cffc to 0d33f4c Compare June 23, 2023 12:16
@Siilwyn Siilwyn marked this pull request as ready for review June 23, 2023 12:16
@Siilwyn Siilwyn force-pushed the basic-os-projects branch from 0d33f4c to bc0936b Compare June 23, 2023 12:27
Copy link
Contributor

@Frankwarnaar Frankwarnaar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since @lsarni also had some thoughts if we should make this pretty specific component, I think we should have a look with the three of us how to approach this. I'll get back to you guys tomorrow.

migrations/1686676888_addOpenSourcePage.ts Show resolved Hide resolved
await client.fields.create(sectionOpenSourceProjectItemModel, {
label: 'Description',
api_key: 'description',
field_type: 'string',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we make this structured text? Then it's more flexible in the future for deciding which content goes in it. Maybe we can also allow h3, so the title could optionally be added, without needing a designated field for it. Which in turn makes the component more flexible.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Think I want to enforce a title, but having a structured text here could be nice yes 👍

migrations/1686676888_addOpenSourcePage.ts Show resolved Hide resolved
<slot />
<LinkWithTrailingSlash
:class="{
body: Boolean(variant),
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So the font size and line height are dependent of the app link being underlined?

Since the class is being set on the root element of the LinkWithTrailingSlash, which also is the root element of the AppLink, could we maybe add the body class on the open source projects component? Then the typography styles are more flexible.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So the font size and line height are dependent of the app link being underlined?

Yes

could we maybe add the body class on the open source projects component

I'm unsure, I understand the extra flexibility but don't you think that having body styling by default covers all cases where a link needs to look like a link? Actually what do you think of only adding the body class when the underline variant is given?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would prefer only adding the body class for the underline variant. I prefer making develop intentions clear. And we're not sure if the body class is needed for another future variant. Adding it already might make other developers wonder if it breaks anything to remove the body class.

>
<span
v-if="variant === 'underline'"
class="app-link__icon"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we name this call app-link__content or so? IMO it's not really the icon but actually the content, after which we append the arrow icon.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants