@import "_variables.scss";

// Import Bulma and Buefy styles
@import "~bulma/bulma.sass";
@import "~buefy/src/scss/buefy";

.navbar {
  box-shadow: 0 0 2px $dark;
}

.navbar-item {
  transition: background-color 0.5s ease;
}

html, body {
  height: 100%;
  overflow-y: hidden;
}

pre.no-pre {
  background-color: transparent;
  color: inherit;
  padding: 0;
}

.transition-container {
  position: relative;
  height: 100%;
}

.transition-container > * {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
}

.fade-enter-active, .fade-leave-active {
  transition: opacity 0.25s;
}
.fade-enter, .fade-leave-to {
  opacity: 0;
}

.quick-fade-enter-active, .quick-fade-leave-active {
  transition: opacity 0.1s;
}
.quick-fade-enter, .quick-fade-leave-to {
  opacity: 0;
}

.slide-left-enter-active, .slide-left-leave-active {
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.slide-left-leave-to {
  transform: translateX(1em);
  opacity: 0;
}

.slide-left-enter {
  transform: translateX(-1em);
  opacity: 0;
}

.slide-up-enter-active, .slide-up-leave-active {
  transition: transform 0.4s ease, opacity 0.4s ease;
}
.slide-up-leave-to {
  transform: translateY(2em);
  opacity: 0;
}

.slide-up-enter {
  transform: translateY(-2em);
  opacity: 0;
}