textual/examples/basic.css

/* CSS file for basic.py */

App > Screen {
  layout: dock;
  docks: side=left/1;
  background: $background;
  color: $on-background;
}

#sidebar {
  color: $on-primary;
  background: $primary;
  dock: side;
  width: 30;
  offset-x: -100%;
  layout: dock;
  transition: offset 500ms in_out_cubic;
}

#sidebar.-active {
  offset-x: 0;
}

#sidebar .title {
  height: 1;
  background: $secondary-darken2;
  color: $on-secondary-darken2;
  border-right: outer $secondary-darken3;
}

#sidebar .user {
  height: 8;
  background: $secondary-darken1;
  color: $on-secondary-darken1;
  border-right: outer $secondary-darken3;
}

#sidebar .content {
  background: $secondary;
  color: $on-secondary;
  border-right: outer $secondary-darken3;
}

#header {
  color: $on-primary;
  background: $primary;
  height: 3;
  border-right: outer $secondary-darken3;
}

#content {
  color: $on-background;
  background: $background;
}

#footer {
  color: $on-accent1;
  background: $accent1;

  height: 1;

  border-top: hkey $accent1-darken2;
}