spring-batch-rs 0.3.4

A toolkit for building enterprise-grade batch applications
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107

---
import {Icon} from '@astrojs/starlight/components';
---

<starlight-menu-button class="print:hidden">
	<button
		aria-expanded="false"
		aria-label={Astro.locals.t('menuButton.accessibleLabel')}
		aria-controls="starlight__sidebar"
		class="sl-flex md:sl-hidden"
	>
		<Icon name="bars" class="open-menu" />
		<Icon name="close" class="close-menu" />
	</button>
</starlight-menu-button>

<script>
	class StarlightMenuButton extends HTMLElement {
		btn = this.querySelector('button')!;

		constructor() {
			super();
			// Toggle `aria-expanded` state when a user clicks the button.
			this.btn.addEventListener('click', () => this.toggleExpanded());

			// Close the menu when a user presses the escape key.
			const parentNav = this.closest('nav');
			if (parentNav) {
				parentNav.addEventListener('keyup', (e) => this.closeOnEscape(e));
			}
		}

		setExpanded(expanded: boolean) {
			this.setAttribute('aria-expanded', String(expanded));
			document.body.toggleAttribute('data-mobile-menu-expanded', expanded);
		}

		toggleExpanded() {
			this.setExpanded(this.getAttribute('aria-expanded') !== 'true');
		}

		closeOnEscape(e: KeyboardEvent) {
			if (e.code === 'Escape') {
				this.setExpanded(false);
				this.btn.focus();
			}
		}
	}

	customElements.define('starlight-menu-button', StarlightMenuButton);
</script>

<style>
	@layer starlight.core {
		button {
			position: fixed;
			top: calc((var(--sl-nav-height) - var(--sl-menu-button-size)) / 2);
			inset-inline-end: var(--sl-nav-pad-x);
			z-index: var(--sl-z-index-navbar);
			border: 0;
			border-radius: 50%;
			width: var(--sl-menu-button-size);
			height: var(--sl-menu-button-size);
			padding: 0.5rem;
			background-color: var(--sl-color-white);
			color: var(--sl-color-black);
			box-shadow: var(--sl-shadow-md);
			cursor: pointer;
		}

		[aria-expanded='true'] button {
			background-color: var(--sl-color-gray-2);
			box-shadow: none;
		}

		[aria-expanded='true'] button .open-menu {
			display: none;
		}

		:not([aria-expanded='true']) button .close-menu {
			display: none;
		}

		:global([data-theme='light']) button {
			background-color: var(--sl-color-black);
			color: var(--sl-color-white);
		}

		:global([data-theme='light']) [aria-expanded='true'] button {
			background-color: var(--sl-color-gray-5);
		}
	}
</style>

<style is:global>
	@layer starlight.core {
		[data-mobile-menu-expanded] {
			overflow: hidden;
		}

		@media (min-width: 50rem) {
			[data-mobile-menu-expanded] {
				overflow: auto;
			}
		}
	}
</style>