File tree Expand file tree Collapse file tree 2 files changed +5
-1
lines changed
docs/docs/6-simple-components/tables
src/docs/6-simple-components Expand file tree Collapse file tree 2 files changed +5
-1
lines changed Original file line number Diff line number Diff line change @@ -633,7 +633,7 @@ <h1 class="h2 mt-0 t-bold t-balance">Tables</h1>
633
633
</ table >
634
634
< pre class ="language-html "> < code class ="language-html "> < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > thead</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > tr</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > th</ span > < span class ="token punctuation "> > </ span > </ span > Table Header 1< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > th</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > th</ span > < span class ="token punctuation "> > </ span > </ span > Table Header 2< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > th</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > th</ span > < span class ="token punctuation "> > </ span > </ span > Table Header 3< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > th</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > tr</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > thead</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > tbody</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > tr</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > Table content 1.1< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > Table content 2.1< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > Table content 3.1< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > tr</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > tr</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > Table content 1.2< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > Table content 2.2< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > Table content 3.2< span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > td</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > tr</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > tbody</ span > < span class ="token punctuation "> > </ span > </ span > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > </ code > </ pre >
635
635
< h2 id ="table-alternative-styles " tabindex ="-1 "> Table alternative styles</ h2 >
636
- < pre class ="language-html "> < code class ="language-html "> < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-borderless< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-compact< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-fixed< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-striped< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > </ code > </ pre >
636
+ < pre class ="language-html "> < code class ="language-html "> < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-borderless< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-lined< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-compact< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-fixed< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > < br > < br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> <</ span > table</ span > < span class ="token attr-name "> class</ span > < span class ="token attr-value "> < span class ="token punctuation attr-equals "> =</ span > < span class ="token punctuation "> "</ span > table table-striped< span class ="token punctuation "> "</ span > </ span > < span class ="token punctuation "> > </ span > </ span > < br > ...< br > < span class ="token tag "> < span class ="token tag "> < span class ="token punctuation "> </</ span > table</ span > < span class ="token punctuation "> > </ span > </ span > </ code > </ pre >
637
637
< p > < code > table-borderless</ code > – no borders around table or cells</ p >
638
638
< table class ="table table-borderless ">
639
639
< thead >
Original file line number Diff line number Diff line change @@ -76,6 +76,10 @@ The Codebase `table` component class expands tables to 100% width, aligns everyt
76
76
...
77
77
</table >
78
78
79
+ <table class =" table table-lined" >
80
+ ...
81
+ </table >
82
+
79
83
<table class =" table table-compact" >
80
84
...
81
85
</table >
You can’t perform that action at this time.
0 commit comments