scarpe-team / scarpe

Scarpe - shoes but running on webview
Other
162 stars 29 forks source link

Fixed the Margin-shorthand property #544

Closed Nj221102 closed 6 months ago

Nj221102 commented 6 months ago

Description

Similar to font shorthand, the margin shorthand was being overwritten by default input of specific margin properties. This PR addresses this issue by implementing the following improvements:

  1. Fixing the Margin Shorthand Property: The margin shorthand property is fixed by directly mapping it with specific margin properties in Lacci. This means that the margin shorthand will no longer write to the margin property. Instead, it will be split into four parts and sent to the specific margin properties.

  2. Consistent Input Pattern: The margin shorthand now follows the same input pattern as the original Shoes library, which is [left, top, right, bottom].

  3. Enhanced Flexibility: More types of input are now supported, including strings. Additionally, users can now provide only two or three entries to the margin, such as [20, 30], which increases the flexibility of user input.

  4. Documentation Update: The manual.md file is updated to reflect the changes in the Margin Shorthand Property.

  5. Test Coverage: Tests are added for the margin_parse method, which handles the mapping of the margin shorthand to specific properties.

  6. Removal of 'Pacifico' Font: The 'Pacifico' font is removed from the example font_family.rb. This font was causing path mismatch issues whenever fixtures were generated and then GitHub CI tests were failing. Until the issue is fixed, its removal helps avoid confusion for newcomers.

  7. Example Illustration: An example is provided to demonstrate how the margin shorthand works now.

    Shoes.app do
    
    para "All margins with array input", margin:[60,30,80,40]
    
    para "All margins with string input", margin: "30 20 10 20"
    
    para "One Number to set all margins", margin:20
    
    para "Specific property can overwrite shorthand" , margin:[20,10,20,30], margin_top:100
    
    end

Image(if needed, helps for a faster review)

Screenshot 2024-02-11 at 1 41 51 AM

Checklist

noahgibbs commented 6 months ago

Good stuff! Better tests on margin is fantastic, and so is having Lacci do the parsing instead of burying it in Calzini where it's all specific to our HTML layer.

Something that might simplify this, and that I would love, is if we got rid of the "margin" Shoes style completely. And then the "margin=" method could just set more specific styles (margin_left, etc.). I know it's annoying when you already have this PR basically done, but would you be willing to change it to work like that? Then it will act more like the font style, which I think is the right way to do it, and it's definitely more consistent. I actually think that's not how Shoes3 did it, but I think it's the right way to do it. And if font does it that way, I think margin should too.

A couple of small things...

Nj221102 commented 6 months ago

Good stuff! Better tests on margin is fantastic, and so is having Lacci do the parsing instead of burying it in Calzini where it's all specific to our HTML layer.

Something that might simplify this, and that I would love, is if we got rid of the "margin" Shoes style completely. And then the "margin=" method could just set more specific styles (margin_left, etc.). I know it's annoying when you already have this PR basically done, but would you be willing to change it to work like that? Then it will act more like the font style, which I think is the right way to do it, and it's definitely more consistent. I actually think that's not how Shoes3 did it, but I think it's the right way to do it. And if font does it that way, I think margin should too.

A couple of small things...

  • Would it be possible to check in Calzini, when rendering, if all four margins match and set the HTML margin property? That would get the fixtures to match the old output, and look better in the HTML.
  • I'm not sure what's up with the two- and three-element array syntaxes, which give results like top+left, bottom+right margins. Do you use things like that personally? Or do other systems set margins in similar ways? It seems to add a lot of code that I'm not sure anybody would use.
  • I feel kind of funny about changing manual.md. If we don't add the two- and three-element array syntaxes, though, I'm not sure we need to. We probably do want to start a new "Scarpe Manual" document at some point soon, though. We do have a number of important differences from Old Shoes, and we're not explaining them very well.

I am done with the changes, but I ended up messing up my GitHub branches :( , so I think i will close this one and open a new pull request, sorry for the inconvenience caused

noahgibbs commented 6 months ago

Reopening PRs isn't a problem. All good. Git stuff can take some getting used to :-)