Skip to content

Releases: teacat/tocas

Tocas 4.0.3

20 Apr 03:04
08ea126
Compare
Choose a tag to compare

移除

  1. 移除 Content 的 Primary 用法,改為支援巢狀式的暗色語意 is-dark (#799, 1b8916a)。

修改

  1. 由於顏色太難與標準文字區隔,Header 的 Secondary 樣式顏色從 600 降為 500 (6ddcf49)。
  2. 由於顏色太難與標準文字區隔,Meta 的 Secondary 樣式顏色從 600 降為 500 (ffbb442)。
  3. 更改 App Layout 的 Fluid 用法,現在欄位會像 Row 那樣以最小寬度為主,需要手動指定 Fluid (640d23a)。

新增

  1. App Layout 新增 Tertiary 語意 (a644dd3)。
  2. Input 支援 Circular 圓角樣式 (21aa53a)。

文件

  1. 文件的範例頁面現在使用更小檔案的圖片且支援更多層級的響應式欄位 (#797, a6f1eeb)。
  2. 文件的 cdnjs 連結現在都從 libs/tocas-ui 改為更短的 libs/tocas (a3643ba)。

Tocas 4.0.2

15 Apr 18:32
1cc80d8
Compare
Choose a tag to compare

※ 噢— 為了讓 Tocas 的版本號看起來更穩定一些,我們決定跳過版本號 4.0.0 直接出個 4.0.2 😎👌

  1. 修正 Firefox 的 Select 背景色,從無色改為繼承父容器 (4e5cd01)。
  2. 讓 Tab 與 Selection 的項目直角變得更符合視覺,標準化 Selection 水平內距,感謝 @Tex-Tang (e64d7e1)。
  3. 還原 Row 與 flex-shrink 的變更,因為那會讓文字不換行而越界 (0aa701f)。

Tocas 4.0 Beta 3

12 Apr 15:43
7064011
Compare
Choose a tag to compare
  1. 避免 Row 與 is-fluid 使用時會造成沒有 Fluid 的欄位被擠壓 (27acde9)。
  2. AppNavbar 新增 Vertical 並更改項目間距 (c550b75)。
  3. 將 Grid 的 1fr 用法改為 minmax(0, 1fr) 感謝 @coin3x (b10e539)。

Tocas 4.0 Beta 2

09 Apr 16:25
54ddab7
Compare
Choose a tag to compare

Tocas 4.0 之後的第一個釋出版本,所有使用方式請參閱 https://v4.tocas-ui.com/zh-tw

Tocas 3.0 Alpha 1

05 Mar 05:27
3a4c2d3
Compare
Choose a tag to compare

破壞性問題

  1. 這個版本的所有 JavaScript 模塊正在開發,因此所有模塊皆不可用。

新功能

  1. 新增 Input Dropdown,可在下拉式選單搜尋內容值。(#332
  2. 新增 Multiple Dropdown,可在下拉式選單選取多值。(#339#500
  3. 新增 Flag 能以 Svg 向量方式顯示各個國家的國旗。(#525
  4. 新增 Placeholder 預置區塊供讀取或類 Lorem ipsum 用途。(#538
  5. 新增 Transfer 穿梭框可交換左右兩方的項目。(#527
  6. 從 Font Awesome 4.7.0 升級到 5.0.6。(#545
  7. 新增 Image Comparison 圖片比較元件。(#530

Bug 修正

  1. 下拉式選單收起後會閃爍。(#435
  2. Borderless 無邊框卡片無法用於卡片群組中。(#550
  3. 在反色語意的結構化 Message 中,多個內容不會有分隔線。(#547
  4. Basic Label 的連結顏色。(#559
  5. List 的黑點不對齊、過粗。(#575
  6. Speeches 在新的 Webkit 上不對齊與失效。(#531
  7. iOS 上沒有慣性滾動。(#570
  8. 置中 Menu 時的右側選單無法置右。(#566
  9. Button 的條件會在窄螢幕被擠壓而不會自動換行。(#563
  10. Container 在 Icon Message 中的寬度不正確。(@e0643f3523b40470cd7cee90b781ec9f7486bff1)
  11. Separated Buttons 在 Card 中的 Last Child 會無邊框。(#542
  12. Slate 用上 Image 後的 Header 不是白色的。(#581
  13. 反色 Basic Table 的框線顏色不正確。(@3bc716a455914cc42d4913240cf01b7b97990db9)
  14. 反色 Dropdown 選單。(#580
  15. Tablesort 無法正確依照性質排列。(%572)

無法修正

  1. 以非 JavaScript 的方式將 Tooltip 用與 Speeches 的錯誤。(#454

調整和新增

  1. 圖示有最小寬度。(@fc627137a4cb39443a8a59503e3026b28e199637)
  2. 能夠自訂 Snackbar 的隱藏時間與更多的回呼函式可供使用。(#435
  3. 允許透過 JavaScript 產生臨時 Modal。(#504
  4. 允許透過 JavaScript 產生臨時 Snackbar。(#505
  5. Card 的內容支援 Horizontally Fitted 水平縮減。(#551
  6. Card 的內容會在 Borderless 無邊框時一同採用縮減樣式。(@ 14cd1da
  7. Header 可以有 Single Line 單行模式在標題過長時以「...」截斷。(#553
  8. Progress 的文字可以浮空並置中於進度條。(#546
  9. 標準化 List 的圖片樣式,並增加 Single Line 單行模式。(#552
  10. 新增 Coupon Label,類似折價券般地在標籤左右兩側開孔。(#523
  11. 有反色語意的 Link Button。(#535
  12. 新增 Label 群組,類似 Cards 的用法。(#561
  13. 新增 Corner Label,位於四個角落的三角形標籤。(#558
  14. 新增 Tag Label,類似價格標籤。(#557
  15. 新增 Ribbon、Banner、Empty Ribbon Label,彩帶標籤。(#556
  16. Menu 的圖示現在預設會向右浮動。(#577
  17. 因應新的 Sidebar 到來,移除 Menu 的水平捲動功能。(#576
  18. Basic Button 現在也有脈動動畫。(#562
  19. 移除多數的原生樣式覆蓋。(#528#518
  20. 新增基本線條的 Step 步驟樣式。(#540
  21. 新增 Number Input 樣式可用於計數器輸入欄位。(#526
  22. 新增 Secondary Divider 類似 Medium 的三點式分隔線。(#582
  23. 新增 Vertical Divider 垂直分隔線且可帶文字。(#584
  24. 新增 Offset Column 偏移用欄位能夠在 Stackable 時隱藏。(#585
  25. 減短了 Timelined Feed 的上下空白間距。(@d4a7f48679f7ab77801709f6e219fdb3388251a3)
  26. 能在 Menu 中使用 Accordion 了。(#587
  27. Form 的所有標籤文字粗度改為 500。(@75bec2b2a1787f9ee29a5cde0744e4a861826afb)
  28. 新增 Segmented、Field Accordion,片段與欄位手風琴。(#588
  29. 新增 Segmented Checkbox。(#592
  30. Button 中能有正常的 Label 了。(#136
  31. 新增反色 Form。(#475
  32. 新增 Description List 能將內容註釋稍微向右偏移,而標題繼續靠左。(#593

尚未完成、測試中

  1. 新增 Specification List 以內容為主,標題縮小的規格清單。(#596
  2. 預設的 Dropdown 選單現在不會緊貼按鈕了,並移除 Floating 樣式。(#597
  3. 讓 Relaxed List 更加地寬鬆。(#594
  4. 加回項目上下皆有分隔線的 Celled List 清單。(#595
  5. 新增 Horizontal Card 讓內容水平延展而不是垂直。(#601
  6. 新增 Collapsed Cards 允許合併卡片並無間距。(#602
  7. 更改 Basic Button 那難看的 Active 顏色。(@915d28d62eefb343796c912036ddf8a62359b749)
  8. 新增 Fluid Statistic 和 Unit 單位元素。(@4860b9639b2b10f46c11d364eebb7e0a5bbb6b08)
  9. 深化 Breadcrumb 的分隔線顏色。(@997f418d1e36051b5b16db17e6dfd6b9a11d07a6)
  10. 提高了 Header 的 Line Height 來對齊 Header 中的圖示。(@e8027e07266e40b762df6461de8fb97b8b41fd54)

文件頁面

  1. 新增商店、新聞範例。(@2ad4e10449fb02e6483ba235a72ba1920ca63f97)
  2. 更新範例的 Tocas 版本。(#573
  3. 新增價格範例。(@3a8231ddedf564963407111cd7dc611d505550b6)
  4. 新增商品範例。(@1c46c463a42fe9cb012bd86e64fc7c1bca5f043a)
  5. 更新部落格範例,移除舊有 Slate 改用數張 Card。(@80e59b166f65a10840f459ded3c8d51eda19964e)

Tocas 2.4 Alpha 2

05 Mar 02:22
Compare
Choose a tag to compare

破壞性問題

  1. 這個版本的所有 JavaScript 模塊正在開發,因此所有模塊皆不可用。

新功能

  1. Feed 新增了 Timelined 樣式,類似 Twitter 的時間串連軸。(#451
  2. Input 裡可以擺放 Attached Progress。(#417
  3. Comment 新增 Right Floated Actions 可在留言右上擺放功能按鈕。(#449
  4. Embed 嵌入物件可以透過 ID 自動搜尋 YouTube 和 Vimeo 的縮圖。(#415
  5. Horizontal List 支援 Centered 置中了。(@b1a3a279b3c173c2d1ebbf53b2fd97be6ef88065)
  6. Table 裡的欄位能是 Empty 的,看起來是空的僅有淺色的「-」符號。(#501
  7. Segmented List 可以使用像 Table 那樣的 Indicated 標記語意。(#507)(感謝 @coin3x
  8. Segment 可以使用 Piled 或 Stacked 看起來就像被堆疊。(#510)(感謝 @coin3x
  9. Padded Container 可以讓容器有上下外距,就不會和其他元素相黏在一起。(#519
  10. Image 現在有 Overlay 可以在圖片上層擺放文字或圖示了。(#457, #483

Bug 修正

  1. Text Menu 的項目在 Active 時有背景顏色。(#477
  2. Secondary Vertical Menu 的項目有分隔線。(#480
  3. Menu 裡的 Link List 在 Active 時有背景顏色。(#479
  4. UL 在 Message 裡的顏色過深。(#463
  5. Horizontal Form 跟 Dropdown 不對齊。(#476
  6. Horizontal Form 的 Message 跟 Small 不會對齊。(#484
  7. Slate 裡的 Image 會奇異地放大。(@9c23938c7332582c719cebbf3de1a1e2ccd7e1a0)
  8. Relaxed Items 第一個項目有上外間距。(#492
  9. 讓 Link List 的文字顏色優先度更高避免被覆蓋。(@b1a3a279b3c173c2d1ebbf53b2fd97be6ef88065)
  10. List 的 Item Actions 現在有了左邊距,避免離文字太近。(@b1a3a279b3c173c2d1ebbf53b2fd97be6ef88065)
  11. 滑鼠移動到語意 Link Card 時,底線會消失。(#494
  12. Modal 中 .content 裡的按鈕被按下,Modal 就會消失。(#444
  13. Slate 的左右對齊沒有影響到標題。(#469
  14. Compact Message 不會跟文字縮減。(#503
  15. Text Menu 有白色背景。(#517
  16. 元素的背景陰影現在改為半透明,解決了 Inverted 時陰影卻是白色的問題。(#474
  17. List 的語意沒有套用到 .meta 上。(#508
  18. 跟 Sweet Alert 使用時出現標題走位。(#499
  19. Squared Icon 跟 Icon 大小不一。(#511
  20. Icon Header 無法使用對齊功能。(#520
  21. Error Input 沒有下框線。(#130

調整和新增

  1. Accordion 現在是基於 HTML5 跟 JavaScript。(#288
  2. 移除 Comment 的 max-width 設定。(@6dcea5fb8e5130d78bd295a342fbed5897e17d44)
  3. Modal 有了 onClose 的監聽函式可在 Modal 關閉時被呼叫。(#429
  4. Slate 的標題顏色,現在跟 Header 相同。(@d62148a68a02e34c971e53ae7915dd04e94d45b4)
  5. Icon Input 的 Icon 現在有了 Hover 跟 Active 的狀態樣式,看起來更不死板了。(#506

尚未完成、測試中

  1. 新增 Carousel,與 Bootstrap 的幻燈片相當但多了些功能。(@df20da38d499d782f33314ac886d969f54ff0130)
  2. 星星與愛心評分 Rating 系統。(#487
  3. 新的動畫 Transition 系統,可以指定元素展現過場動畫,或者輪巡元件。(#485
  4. Table 支援 Expand 展開功能,可以展開欄位顯示更詳細的資料。(#490
  5. 新的 Modal 系統,簡化了結構與使用方法。(#489

文件頁面

  1. README 粗體擺錯地方。(@cb064eefb9204b8aff4e8e6bd2c61798c6d93c64)(感謝 @BirkhoffLee

Tocas 2.4 Alpha 1

05 Mar 02:23
Compare
Choose a tag to compare

新功能

  1. List 有文字與一般的分隔線了。(#460
  2. List 現在有了 Thumbnail 的縮圖清單,很適合陳列圖片。
  3. List 現在有了 Icon 的圖示清單,很適合用來陳列文字與圖示的項目。

調整

  1. List 全部重寫,更整齊而且不壅擠了。
  2. 移除 Segmented Items,現在全部統合在 List 中。(#443
  3. Vertical Secondary Menu 不再有分隔線了。

Tocas 2.3.3

29 Jul 17:22
Compare
Choose a tag to compare

Bug 修正

  1. Message 裡的 Container 在某個寬度下會往內縮。(#431
  2. 將 Sidebar 的 Position 從 Absolute 改為 Fixed 避免在 Chrome 上有多餘水平空白。(#448
  3. Pusher 裏的 Icon Labeled Button 中的 Icon 比 Dimmer 還要高層。(#461
  4. 連結圖片會因為浮動而頂部被裁切。(#406
  5. Checkbox 在 Form 裡面不對齊標籤。(#407
  6. Basic Modal 周邊有陰影。(#404
  7. Slate 裡面的 Icon 會被誤以為是 Symbol Icon 而夭壽大。(#426

新功能

  1. 圖片支援 Selected 有藍色邊框看起來能夠是被選擇的。(#458
  2. 新增無邊框 Card。(#459
  3. 下拉式選單的內部選單可以是流動寬度的,和下拉式選單的主按鈕一樣寬度。(#405

調整

  1. Slate 現在不再是 Flexbox 了,讓排版和 Container 使用上更方便。(#442
  2. Calendar 是正方形的了。(#422
  3. 統計數據異動可以被用在群組內簡化單個統計了。(#439
  4. Message 現在不再是 Flexbox 了,讓排版和 Container 使用上更方便。(#445

文件頁面

  1. Message 的 List 改為原生 ul 標籤。(#446
  2. Grid 教學中的多重網格視圖不正確。(#447

Tocas 2.3.2

08 Jun 13:53
Compare
Choose a tag to compare

Bug 修正

  1. 圖示在按鈕裡不能變更大小。(#391
  2. 避免頁面推動器在高度夠的時候出現捲動軸。(#389
  3. 板岩的圖示會移位。(#399
  4. 更改 Webkit 行動裝置點擊標記的顯示方式。(#402
  5. 子彈點的字型與符號。(#401
  6. 核取方塊的白點背景起衝突。(#395

Tocas 2.3.1

06 Jun 11:14
Compare
Choose a tag to compare

Bug 修正

  1. Firefox 上 Inderterminate 進度列會閃爍的問題。(#383
  2. Fieldset 在 Stackable 上沒有外間距。(#385
  3. Dropdown 的箭頭背景變成重複的了。(#384
  4. Inverted Menu 在行動裝置上左側項目有白邊框。(#387
  5. Slate 的 Container 行動裝置上會縮到中間。(#386