Here are some examples showcasing tables.
Column 1 | Column 2 |
---|---|
foo | bar |
fizz | buzz |
Column 1 | Column 2 |
---|---|
foo | bar |
fizz | buzz |
- data = [{col1: "foo", col2: "bar"}, {col1: "fizz", col2: "buzz"}]
= daisy_table do |table|
- table.with_head do |head|
- head.with_column do
Column 1
- head.with_column do
Column 2
- data.each do |d|
- table.with_row do |row|
- row.with_column do
= d[:col1]
- row.with_column do
= d[:col2]
The following example shows how to have a table with multiple headers pinned as you scroll.
1900s |
---|
1900 |
1901 |
1902 |
1903 |
1904 |
1905 |
1906 |
1907 |
1908 |
1909 |
1910s |
1910 |
1911 |
1912 |
1913 |
1914 |
1915 |
1916 |
1917 |
1918 |
1919 |
1920s |
1920 |
1921 |
1922 |
1923 |
1924 |
1925 |
1926 |
1927 |
1928 |
1929 |
1930s |
1930 |
1931 |
1932 |
1933 |
1934 |
1935 |
1936 |
1937 |
1938 |
1939 |
1940s |
1940 |
1941 |
1942 |
1943 |
1944 |
1945 |
1946 |
1947 |
1948 |
1949 |
1950s |
1950 |
1951 |
1952 |
1953 |
1954 |
1955 |
1956 |
1957 |
1958 |
1959 |
1960s |
1960 |
1961 |
1962 |
1963 |
1964 |
1965 |
1966 |
1967 |
1968 |
1969 |
1970s |
1970 |
1971 |
1972 |
1973 |
1974 |
1975 |
1976 |
1977 |
1978 |
1979 |
1980s |
1980 |
1981 |
1982 |
1983 |
1984 |
1985 |
1986 |
1987 |
1988 |
1989 |
1990s |
1990 |
1991 |
1992 |
1993 |
1994 |
1995 |
1996 |
1997 |
1998 |
1999 |
1900s |
---|
1900 |
1901 |
1902 |
1903 |
1904 |
1905 |
1906 |
1907 |
1908 |
1909 |
1910s |
1910 |
1911 |
1912 |
1913 |
1914 |
1915 |
1916 |
1917 |
1918 |
1919 |
1920s |
1920 |
1921 |
1922 |
1923 |
1924 |
1925 |
1926 |
1927 |
1928 |
1929 |
1930s |
1930 |
1931 |
1932 |
1933 |
1934 |
1935 |
1936 |
1937 |
1938 |
1939 |
1940s |
1940 |
1941 |
1942 |
1943 |
1944 |
1945 |
1946 |
1947 |
1948 |
1949 |
1950s |
1950 |
1951 |
1952 |
1953 |
1954 |
1955 |
1956 |
1957 |
1958 |
1959 |
1960s |
1960 |
1961 |
1962 |
1963 |
1964 |
1965 |
1966 |
1967 |
1968 |
1969 |
1970s |
1970 |
1971 |
1972 |
1973 |
1974 |
1975 |
1976 |
1977 |
1978 |
1979 |
1980s |
1980 |
1981 |
1982 |
1983 |
1984 |
1985 |
1986 |
1987 |
1988 |
1989 |
1990s |
1990 |
1991 |
1992 |
1993 |
1994 |
1995 |
1996 |
1997 |
1998 |
1999 |
.w-96.h-96.border.border-gray-400.rounded.overflow-y-auto
= daisy_table(css: "bg-base-100 table-pin-rows") do |table|
- (0..90).step(10).with_index do |step, index|
- table.with_section do |section|
- section.with_head do |head|
- head.with_column(css: 'bg-blue-100') do
- if step == 0
1900s
- else
= "19#{index * 10}s"
- section.with_body do |body|
- (0..9).each do |i|
- body.with_row do |row|
- row.with_column do
- if step == 0
= "190#{step + i}"
- else
= "19#{step + i}"