@taiga-ui/legacy 5.0.0 → 5.1.0-canary.71f34cd

package/styles/markup/tui-table.less

@@ -0,0 +1,184 @@
+@height-cell-large: 5rem;
+
+.tui-table {
+    inline-size: 100%;
+
+    &_layout_fixed {
+        table-layout: fixed;
+    }
+
+    &__tr {
+        .transition(background);
+
+        outline: none;
+
+        &:not(&_hover_disabled):hover {
+            background: var(--tui-background-base-alt);
+        }
+
+        &:not(&_border_none) {
+            border-block-end: 1px solid var(--tui-border-normal);
+        }
+
+        &_border_top {
+            border-block-start: 1px solid var(--tui-border-normal);
+        }
+
+        &_cursor_pointer {
+            cursor: pointer;
+        }
+    }
+
+    &__th {
+        .text-overflow();
+
+        font: var(--tui-typography-body-s);
+        padding: 0.5rem 1rem;
+        vertical-align: middle;
+        block-size: 2.5rem;
+        color: var(--tui-text-secondary);
+        background: inherit;
+
+        &_font-size_l,
+        .tui-table_font-size_l & {
+            font: var(--tui-typography-body-m);
+        }
+    }
+
+    &__td {
+        font: var(--tui-typography-body-m);
+        padding: 1rem 1rem 0.875rem;
+        vertical-align: top;
+        overflow-wrap: break-word;
+        block-size: 3.4375rem;
+        color: var(--tui-text-primary);
+        background: inherit;
+
+        &_size_l,
+        .tui-table_size_l & {
+            block-size: @height-cell-large - 0.0625rem;
+        }
+
+        &_font-size_l,
+        .tui-table_font-size_l & {
+            font: var(--tui-typography-body-l);
+        }
+
+        &_font-size_s,
+        .tui-table_font-size_s & {
+            font: var(--tui-typography-body-s);
+        }
+
+        &_align_center {
+            vertical-align: middle;
+        }
+    }
+
+    &__td,
+    &__th {
+        box-sizing: border-box;
+        text-align: start;
+
+        .tui-table_size_l &::before {
+            inline-size: 1rem;
+            border-top-left-radius: 1rem;
+            border-bottom-left-radius: 1rem;
+        }
+
+        &_first::before,
+        &_last::before {
+            content: '';
+            position: absolute;
+            inset-block-start: 0;
+            inline-size: 0.75rem;
+            block-size: 100%;
+            background: inherit;
+            border-top-left-radius: 0.75rem;
+            border-bottom-left-radius: 0.75rem;
+        }
+
+        &_first {
+            position: relative;
+            padding-inline-start: 0;
+            overflow: visible;
+
+            &::before {
+                inset-inline-end: 100%;
+            }
+        }
+
+        &_last {
+            position: relative;
+            padding-inline-end: 0;
+            overflow: visible;
+
+            &::before {
+                inset-inline-start: 100%;
+                transform: scaleX(-1);
+            }
+        }
+
+        &_text_center {
+            text-align: center;
+        }
+
+        &_text_right {
+            text-align: end;
+        }
+
+        &_text_overflow {
+            .text-overflow();
+        }
+    }
+
+    &__subtext {
+        font: var(--tui-typography-body-s);
+        margin: 0.25rem 0 0;
+        color: var(--tui-text-tertiary);
+    }
+
+    &__sort {
+        .button-clear();
+        .transition(color);
+
+        position: relative;
+        display: inline-flex;
+        align-items: center;
+        outline: none;
+        cursor: pointer;
+
+        &:hover {
+            color: var(--tui-text-primary);
+        }
+
+        &_active {
+            color: var(--tui-text-action);
+
+            &:hover {
+                color: var(--tui-text-action-hover);
+            }
+        }
+    }
+
+    &__sort-icon {
+        .center-top();
+
+        inset-inline-start: 100%;
+        margin-inline-start: 0.125rem;
+        inline-size: 1rem;
+        block-size: 1rem;
+        flex-shrink: 0;
+        opacity: 0;
+
+        .tui-table__sort_active &,
+        .tui-table__sort:hover & {
+            .transition(transform);
+
+            opacity: 1;
+        }
+
+        .tui-table__sort_active.tui-table__sort_up & {
+            transform: rotate(180deg) translateY(50%);
+        }
+    }
+}

package/styles/markup/tui-text.less

@@ -0,0 +1,57 @@
+.tui-text {
+    &_h1 {
+        font: var(--tui-typography-heading-h1);
+    }
+
+    &_h2 {
+        font: var(--tui-typography-heading-h2);
+    }
+
+    &_h3 {
+        font: var(--tui-typography-heading-h3);
+    }
+
+    &_h4 {
+        font: var(--tui-typography-heading-h4);
+    }
+
+    &_h5 {
+        font: var(--tui-typography-heading-h5);
+    }
+
+    &_h6 {
+        font: var(--tui-typography-heading-h6);
+    }
+
+    &_body-l {
+        font: var(--tui-typography-body-l);
+    }
+
+    &_body-l-2 {
+        font: var(--tui-typography-ui-l);
+    }
+
+    &_body-m {
+        font: var(--tui-typography-body-m);
+    }
+
+    &_body-m-2 {
+        font: var(--tui-typography-ui-m);
+    }
+
+    &_body-s {
+        font: var(--tui-typography-body-s);
+    }
+
+    &_body-s-2 {
+        font: var(--tui-typography-ui-s);
+    }
+
+    &_body-xs {
+        font: var(--tui-typography-body-xs);
+    }
+
+    &_bold {
+        font-weight: bold;
+    }
+}

package/styles/taiga-ui-global.less

@@ -0,0 +1,14 @@
+@import '@taiga-ui/styles/utils.less';
+@import 'basic/keyframes.less';
+@import 'basic/main.less';
+@import 'markup/tui-container.less';
+@import 'markup/tui-form.less';
+@import 'markup/tui-island.less';
+@import 'markup/tui-list.less';
+@import 'markup/tui-mobile-only.less';
+@import 'markup/tui-required.less';
+@import 'markup/tui-row.less';
+@import 'markup/tui-skeleton.less';
+@import 'markup/tui-space.less';
+@import 'markup/tui-table.less';
+@import 'markup/tui-text.less';