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

Convert "border" to a Drawable, not a style #498

Open
noahgibbs opened this issue Dec 12, 2023 · 2 comments
Open

Convert "border" to a Drawable, not a style #498

noahgibbs opened this issue Dec 12, 2023 · 2 comments
Labels
enhancement New feature or request good first issue Good for newcomers KWoC-2023 IIT Kharagpur Winter of Code 2023 - good for new contributors

Comments

@noahgibbs
Copy link
Collaborator

This would be a pretty big first issue -- but also a fun and useful one. There are a lot of steps here, but they're not hard steps. Feel free to ask for help if you take this on!

In Shoes3, "border" isn't a style on Stack or Flow. It's an object of its own. If you add it after text, it will cover it:

Shoes.app(width: 300, height: 50) do
  stack do
    para "This is partly covered by the border"
    border yellow, strokewidth: 10
    para "This shows through on top"
  end
end
Screenshot 2023-12-12 at 13 33 43

So when converted to HTML, the background is just a div with a color or gradient around the edges. Note that it's possible to have a gradient as the background. From example examples/stack/gradients.rb:

border "#090979".."#ac033d", strokewidth: 15

For this bug, we will need a "border" Drawable, both in lacci/lib/shoes/drawables and in lib/scarpe/wv. We should get rid of the "border" style on slot objects (like stacks and flows). You can find code for rendering a gradient to HTML in method border_style in scarpe-components/lib/scarpe/components/calzini/slots.rb -- Calzini is also where code to render the Border drawable to HTML should live. The rendering code should go away in calzini/slots.rb and instead be in whichever Calzini file you add border_element to.

The border should mostly be a div which defaults to height: 100% and width: 100%.

@noahgibbs noahgibbs added enhancement New feature or request good first issue Good for newcomers KWoC-2023 IIT Kharagpur Winter of Code 2023 - good for new contributors labels Dec 12, 2023
@HUDASULTANA
Copy link

Hello @noahgibbs How can I help you with this issue ?

@noahgibbs
Copy link
Collaborator Author

I've mostly set it aside as something interesting for newer folks to work on. It would be possible for me to work on it with you or walk you through it. But it touches a lot of different parts of Scarpe. You'll definitely at least want to watch a code walk-through video first.

(Also, time for me to make a new code walk-through video. The old one's not bad, but it's been a bit since last time I recorded one.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request good first issue Good for newcomers KWoC-2023 IIT Kharagpur Winter of Code 2023 - good for new contributors
Projects
None yet
Development

No branches or pull requests

2 participants