govuk components

Ruby on Rails的Gov.uk組件

該寶石為gov.uk設計系統提供了一套可重複使用的組件。它旨在為gov.uk發布組件庫提供輕巧的替代品，並使用GitHub的ViewComponent Framework構建。

它旨在以一種對Rails Developers更加熟悉的方式來實現原始Nunjucks宏的功能。優先於HTML的字符串，每個組件僅是一個紅寶石對象，一切都是可繼承且無法潤濕的。

文件

該寶石帶有完整的指南，涵蓋了日常使用的大多數方面，以及代碼和輸出示例。指南中的示例（以及指南本身）是使用組件構建的，因此它將始終是最新的。

包括什麼？

該庫中的所有非格式組件都作為視圖組件實現。表單組件由gov.uk表單構建器實現。

提供的組件是：

• 手風琴
• 返回鏈接
• 麵包屑
• 餅乾橫幅
• 細節
• 退出此頁面
• 頁尾
• 標題
• 插圖文字
• 通知橫幅
• 控制板
• 分頁
• 相橫幅
• 部分中斷
• 開始按鈕
• 摘要列表
• 選項卡
• 表
• 標籤
• 任務列表
• 警告文字

該庫還提供了用於創建鏈接，按鈕，跳過鏈接以及回到頂部鏈接的幫助者。

替代語法

所有組件都可以通過兩種方式渲染：

• 直接使用Rails的#render方法：

    <%= render GovukComponent::WarningTextComponent.new do %>
      A serious warning
    <% end %>

• 通過助手包裝器：

    <%= govuk_warning_text do %>
      A serious warning
    <% end %> 

  助手的命名約定為govuk_ ，然後在Snake Case中的組件名稱。您可以在GovukComponentsHelper中查看完整列表。

示例使用

該庫允許使用Rails的render方法或通過提供的助手渲染組件。在這裡，我們將使用govuk_tabs渲染三個選項卡的部分：

 <%= govuk_tabs(title: 'Days of the week') do |component| %>
  <% component.with_tab(label: 'Monday') do %>
    < p > Monday’s child is fair of face </ p >
  <% end %>

  <% component . with_tab ( label : 'Tuesday' ) do %>
    < p > Tuesday’s child is full of grace </ p >
  <% end %>

  <% component . with_tab ( label : 'Wednesday' ) do %>
    < p > Wednesday’s child is full of woe </ p >
  <% end %>
<% end %>

這是渲染選項卡：

有關用法的示例，請參見“指南”頁面。

設定

將此行添加到您的config/application.rb ：

 require "govuk/components" 

使用此庫的服務

• 申請教師培訓
• 查找研究生培訓
• 獲得技術幫助
• 發布教師培訓課程
• 註冊訓練者的老師
• 教職位

叉子

• betagouvsystèmede Design del'état視圖組件

安裝

將此行添加到您的應用程序的gemfile：

 gem 'govuk-components'

然後執行：

bundle

或自行安裝：

gem install govuk-components

貢獻

最歡迎錯誤報告和功能請求，請提出問題或提交拉動請求。

目前，我們正在使用Govuk皮棉來確保代碼符合gov.uk指南。請確保任何PRS也遵守此標準。

為了幫助保持日誌清潔和整潔，請配置Git以使用您的全名：

git config --global user.name " Julius Hibbert " 

執照

根據MIT許可證的條款，該寶石可作為開源。