From bb877cf275d7e90be1fb3634accb5a3327b21de3 Mon Sep 17 00:00:00 2001 From: Diana Ajambo Date: Fri, 25 Oct 2024 21:46:38 +0300 Subject: [PATCH] Resizing the cards and aligning content --- assets/scss/_registry.scss | 20 + .../partials/ecosystem/registry/entry.html | 484 ++++++++++-------- .../ecosystem/registry/search-form.html | 78 +-- 3 files changed, 346 insertions(+), 236 deletions(-) diff --git a/assets/scss/_registry.scss b/assets/scss/_registry.scss index 06ed0693de9f..52f440a6c3f4 100644 --- a/assets/scss/_registry.scss +++ b/assets/scss/_registry.scss @@ -38,4 +38,24 @@ .registry-entry { @extend .shadow; + max-width: 340px; + min-width: 200px; +} + +.registry-entry:hover { + transform: scale(1.05); + transition: all 0.3s ease; +} + +.narrative { + font-size: 0.9rem; +} + +.quick-setup { + margin-left: 1%; +} + +.item-specs { + padding-left: 0px; + padding-right: 0px; } diff --git a/layouts/partials/ecosystem/registry/entry.html b/layouts/partials/ecosystem/registry/entry.html index 9a282c4db0b9..e869b683a676 100644 --- a/layouts/partials/ecosystem/registry/entry.html +++ b/layouts/partials/ecosystem/registry/entry.html @@ -1,222 +1,298 @@ {{ $languageNames := .languageNames -}} {{ with .value -}} - {{ - $remoteRegistries := dict - "npm" (dict - "urlPattern" "https://npmjs.com/package/%s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "installLine" "npm install %s" - "icon" "fab fa-npm") - "packagist" (dict - "urlPattern" "https://packagist.org/packages/%s" - "installLine" "composer require %s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "icon" "fa-solid fa-box-open") - "gems" (dict - "urlPattern" "https://rubygems.org/gems/%s" - "installLine" "gem install %s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "icon" "fa-solid fa-gem") - "go" (dict - "urlPattern" "https://pkg.go.dev/%s" - "installLine" "go get %s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "icon" "fa-brands fa-golang") - "go-collector" (dict - "urlPattern" "https://pkg.go.dev/%s" - "installTemplate" "ecosystem/registry/quickinstall/collector.md" - "icon" "fa-solid fa-box-open") - "nuget" (dict - "urlPattern" "https://www.nuget.org/packages/%s" - "installLine" "dotnet add package %s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "icon" "fa-solid fa-box-open") - "pip" (dict - "urlPattern" "https://pypi.org/project/%s" - "installLine" "pip install %s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "icon" "fa-brands fa-python") - "hex" (dict - "urlPattern" "https://hex.pm/packages/%s" - "installTemplate" "ecosystem/registry/quickinstall/hex.md" - "icon" "fa-brands fa-erlang") - "crates" (dict - "urlPattern" "https://crates.io/crates/%s" - "installLine" "cargo add %s" - "installTemplate" "ecosystem/registry/quickinstall/default.md" - "icon" "fab fa-rust") - -}} +{{ +$remoteRegistries := dict +"npm" (dict +"urlPattern" "https://npmjs.com/package/%s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"installLine" "npm install %s" +"icon" "fab fa-npm") +"packagist" (dict +"urlPattern" "https://packagist.org/packages/%s" +"installLine" "composer require %s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"icon" "fa-solid fa-box-open") +"gems" (dict +"urlPattern" "https://rubygems.org/gems/%s" +"installLine" "gem install %s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"icon" "fa-solid fa-gem") +"go" (dict +"urlPattern" "https://pkg.go.dev/%s" +"installLine" "go get %s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"icon" "fa-brands fa-golang") +"go-collector" (dict +"urlPattern" "https://pkg.go.dev/%s" +"installTemplate" "ecosystem/registry/quickinstall/collector.md" +"icon" "fa-solid fa-box-open") +"nuget" (dict +"urlPattern" "https://www.nuget.org/packages/%s" +"installLine" "dotnet add package %s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"icon" "fa-solid fa-box-open") +"pip" (dict +"urlPattern" "https://pypi.org/project/%s" +"installLine" "pip install %s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"icon" "fa-brands fa-python") +"hex" (dict +"urlPattern" "https://hex.pm/packages/%s" +"installTemplate" "ecosystem/registry/quickinstall/hex.md" +"icon" "fa-brands fa-erlang") +"crates" (dict +"urlPattern" "https://crates.io/crates/%s" +"installLine" "cargo add %s" +"installTemplate" "ecosystem/registry/quickinstall/default.md" +"icon" "fab fa-rust") +-}} - {{ $isNative := and (or (eq .registryType "instrumentation") (eq .registryType "application integration")) (.isNative) }} - {{ $isFirstParty := and (or (eq .registryType "instrumentation") (eq .registryType "application integration")) (.isFirstParty) }} - {{ $currentTime := (time now) -}} - {{ $delta := $currentTime.Sub (time.AsTime .createdAt) -}} - {{ $isNew := lt $delta.Hours 730 -}} - {{ $usedInDemo := and (isset . "urls") (isset .urls "demo") }} - {{ $deprecated := and (isset . "deprecated") (isset .deprecated "reason") }} - {{ $package := "" -}} - {{ if and (.package) (isset $remoteRegistries .package.registry) -}} - {{ $package = merge .package (index $remoteRegistries .package.registry) -}} - {{ $package = merge $package (dict "type" .registryType) -}} - {{ end -}} - {{ $highlightStyle := "" -}} - {{ if $isNew -}} - {{ $highlightStyle = "border-info" -}} - {{ end -}} - {{ if $isNative -}} - {{ $highlightStyle = "border-success" -}} - {{ end -}} - {{ if $isFirstParty -}} - {{ $highlightStyle = "border-success" -}} - {{ end -}} - {{ if $usedInDemo -}} - {{ $highlightStyle = "border-secondary" -}} - {{ end -}} - {{ if $deprecated -}} - {{ $highlightStyle = "border-danger" -}} - {{ end -}} - {{ $primaryUrl := "" -}} - {{ if .urls.repo -}} - {{ $primaryUrl = .urls.repo -}} - {{ else if .urls.website -}} - {{ $primaryUrl = .urls.website -}} - {{ else if .urls.docs -}} - {{ errorf "The %q registry entry requires a repo or website URL." .title }} - {{ end -}} - {{ $primaryHref := printf "href=%q" $primaryUrl | safeHTMLAttr -}} -
  • -
    -

    - - {{- .title | markdownify -}} +{{ $isNative := and (or (eq .registryType "instrumentation") (eq .registryType "application integration")) (.isNative) +}} +{{ $isFirstParty := and (or (eq .registryType "instrumentation") (eq .registryType "application integration")) +(.isFirstParty) }} +{{ $currentTime := (time now) -}} +{{ $delta := $currentTime.Sub (time.AsTime .createdAt) -}} +{{ $isNew := lt $delta.Hours 730 -}} +{{ $usedInDemo := and (isset . "urls") (isset .urls "demo") }} +{{ $deprecated := and (isset . "deprecated") (isset .deprecated "reason") }} +{{ $package := "" -}} +{{ if and (.package) (isset $remoteRegistries .package.registry) -}} +{{ $package = merge .package (index $remoteRegistries .package.registry) -}} +{{ $package = merge $package (dict "type" .registryType) -}} +{{ end -}} +{{ $highlightStyle := "" -}} +{{ if $isNew -}} +{{ $highlightStyle = "border-info" -}} +{{ end -}} +{{ if $isNative -}} +{{ $highlightStyle = "border-success" -}} +{{ end -}} +{{ if $isFirstParty -}} +{{ $highlightStyle = "border-success" -}} +{{ end -}} +{{ if $usedInDemo -}} +{{ $highlightStyle = "border-secondary" -}} +{{ end -}} +{{ if $deprecated -}} +{{ $highlightStyle = "border-danger" -}} +{{ end -}} +{{ $primaryUrl := "" -}} +{{ if .urls.repo -}} +{{ $primaryUrl = .urls.repo -}} +{{ else if .urls.website -}} +{{ $primaryUrl = .urls.website -}} +{{ else if .urls.docs -}} +{{ errorf "The %q registry entry requires a repo or website URL." .title }} +{{ end -}} +{{ $primaryHref := printf "href=%q" $primaryUrl | safeHTMLAttr -}} + + + +
    +
    +
    + + {{- .title | markdownify -}} -
    - {{ if $isNew -}} - new - {{ end -}} - {{ if $isNative -}} - native - {{ end -}} - {{ if $isFirstParty -}} - first party integration - {{ end -}} - {{ if $usedInDemo -}} - OTel Demo - {{ end -}} - {{ if $deprecated -}} - deprecated - {{ end -}} - {{ if .cncfProjectLevel -}} - - CNCF {{ .cncfProjectLevel }} - - {{ end -}} -
    -

    -

    - - by - {{ range $index, $author := .authors -}} - {{ if $index }}, {{ end }} - {{ if eq $author.name "OpenTelemetry Authors" -}} - 🔭 {{ $author.name }} 🔭 - {{ else if isset $author "url" }} +

    + + by + {{ range $index, $author := .authors -}} + {{ if $index }}, {{ end }} + {{ if eq $author.name "OpenTelemetry Authors" -}} + 🔭 {{ $author.name }} + 🔭 + {{ else if isset $author "url" }} {{ $href := printf "href=%q" $author.url | safeHTMLAttr -}} - {{ $author.name }} - {{ else -}} + {{ $author.name }} + {{ else -}} {{ $author.name -}} - {{ end -}} - {{ end -}} - -

    -
    -
    -
    - {{ if $deprecated -}} - {{ end -}} - {{- .description | markdownify -}} -
    - {{ with $package -}} - {{ if not (eq .quickInstall false) }} -
    Quick Install
    -

    {{ (partial .installTemplate .) | markdownify -}} -

    {{ end -}} - {{- end -}} -
    -
    -
      - {{ if .package.version -}} -
    • -
      -
      - {{ .package.version }} + +

      +
      +
      +
      +
      + {{ if $isNew }} + + + + {{ end }}
      - Version -
      -
      • - {{- end -}} - {{ with .language -}} -
    • -
      -
      - {{ $languageNames.Get . | default (humanize .) }} +
      + {{ if $isNative }} + + + + {{ end }}
      - Language -
      -
      • - {{- end }} - {{ with .registryType -}} -
    • -
      -
      - {{ . | humanize }} +
      + {{ if $isFirstParty }} + + + + {{ end }}
      - Component -
      -
      • - {{- end -}} - {{ with .license -}} -
    • -
      -
      - {{ . }} +
      + {{ if $usedInDemo }} + + + + {{ end }} +
      +
      + {{ if $deprecated }} + + + + {{ end }} +
      +
      + {{ if .cncfProjectLevel }} + + CNCF + + {{ end }}
      - License -
      -
      • - {{- end -}}
    -
    +
    +
    +
    +
    + {{ with .urls.website -}} + {{ $websiteHref := printf "href=%q" . | safeHTMLAttr -}} + + + + {{- end -}} +
    +
    + {{ with .urls.docs -}} + {{ $docsHref := printf "href=%q" . | safeHTMLAttr -}} + + + + {{- end -}} +
    +
    + {{ with $package -}} + {{ $packageUrl := printf "href=%q" (printf .urlPattern .name) | safeHTMLAttr -}} + + + + {{- end -}} +
    +
    + {{ with .urls.repo -}} + {{ $icon := cond ( hasPrefix . "https://github.com/" ) "fa-brands fa-github" "fab fa-git-alt" -}} + {{ $repoHref := printf "href=%q" . | safeHTMLAttr -}} + + + + + {{- end -}} +
    +
    + {{ with .urls.demo -}} + {{ $demoUrl := printf "href=%q" (printf .) | safeHTMLAttr -}} + + + + + {{- end -}} +
    + +
    +
    +
    + {{ if $deprecated -}} + + {{ end -}} +

    + {{- .description | markdownify -}} +

    +
    - {{ with .urls.website -}} - {{ $websiteHref := printf "href=%q" . | safeHTMLAttr -}} -  Website - {{- end -}} - {{ with .urls.docs -}} - {{ $docsHref := printf "href=%q" . | safeHTMLAttr -}} -  Documentation - {{- end -}} - {{ with $package -}} - {{ $packageUrl := printf "href=%q" (printf .urlPattern .name) | safeHTMLAttr -}} -  Package Details ({{ .registry }}) - {{- end -}} - {{ with .urls.repo -}} - {{ $icon := cond ( hasPrefix . "https://github.com/" ) "fa-brands fa-github" "fab fa-git-alt" -}} - {{ $repoHref := printf "href=%q" . | safeHTMLAttr -}} -  Repository - {{- end -}} - {{ with .urls.demo -}} - {{ $demoUrl := printf "href=%q" (printf .) | safeHTMLAttr -}} -  Demo Service - {{- end -}} +
    +
      + {{ if .package.version -}} +
    • +
      +
      + {{ .package.version }} +
      + Version +
      +
      • + {{- end -}} + {{ with .language -}} +
    • +
      +
      + {{ $languageNames.Get . | default (humanize .) }} +
      + Language +
      +
      • + {{- end }} + {{ with .registryType -}} +
    • +
      +
      + {{ . | humanize }} +
      + Component +
      +
      • + {{- end -}} + {{ with .license -}} +
    • +
      +
      + {{ . }} +
      + License +
      +
      • + {{- end -}} +
    -
    • - {{ end -}} + + +
    +
    {{ with $package -}} + {{ if not (eq .quickInstall false) }} +
    Quick Install
    +

    {{ (partial .installTemplate .) | markdownify -}}

    + {{ end -}} + {{- end -}} +
    + +
    + + +{{ end -}} \ No newline at end of file diff --git a/layouts/shortcodes/ecosystem/registry/search-form.html b/layouts/shortcodes/ecosystem/registry/search-form.html index 4e2fc00028c1..f9ec54ef7d46 100644 --- a/layouts/shortcodes/ecosystem/registry/search-form.html +++ b/layouts/shortcodes/ecosystem/registry/search-form.html @@ -6,47 +6,52 @@ {{ $languageNames.Set "js" "JavaScript" -}} {{ $languageNames.Set "php" "PHP" -}} -{{ $officialLanguages := slice "collector" "cpp" "erlang" "elixir" "dotnet" "go" "java" "js" "php" "python" "ruby" "rust" "swift" -}} +{{ $officialLanguages := slice "collector" "cpp" "erlang" "elixir" "dotnet" "go" "java" "js" "php" "python" "ruby" +"rust" "swift" -}} {{ $langs := slice -}} {{ range $registry -}} - {{ $language := .language -}} - {{- $val := (dict - "name" .language - "isOfficial" (in $officialLanguages .language) - ) - -}} - {{ $langs = $langs | append $val -}} - {{ if ne $language (lower $language) -}} - {{ errorf "Language keys must be in lowercase. Registry entry '%s' has the following invalid key: %s" .title $language -}} - {{ end -}} +{{ $language := .language -}} +{{- $val := (dict +"name" .language +"isOfficial" (in $officialLanguages .language) +) +-}} +{{ $langs = $langs | append $val -}} +{{ if ne $language (lower $language) -}} +{{ errorf "Language keys must be in lowercase. Registry entry '%s' has the following invalid key: %s" .title $language +-}} +{{ end -}} {{ end -}} {{ $langs = sort ($langs | uniq) "name" -}} {{ $types := slice -}} {{ range $registry -}} - {{ $type := .registryType -}} - {{ $types = $types | append $type -}} - {{ if ne $type (lower $type) -}} - {{ errorf "Component-type keys must be in lowercase. Registry entry '%s' has the following invalid key: %s" .title $type -}} - {{ end -}} +{{ $type := .registryType -}} +{{ $types = $types | append $type -}} +{{ if ne $type (lower $type) -}} +{{ errorf "Component-type keys must be in lowercase. Registry entry '%s' has the following invalid key: %s" .title $type +-}} +{{ end -}} {{ end -}} {{ $types = $types | uniq | sort -}}
    -The OpenTelemetry Registry allows you to search for instrumentation libraries, -collector components, utilities, and other useful projects in the OpenTelemetry -ecosystem. If you are a project maintainer, you can add your project to the OpenTelemetry Registry + The OpenTelemetry Registry allows you to search for instrumentation libraries, + collector components, utilities, and other useful projects in the OpenTelemetry + ecosystem. If you are a project maintainer, you can add your project to the + OpenTelemetry Registry
    - Search {{ len $registry }} entries - - + Search {{ len $registry }} + entries + + @@ -61,7 +66,9 @@ data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Language -
      -
        - {{ range $key, $value := $registry -}} +
        +
        +
        +
        +
        + {{ range $key, $value := $registry -}} {{ $value = merge $value (dict "_key" $key) -}} {{ partial "ecosystem/registry/entry" (dict "value" $value "languageNames" $languageNames) }} - {{ end -}} -
      + {{ end -}} +
      +
      - -{{ partial "script.html" (dict "src" "js/registrySearch.js") -}} + +{{ partial "script.html" (dict "src" "js/registrySearch.js") -}} \ No newline at end of file