web.lib.components.quarkus-project.quarkus-project-edition-form.scss Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of code-quarkus Show documentation

Customize a Web Interface to generate Quarkus starter projects.

There is a newer version: 37

@import "../_config.scss";

.quarkus-project-edition-form {
  padding-bottom: 30px;

  @media screen and (max-width: $mobileWidth) {
    margin: 0 10px;
  }

  .form-header-sticky-container {
    position: sticky;
    top: 0;
    background-color: var(--topContainerBg);
    background-image: var(--topContainerBgImage);
    background-repeat: repeat-x;
    color: var(--topContainerTextColor);
    z-index: 110;

    @media screen and (min-width: 1920px) {
      background-image: var(--topContainerBgImageWide);
    }

    .form-header {
      display: flex;
      margin: 0 auto;
    }

    @media screen and (max-width: $mobileWidth) {
      display: none;
    }
  }

  .title h3 {
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: 100;
    margin-bottom: 20px;
  }

  .project-info {
    flex-basis: 75%;
    height: 190px;
    margin-bottom: 10px;

    .title {
      height: 72px;
      line-height: 72px;

      display: flex;

      .quarkus-version {
        font-size: 1rem;
        line-height: 20px;
        margin: 5px 5px;
        padding: 0 3px;
        height: 20px;
        text-transform: uppercase;
        border: 1px solid white;
      }
    }
  }

  .project-extensions {
    margin: 0 auto;
    flex-basis: 100%;
    background-color: var(--mainContainerBg);
    color: var(--mainContainerTextColor);

    & > .title {
      color: var(--mainContainerTextColor);
      text-align: center;
      margin-top: 20px;
      @media screen and (min-width: $mobileWidth) {
        display: none;
      }
    }
  }
}