.highlight-last-period {
background-color: #ffaaaa; /* Light red for first day of last period */
font-weight: bold;
color: black;
}
Skip to content
In Case When Things Get Serious
In Case When Things Get Serious
Great things are on the horizon
Something big is brewing! Our store is in the works and will be launching soon!
document.addEventListener('DOMContentLoaded', function () {
// Check if the calculate-btn button exists
var calculateButton = document.querySelector('.calculate-btn');
if (calculateButton) {
calculateButton.addEventListener('click', function(event) {
event.preventDefault(); // Prevent form submission
// Get the form fields' values
var firstDay = document.querySelector('input[name="first_day"]').value;
var periodLength = document.querySelector('input[name="period_length"]').value;
var cycleLength = document.querySelector('input[name="cycle_length"]').value;
// Validate inputs (ensure values are not empty)
if (firstDay && periodLength && cycleLength) {
console.log("Inputs valid. Proceeding with calculation...");
// Perform your calculation logic here (just an example)
var result = "First Day: " + firstDay + ", Period Length: " + periodLength + ", Cycle Length: " + cycleLength;
// Create a result div to display the result below the form
var resultDiv = document.createElement('div');
resultDiv.innerHTML = "Calculation Result: " + result;
// Find the form container
var formContainer = document.querySelector('.wpforms-form'); // This is the form container
var formElement = formContainer.querySelector('.wpforms-submit'); // Get the submit button
// Append the result div right before the submit button (inside the form)
formContainer.insertBefore(resultDiv, formElement);
} else {
alert("Please fill in all fields before calculating.");
}
});
}
});