<commit_before>/*

Noter

- Sketch ny situation med nye fundingmodeller og indret dig derefter DONE
- Slider i egen block og branch NOPE
- Correct the arrow DONE
- Position buttons mobile (3-column) DONE
- Position left-buttons again - maybe with a button div DONE
- Allignment of radiobuttons DONE
- Clean HTML DONE
- Forsøg m. procent ved micropixelfejl DONE (men stadig små fejl)
- Position rightbuttons både på mobile og desktop DONE
- Test browsers - DONE

	SAFARI 
	- Ingen slider-end i mindre versioner
	- Slider track ustabil og glimser ud
	FIREFOX
	- Slider er ikke understøttet, ikke ramt på thumb DONE
	- Slider og button position er nu skæv

- Insæt korrecte tal DONE
- Slim CSS DONE
- Clean CSS DONE
- Se om du kan få modal til at virke ordentligt igen DONE
- Nice to have: centrer footer på mobile
- When button is done, test if slimmer radiobuttons are cooler NOPE
- Fix button bugs
- Fix radio input option
- Fix radio red fill-out
- Fix browser problems

In the modal window, the two different payment forms - one for mobile, one for desktop.

<pre>
BLOCK f-payment
    MODIFIER f-payment_direct (OBSOLETE?)
    MODIFIER f-payment_pledge (OBSOLETE?)
    ELEMENT f-payment__heading
    ELEMENT f-payment__heading_mobile
    ELEMENT f-payment__text
    ELEMENT f-payment__button
    ELEMENT f-payment__button-group
    ELEMENT f-payment__arrow
    ELEMENT f-payment__radio
    ELEMENT f-payment__radio-input
    ELEMENT f-payment__footer
    ELEMENT f-payment__footer-text
    ELEMENT f-payment__slider
    ELEMENT f-payment__slider-style
    ELEMENT f-payment__slider-ends
</pre>


# Payment form

```
<button class="f-button">Toggle modal window</button>
<div class="f-modal f-modal_visible">
	<div class="f-modal__content">
		<div class="f-content">
			<div class="f-payment">
				<div class="f-row f-row_12">
					<div class="f-row__cell-7 f-row_not-mobile">
						<h2 class="f-payment__heading"> Choose the amount and method of payment</h2>
						<p class="f-payment__text">A pledged donation will only transfer if the campaign reaches the goal within the timeframe. <span>Read more.</span></p>
						<button class="f-payment__button">Pledge</button>
					</div>
					<div class="f-row_not-desktop f-row__cell-mobile_push_2 f-row__cell-mobile-8">
						<h2 class="f-payment__heading f-payment__heading_mobile"> Choose the amount and method of payment</h2>
						<p class="f-payment__text">A pledged donation will only transfer if the campaign reaches the goal within the timeframe. <span>Read more.</span></p>
						<button class="f-payment__button">Pledge</button>
					</div>
					<div class="f-row__cell-1 f-row_not-mobile">
						<div class="f-payment__arrow"></div>
					</div>
					<div class="f-row_not-desktop f-row__cell-mobile_push_3 f-row__cell-mobile-8">
						<div class="f-payment__arrow f-payment__arrow_mobile"></div>
					</div>
					<div class="f-row__cell-4 f-row__cell-mobile_push_2 f-row__cell-mobile-8">
						<div class="f-payment__radio">
							<div class="f-column f-column_2 f-column_mobile_3">
								<input type="radio" id="rb4" name="rb" value="">
								<label for="rb5">$500</label><br>
								<input type="radio" id="rb6" name="rb"value="">
								<label for="rb4">$250</label><br>
								<input type="radio" id="rb5" name="rb"value="">
								<label for="rb5">$100</label><br>
								<input type="radio" id="rb1" name="rb" value="">
								<label for="rb1">$50</label><br>
								<input type="radio" id="rb2" name="rb"value="">
								<label for="rb2">$20</label><br>
								<input type="radio" id="rb3" name="rb" value="">
								<label for="rb3">$0</label><br><commit_msg>button-basic<commit_after>/*

Noter

- Sketch ny situation med nye fundingmodeller og indret dig derefter DONE
- Slider i egen block og branch NOPE
- Correct the arrow DONE
- Position buttons mobile (3-column) DONE
- Position left-buttons again - maybe with a button div DONE
- Allignment of radiobuttons DONE
- Clean HTML DONE
- Forsøg m. procent ved micropixelfejl DONE (men stadig små fejl)
- Position rightbuttons både på mobile og desktop DONE
- Test browsers - DONE

	SAFARI 
	- Ingen slider-end i mindre versioner
	- Slider track ustabil og glimser ud
	FIREFOX
	- Slider er ikke understøttet, ikke ramt på thumb DONE
	- Slider og button position er nu skæv

- Insæt korrecte tal DONE
- Slim CSS DONE
- Clean CSS DONE
- Se om du kan få modal til at virke ordentligt igen DONE
- Nice to have: centrer footer på mobile
- When button is done, test if slimmer radiobuttons are cooler NOPE
- Fix button bugs
- Fix radio input option
- Fix radio red fill-out
- Fix browser problems

In the modal window, the two different payment forms - one for mobile, one for desktop.

<pre>
BLOCK f-payment
    MODIFIER f-payment_direct (OBSOLETE?)
    MODIFIER f-payment_pledge (OBSOLETE?)
    ELEMENT f-payment__heading
    ELEMENT f-payment__heading_mobile
    ELEMENT f-payment__text
    ELEMENT f-payment__button
    ELEMENT f-payment__button-group
    ELEMENT f-payment__arrow
    ELEMENT f-payment__radio
    ELEMENT f-payment__radio-input
    ELEMENT f-payment__footer
    ELEMENT f-payment__footer-text
    ELEMENT f-payment__slider
    ELEMENT f-payment__slider-style
    ELEMENT f-payment__slider-ends
</pre>


# Payment form

```
<button class="f-button">Toggle modal window</button>
<div class="f-modal f-modal_visible">
	<div class="f-modal__content">
		<div class="f-content">
			<div class="f-payment">
				<div class="f-row f-row_12">
					<div class="f-row__cell-7 f-row_not-mobile">
						<h2 class="f-payment__heading"> Choose the amount and method of payment</h2>
						<p class="f-payment__text">A pledged donation will only transfer if the campaign reaches the goal within the timeframe. <span>Read more.</span></p>
						<button class="f-button-basic">Pledge</button>
					</div>
					<div class="f-row_not-desktop f-row__cell-mobile_push_2 f-row__cell-mobile-8">
						<h2 class="f-payment__heading f-payment__heading_mobile"> Choose the amount and method of payment</h2>
						<p class="f-payment__text">A pledged donation will only transfer if the campaign reaches the goal within the timeframe. <span>Read more.</span></p>
						<button class="f-button-basic">Pledge</button>
					</div>
					<div class="f-row__cell-1 f-row_not-mobile">
						<div class="f-payment__arrow"></div>
					</div>
					<div class="f-row_not-desktop f-row__cell-mobile_push_3 f-row__cell-mobile-8">
						<div class="f-payment__arrow f-payment__arrow_mobile"></div>
					</div>
					<div class="f-row__cell-4 f-row__cell-mobile_push_2 f-row__cell-mobile-8">
						<div class="f-payment__radio">
							<div class="f-column f-column_2 f-column_mobile_3">
								<input type="radio" id="rb4" name="rb" value="">
								<label for="rb5">$500</label><br>
								<input type="radio" id="rb6" name="rb"value="">
								<label for="rb4">$250</label><br>
								<input type="radio" id="rb5" name="rb"value="">
								<label for="rb5">$100</label><br>
								<input type="radio" id="rb1" name="rb" value="">
								<label for="rb1">$50</label><br>
								<input type="radio" id="rb2" name="rb"value="">
								<label for="rb2">$20</label><br>
								<input type="radio" id="rb3" name="rb" value="">
								<label for="rb3">$0</label><br>
{'fraction_non_alphanumeric': 0.12195792657775334, 'fraction_numerical': 0.012099546267014987, 'mean_word_length': 3.5519399249061325, 'pattern_counts': {'":': 0, '<': 131, '<?xml version=': 0, '>': 131, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5195090', 'n_tokens_mistral': 2832, 'n_tokens_neox': 2411, 'n_words': 697}