-
Notifications
You must be signed in to change notification settings - Fork 28
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
Cap #428
base: main
Are you sure you want to change the base?
Cap #428
Conversation
* generating files is broken due to repo changes * progress * fraction * progress added fraction and refactored code
will update tests along with adding a example and maybe del too. |
@@ -7,7 +7,7 @@ def arc_element(props, &block) | |||
HTML.render do |h| | |||
h.div(id: html_id, style: arc_style(props)) do | |||
h.svg(width: props["width"], height: props["height"]) do | |||
h.path(d: arc_path(props), transform: "rotate(#{rotate}, #{props["width"] / 2}, #{props["height"] / 2})") | |||
h.path(d: arc_path(props), transform: "rotate(#{rotate}, #{props["width"] / 2}, #{props["height"] / 2})","transform-box": "fill-box","transform-origin": "50% 50%") |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is changing the transform-origin going to change all existing rotations on arc, etc?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
That might be fine, but is this the right one?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
no transform-origin is for something else, i fogot , for cap its only for line i think
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
transform origin is for some property where svg should be spinned based on center or corner i forgot what it is for in shoes i will look and get back in a sec
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yeah here for this one we need transform-origin but rotating based on center or corner is weird in svgs so i still had to look into them
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
in some article i read we now dont need to think about matrixes and stuff but i still dont really understand if it even changes to center or curve coz arc is just practically disappearing slowly. (i am probably doing something wrong.)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
wait sorry i just realised what you asked is completely different , sorry
yeah i need to get it from drawing context and update to either center or corner
HTML.render do |h| | ||
h.div(id: html_id, style: line_div_style(props)) do | ||
h.svg(width: props["x2"], height: props["y2"]) do | ||
h.line(x1: props["left"], y1: props["top"], x2: props["x2"], y2: props["y2"], style: line_svg_style(props)) | ||
h.line(x1: props["left"], y1: props["top"], x2: props["x2"], y2: props["y2"], style: line_svg_style(props), "stroke-linecap":cap,"transform-origin": "center right") |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You can add these using symbols with the colon-string syntax:
:"stroke-linecap": cap, :"transform-origin": "center right"
That will then not set stroke-linecap any time cap is nil, for instance, as well as matching the rest of the properties everywhere else.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
oo okay
Description
Cap, strokewidth and transform-origin
Image(if needed, helps for a faster review)
Checklist