component {
resources {
link(rel = import, href = "docker/containers.component.gv", as = DockerContainersTab)
link(rel = import, href = "docker/images.component.gv", as = DockerImagesTab)
link(rel = import, href = "docker/volumes.component.gv", as = DockerVolumesTab)
link(rel = import, href = "docker/networks.component.gv", as = DockerNetworksTab)
link(rel = import, href = "docker/registry.component.gv", as = DockerRegistryTab)
}
row(class = page-head) {
column(class = page-head__titles) {
text("{t('common.runtime')}", class = page-head__title)
text(
"{t('docker.containers_images_volumes_and_networks')}",
class = page-head__subtitle,
)
}
row(class = "page-head__stats page-head__stats--hide-md") {
StatCard(
label = "{t('common.containers')}",
value = @docker_containers_count
)
StatCard(
label = "{t('docker.images')}",
value = @docker_images_count
)
StatCard(
label = "{t('docker.volumes')}",
value = @docker_volumes_count
)
StatCard(
label = "{t('docker.networks')}",
value = @docker_networks_count, accent = 1
)
}
}
scroll(class = tabs__scroll, direction = horizontal) {
row(class = tabs__main) {
TabButton(
label = "{t('docker.containers')}",
current = @docker_tab,
target = containers,
action = docker_tab:containers,
)
TabButton(
label = "{t('docker.images_2')}",
current = @docker_tab,
target = images,
action = docker_tab:images,
)
TabButton(
label = "{t('docker.volumes_2')}",
current = @docker_tab,
target = volumes,
action = docker_tab:volumes,
)
TabButton(
label = "{t('docker.networks_2')}",
current = @docker_tab,
target = networks,
action = docker_tab:networks,
)
TabButton(
label = "{t('docker.registry')}",
current = @docker_tab,
target = registry,
action = docker_tab:registry,
)
}
}
hr
DockerContainersTab(if = @docker_tab, equals = containers)
DockerImagesTab(if = @docker_tab, equals = images)
DockerVolumesTab(if = @docker_tab, equals = volumes)
DockerNetworksTab(if = @docker_tab, equals = networks)
DockerRegistryTab(if = @docker_tab, equals = registry)
}