FsTachyons 1.0.0
dotnet add package FsTachyons --version 1.0.0
NuGet\Install-Package FsTachyons -Version 1.0.0
此命令旨在在 Visual Studio 的包管理器控制台中使用,因为它使用 NuGet 模块的 Install-Package 版本。
<PackageReference Include="FsTachyons" Version="1.0.0" />
对于支持 PackageReference 的项目,将此 XML 节点复制到项目文件中以引用包。
paket add FsTachyons --version 1.0.0
NuGet 团队不为此客户端提供支持。请联系其 维护者 以获得支持。
#r "nuget: FsTachyons, 1.0.0"
#r 指令可用于 F# Interactive 和 Polyglot Notebooks。将其复制到交互式工具或脚本的源代码中,以便引用包。
// Install FsTachyons as a Cake Addin #addin nuget:?package=FsTachyons&version=1.0.0 // Install FsTachyons as a Cake Tool #tool nuget:?package=FsTachyons&version=1.0.0
NuGet 团队不为此客户端提供支持。请联系其 维护者 以获得支持。
FsTachyons
open FsTachyons
open FsTachyons
open FsTachyons.Tac
Elem.h1 [ Attr.class' (tac [ f3; f1_m; f_headline_l ])]
[ Text.raw "Hello World!" ]
// Produces: <h1 class="f3 f1-m f-headline-l">Title</h1>
注意: FsTachyons 仅包含在 演示用途。
FsTachyons 是一个 F# API,用于功能性的 CSS 库 Tachyons,人类的功能性 CSS。
主要功能
- 通过
tac []
自动帮助构建复杂的类字符串。 - 便于发现 Tachyons 类。
- 使用本机 F# 生成类字符串。
- 通过创建自定义类轻松扩展。
设计目标
- 为所有 所有 Tachyons 类提供可发现的功能。
- 可集成到 任何 F# 标记 DSL。
- 对了解 Tachyons 的人来说易学。
概述
FsTachyons 将所有 Tachyons CSS 类映射到 Tac
模块中的函数。这些类型可以组合在一起使用 tac []
辅助函数形成类字符串,或使用 +
操作符进行组合。
要转义 CSS 规范中有效但 F# 中无效的字符,对 Tachyons 类进行了以下放大:
- 移除了前导
.
(例如,.red
成为red
)。 - 将
-
替换为_
(例如,.b--red
成为b__red
)。
与 FsTachyons 一起使用
FsTachyons 有用于元素 & 属性的模块,这使我们能够导入 FsTachyons.Tac
,使类字符串定义更加简短。
open FsTachyons
open FsTachyons
open FsTachyons.Tac
// <p class="measure lh-copy">Lorem ipsum</p>
Elem.p [ Attr.class' (tac [ measure; lh_copy ])]
[ Text.raw "Lorem ipsum" ]
// <h1 class="f3 f1-m f-headline-l">Title</h1>
Elem.h1 [ Attr.class' (tac [ f3; f1_m; f_headline_l ])]
[ Text.raw "Hello World!" ]
// <a class="f6 link dim br1 ph3 pv2 mb2 dib white bg-black" href="#0">Button Text</a>
Elem.a [ Attr.class' (tac [ f6; link; dim; br1; ph3; pv2; dib; white; bg_black ]) ]
[ Text.raw "Button Text" ]
与Feliz的用法
open Feliz
open FsTachyons
open FsTachyons.Tac
// <p class="measure lh-copy">Lorem ipsum</p>
Elem.p [ prop.className [ tac [ measure; lh_copy ] ]
prop.text "Lorem ipsum" ]
// <h1 class="f3 f1-m f-headline-l">Title</h1>
Elem.h1 [ prop.className [ tac [ f3; f1_m; f_headline_l ] ]
prop.text "Hello World!" ]
// <a class="f6 link dim br1 ph3 pv2 mb2 dib white bg-black" href="#0">Button Text</a>
Elem.a [ prop.className [ tac [ f6; link; dim; br1; ph3; pv2; dib; white; bg_black ] ]
prop.text "Button Text" ]
与Giraffe.ViewEngine的用法
使用Giraffe的HTML生成方法时,必须通过Tac
模块引用类函数。
open FsTachyons
open Giraffe.ViewEngine
// <p class="measure lh-copy">Lorem ipsum</p>
p [ _class (tac [Tac.measure; Tac.lh_copy ])]
[ rawText "Lorem ipsum" ]
// <h1 class="f3 f1-m f-headline-l">Title</h1>
h1 [ _class (tac [ Tac.f3; Tac.f1_m; Tac.f_headline_l ])]
[ rawText "Hello World!" ]
// <a class="f6 link dim br1 ph3 pv2 mb2 dib white bg-black" href="#0">Button Text</a>
a [ _class (tac [ Tac.f6; Tac.link; Tac.dim; Tac.br1; Tac.ph3; Tac.pv2; Tac.dib; Tac.white; Tac.bg_black ]) ]
[ rawText "Button Text" ]
发现bug了吗?
这里有一个问题。
许可证
由多伦多地区的NHLPA Engineering构建,许可证为MIT。
产品 | 版本 兼容和额外的计算目标框架版本。 |
---|---|
.NET | net5.0被计算。 net5.0-windows被计算。 net6.0被计算。 net6.0-android被计算。 net6.0-ios被计算。 net6.0-maccatalyst被计算。 net6.0-macos被计算。 net6.0-tvos被计算。 net6.0-windows被计算。 net7.0被计算。 net7.0-android被计算。 net7.0-ios被计算。 net7.0-maccatalyst被计算。 net7.0-macos被计算。 net7.0-tvos被计算。 net7.0-windows被计算。 net8.0被计算。 net8.0-android被计算。 net8.0-browser被计算。 net8.0-ios被计算。 net8.0-maccatalyst被计算。 net8.0-macos被计算。 net8.0-tvos被计算。 net8.0-windows被计算。 |
.NET Core | netcoreapp2.0 已计算。 netcoreapp2.1 已计算。 netcoreapp2.2 已计算。 netcoreapp3.0 已计算。 netcoreapp3.1 已计算。 |
.NET 标准版 | netstandard2.0 兼容。 netstandard2.1 已计算。 |
.NET 框架 | net461 已计算。 net462 已计算。 net463 已计算。 net47 已计算。 net471 已计算。 net472 已计算。 net48 已计算。 net481 已计算。 |
MonoAndroid | monoandroid 已计算。 |
MonoMac | monomac 已计算。 |
MonoTouch | monotouch 已计算。 |
Tizen | tizen40 已计算。 tizen60 已计算。 |
Xamarin.iOS | xamarinios 已计算。 |
Xamarin.Mac | xamarinmac 已计算。 |
Xamarin.TVOS | xamarintvos 已计算。 |
Xamarin.WatchOS | xamarinwatchos 已计算。 |
-
.NETStandard 2.0
- FSharp.Core (>= 4.5.2)
NuGet 包
此包没有被任何 NuGet 包使用。
GitHub 仓库
此包没有被任何流行的 GitHub 仓库使用。
版本 | 下载 | 最后更新 |
---|---|---|
1.0.0 | 214 | 9/16/2022 |