Tommaths (he/him)
Tommaths (he/him) π³οΈβππ³οΈββ§οΈ
Ana Tudor π―We also compute its complementary j = 1 - i.
Idea https://css-tricks.com/logical-operations-with-css-variables/
Basically, we have:
i = max(0, sign(mod(k, 1) - f))
j = 1 - i
i = 0, j = 1 on vertical edge (incl. corner)
i = 1, j = 0 on horizontal edge (after corner)
Now we compute things for going along vertical & horizontal edges separately and use i & j to switch between them. That is, multiply vertical results with j and horizontal ones with i.
#CSS #code #coding #web #dev #webDev #webDevelopment #frontend #Maths #cssMaths
This weekend was spent at the @[email protected] conference in Newcastle. We spoke to #history fans about #maths as a core part of human history, focusing on a major change affecting the entire British population in Elizabethan times.
It was great! We had loads of really positive ...
This weekend was spent at the @histassoc.bsky.social conference in Newcastle. We spoke to #history fans about #maths as a core part of human history, focusing on a major change affecting the entire British population in Elizabethan times.
It was great! We had loads of really positive conversations with teachers & other history enthusiasts who were open to the idea of exploring the role of maths across history in their classrooms even though the history curriculum doesn't mention it much. Many mentioned considering collaborations with their maths departments: collaborations are key to capitalising on opportunities for maths and history to enrich the teaching of each other, which is why the History and Mathematics in Education Network (#HaMiEN) exists: to help bring history fans & maths enthusiasts together! Join the free discussion list at https://historyand.mathsy.space
[Pictured: Elinor, me, and @robeastaway ]
Moving further, we'll be computing the progress of mod(k, 1). Starting from the top left corner, once we go across half a perimeter, the cycle of going along a vertical edge, then along a horizontal one repeats.
There are 2 cases:
mod(k, 1) <=f (going along a vertical edge)
mod(k, 1) > 1 (going along a horizontal one)
These two cases repeat once more after the halfway point (bottom left corner since we're starting from the top right).
π‘πππΊππππΊπ π°ππππ±1/5
#MathsMonday
This week I will debunk several false claims made about brackets in #Mathematics on socials - there are several! Actually it's easy to just check for yourself, at https://dn790009.ca.archive.org/0/items/historyofmathema031756mbp/historyofmathema031756mbp.pdf but I'm gonna save you some scrolling. π Firstly you can see in the screenshot that arithmetic has been around in #Maths since at least Egyptian times, and that we have had the modern + and - in #Math since the 16th Century...
#MathsMonday
This week I will debunk several false claims made about brackets in #Mathematics on socials - there are several! Actually it's easy to just check for yourself, at https://dn790009.ca.archive.org/0/items/historyofmathema031756mbp/historyofmathema031756mbp.pdf but I'm gonna save you some scrolling. π Firstly you can see in the screenshot that arithmetic has been around in #Maths since at least Egyptian times, and that we have had the modern + and - in #Math since the 16th Century...
If progress at the bottom left corner (= at half the perimeter starting from the top right corner) is 1, then progress at the bottom right corner is the height 100cqh over half the perimeter (one height 100cqh plus one width 100cqw):
f = 100cqh/(100cqh + 100cqw)
Dividing lengths is supported by Safari & Chrome + we have a Firefox fallback https://frontendmasters.com/blog/count-auto-fill-columns/#getting-the-number-of-columns
#CSS #cssGradient #code #coding #web #dev #webDev #webDevelopment #frontend #Maths #cssMaths
Anyway, what we want to animate here linearly isn't a conic-gradient() angle, it's the progress around the perimeter.
This is k, going from 0 to 2. When k is 0, we're at the top right corner. When it's 1, we're at the bottom left corner, having gone across half the perimeter.
What about the progress value at the bottom right? We'll be calling that f, but how much is it?
#CSS #cssGradient #code #coding #web #dev #webDev #webDevelopment #frontend #Maths #cssMaths
We can also compute half the perimeter as:
100cqh + 100cqw
---
By the way, this container technique is also what I've used to compute the aspect ratio of images of unknown dimensions (and therefore aspect ratio) in order to determine along which edge they should get a blur extension to square - check out the article! https://frontendmasters.com/blog/non-square-image-blur-extensions/#unknown-aspect-ratio
#CSS #code #coding #web #dev #webDev #webDevelopment #frontend #Maths #cssMaths
