commit 148b464d2788700fa5f2a401d452555da2561fbd Author: Oliver Atkinson Date: Thu Feb 22 13:31:58 2024 -0700 init, working diff --git a/README.md b/README.md new file mode 100644 index 0000000..e69de29 diff --git a/generate.py b/generate.py new file mode 100644 index 0000000..b1d14fa --- /dev/null +++ b/generate.py @@ -0,0 +1,59 @@ +import random +import sys + +if len(sys.argv) != 2: + print("First and only argument is quantity of lines to cycle thru.") + sys.exit(1) +qty = int(sys.argv[1]) +if qty == 3: + print("/* When qty=3 it doesn't output the correct amount of classes due to rounding errors. */") + +percent_step = int(round(100 / qty)) +# idk how to make a blank array +percentages = [0] * 0 +for i in range(0, 100, percent_step): + percentages.append(i) +# container class +print(".roller-container {display: grid; text-align: center;}\n") +# set style for all the classes +for i in range(0, len(percentages)): + # the last one needs it's trailing comma removed TODO + if i == len(percentages) - 1: + print(f".roller{i}") + else: + print(f".roller{i},") +print( + f"""{{ + animation-iteration-count: infinite; + animation-timing-function: cubic-bezier(1, 0, 0, 1); + animation-duration: {qty}s; + animation-direction: normal; + transform-origin: center; + /* works with "display: grid" to have all the words in the same place on the screen. */ + grid-row: 1; + grid-column: 1; +}}""" +) +# assign each class it's animation +for i in range(0, len(percentages)): + print( + f".roller{i} {{ animation-name: roll{i}; color: rgb({random.randrange(50, 255)}, {random.randrange(100, 255)}, {random.randrange(100, 255)})}}" + ) +# set keyframes +for i in range(0, len(percentages)): + print(f"@keyframes roll{i} {{") + for j in percentages: + # Make sure everybody has an 100% rule + if j == percentages[0]: + if i == 0: + print("\t100% { opacity: 1; transform: translateY(0) rotateX(0); }") + else: + print("\t100% { opacity: 0; transform: translateY(2rem) rotateX(15deg); }") + # calculate the keyframes + if i * percent_step == j: + print(f"\t{j}% {{ opacity: 1; transform: translateY(0) rotateX(0); }}\n") + else: + print( + f"\t{j}% {{ opacity: 0; transform: translateY(2rem) rotateX(15deg); }}\n" + ) + print("}") diff --git a/index.html b/index.html new file mode 100644 index 0000000..a38ce87 --- /dev/null +++ b/index.html @@ -0,0 +1,49 @@ + + + + + + + Testing + + + + + +
+
+

We can help with

+
+

Software Development

+

Construction

+

Graphic Design

+

Marketing

+

Human Resources

+
+

here at Example Co.

+
+
+ + + + \ No newline at end of file