Revise appearance for feature-state shortcode

Co-authored-by: Dipesh Rawat <rawat.dipesh@gmail.com>
pull/45981/head
Tim Bannister 2024-04-23 00:42:14 +01:00
parent 53ecc9454c
commit f8bd5568c7
3 changed files with 39 additions and 48 deletions

View File

@ -514,6 +514,36 @@ body {
h1:first-of-type + .alert.callout {
margin-top: 1.5em;
}
div.feature-state-notice {
background-color: #daeaf9;
border-radius: 0.75rem;
padding: 1rem;
margin-bottom: 1em;
font-size: 1.2em;
> .feature-state-name::before {
content: '';
color: #326ce5; // Kubernetes blue
}
> .feature-state-name {
display: inline-block;
font-size: 0.95em;
font-weight: bold;
color: #000;
background-color: #daeaf9;
}
code {
color: #000;
font-size: 1em;
background-color: #daeaf9;
}
margin-right: 2em;
max-width: 80%;
}
}
// Special color for third party content disclaimers

View File

@ -9,8 +9,8 @@
{{ if not $is_valid }}
{{ errorf "%q is not a valid feature-state, use one of %q" $state $valid_states }}
{{ else }}
<div class="my-2 feature-state-notice feature-{{ $state }}">
<b>{{ T "feature_state" }}</b> <code>{{T "feature_state_kubernetes_label" }} {{ $for_k8s_version }} [{{ $state }}]</code>
<div class="feature-state-notice feature-{{ $state }}">
<span class="feature-state-name">{{ T "feature_state" }}</span> <code>{{T "feature_state_kubernetes_label" }} {{ $for_k8s_version }} [{{ $state }}]</code>
</div>
{{ end }}
@ -31,19 +31,19 @@
<!-- Iterate through feature gate files -->
{{- range $featureGateFile := $sortedFeatureGates -}}
{{- $featureGateNameFromFile := $featureGateFile.Params.Title -}}
{{- if eq $featureGateNameFromFile $feature_gate_name -}}
<!-- Extract information from the final stage of the feature gate -->
{{- $currentStage := index $featureGateFile.Params.stages (sub (len $featureGateFile.Params.stages) 1) -}}
{{- with $currentStage -}}
{{- with $currentStage -}}
<!-- Display feature state information -->
<div class="my-2 feature-state-notice feature-{{ .stage }}" title="{{ printf "%s %s" (T "feature_state_feature_gate_tooltip") $feature_gate_name }}">
<b>{{ T "feature_state" }}</b> <code>{{T "feature_state_kubernetes_label" }} v{{ .fromVersion }} [{{ .stage }}]</code>
</div>
<div class="feature-state-notice feature-{{ .stage }}" title="{{ printf "%s %s" (T "feature_state_feature_gate_tooltip") $feature_gate_name }}">
<span class="feature-state-name">{{ T "feature_state" }}</span> <code>{{T "feature_state_kubernetes_label" }} v{{ .fromVersion }} [{{ .stage }}]</code>
</div>
{{- $featureGateFound = true -}}
{{- end -}}
{{- $featureGateFound = true -}}
{{- end -}}
{{- end -}}
{{- end -}}

View File

@ -1,39 +0,0 @@
/* Feature States */
.beta, .stable, .alpha, .deprecated {
margin-top: 20px;
padding: 15px;
background-color: #fafafa;
border: 1px solid transparent;
border-radius:4px;
}
.beta {
color: #31708f;
border-color: #bce8f1;
}
.stable {
color: #3c763d;
border-color: #d6e9c6;
}
.alpha {
color: #8a6d3b;
border-color: #faebcc;
}
.deprecated {
color: #a94442;
border-color: #ebccd1;
}
.deprecation_file_warning {
padding: 20px;
margin: 20px 0;
border: 1px solid #eee;
border-left-color: #d9534f;
border-left-width: 5px;
border-radius: 3px;
}