Newer
Older
CrypticOreWallet / src / layout / PageLayout.less
@Drew Lemmy Drew Lemmy on 26 Mar 2021 1 KB feat: initial work on mobile UI
// Copyright (c) 2020-2021 Drew Lemmy
// This file is part of KristWeb 2 under AGPL-3.0.
// Full details: https://github.com/tmpim/KristWeb2/blob/master/LICENSE.txt
@import (reference) "../App.less";

.page-layout {
  height: 100%;

  .page-layout-header.ant-page-header {
    min-height: @kw-page-header-height;

    padding-bottom: 0;

    .ant-page-header-heading-sub-title {
      .ant-typography {
        color: inherit;
      }
    }

    // Hide extra table pagination on mobile
    @media (max-width: @screen-md) {
      .ant-pagination {
        display: none;
      }
    }
  }

  .page-layout-contents {
    height: calc(100% - @kw-page-header-height);

    padding: @padding-lg;

    // Make tables full-width on mobile (though most should be replaced with
    // custom views)
    @media (max-width: @screen-md) {
      >.ant-table-wrapper {
        .ant-table {
          margin: 0 -24px;
        }

        .ant-pagination {
          justify-content: center;

          .ant-pagination-total-text {
            display: none;
          }

          .ant-pagination-item, .ant-pagination-prev{
            margin-right: 3px;
          }

          .ant-pagination-next  {
            margin-right: 0;
          }
        }
      }
    }
  }

  &.page-layout-no-top-padding {
    .page-layout-contents {
      padding-top: 0;
    }
  }
}