diff --git a/_includes/downloads.html b/_includes/downloads.html index 84bf23f3..9c62ac79 100644 --- a/_includes/downloads.html +++ b/_includes/downloads.html @@ -1,52 +1,88 @@ -
-
-
-
    -
  • Maven
  • -
  • Gradle Groovy
  • -
  • Gradle Kotlin
  • -
  • Scala SBT
  • - {% if include.show_standalone %} -
  • Standalone
  • -
  • Docker
  • - {% endif %} -
-
-
-

- Add the following to your project's - pom.xml dependencies: -

+
+
+
+
+
+ Maven +
+
+ Gradle +
+
+ Kotlin +
+
+ SBT +
+ {% if include.show_standalone %} +
+ Java +
+
+ Docker +
+ {% endif %} +
+
+
+
+
    +
  • Maven
  • +
  • Gradle Groovy
  • +
  • Gradle Kotlin
  • +
  • Scala SBT
  • + {% if include.show_standalone %} +
  • Standalone
  • +
  • Docker
  • + {% endif %} +
+
+
+

Add the following to your project's pom.xml dependencies:

{% highlight xml %} org.wiremock @@ -55,78 +91,51 @@ test {% endhighlight %} -

- Then follow the next steps for - JUnit 5+ - or - plain Java. -

-
-
-

- Add the following to your project's - build.gradle: -

-{% highlight groovy %} testImplementation "org.wiremock:wiremock:{{ -site.wiremock_version }}" {% endhighlight %} -

- Then follow the next steps for - JUnit 5+ - or - plain Java. -

-
-
-

- Add the following to your project's - build.gradle.kts: -

-{% highlight kotlin %} testImplementation("org.wiremock:wiremock:{{ -site.wiremock_version }}") {% endhighlight %} -

- Then follow the next steps for - JUnit 5+ - or - plain Java. -

-
-
-

- Add the following to your project’s build.sbt: -

-{% highlight scala %} libraryDependencies += "org.wiremock" % -"wiremock" % "{{ site.wiremock_version }}" % Test {% endhighlight %} -
-
-

- Download the - latest standalone JAR - then run the following in a terminal: -

-{% highlight bash %} java -jar wiremock-standalone-{{ -site.wiremock_version }}.jar {% endhighlight %} -

- Learn more in the - running standalone guide. -

+

Then follow the next steps for JUnit 5+ or plain Java.

+
+
+

Add the following to your project's build.gradle:

+{% highlight groovy %} +testImplementation "org.wiremock:wiremock:{{ site.wiremock_version }}" +{% endhighlight %} +

Then follow the next steps for JUnit 5+ or plain Java.

+
+
+

Add the following to your project's build.gradle.kts:

+{% highlight kotlin %} +testImplementation("org.wiremock:wiremock:{{ site.wiremock_version }}") +{% endhighlight %} +

Then follow the next steps for JUnit 5+ or plain Java.

+
+
+

Add the following to your project’s build.sbt:

+{% highlight scala %} +libraryDependencies += + "org.wiremock" % "wiremock" % "{{ site.wiremock_version }}" % Test +{% endhighlight %} +
+
+

+ Download the latest standalone JAR + then run the following in a terminal: +

+{% highlight bash %} +java -jar wiremock-standalone-{{ site.wiremock_version }}.jar +{% endhighlight %} +

Learn more in the running standalone guide.

+
+
+

Run the following in a terminal:

+{% highlight bash %} +docker run -it --rm \ + -p 8080:8080 \ + --name wiremock \ + wiremock/wiremock:{{ site.wiremock_version }} +{% endhighlight %} +

Learn more in the Docker guide.

+
-
-

Run the following in a terminal:

-{% highlight bash %} docker run -it --rm \ -p 8080:8080 \ --name -wiremock \ wiremock/wiremock:{{ site.wiremock_version }} {% -endhighlight %} -

- Learn more in the - Docker guide. -

-
diff --git a/_sass/_code.scss b/_sass/_code.scss index 9c52de81..aca87434 100644 --- a/_sass/_code.scss +++ b/_sass/_code.scss @@ -16,7 +16,6 @@ } .code-tabs-main-example pre { - margin: 0 auto; text-align: left; } @@ -24,7 +23,10 @@ display: none; width: 100%; position: relative; - padding: $p-l; + + @include breakpoint($medium) { + padding: $p-l; + } &.activeCodeSnippet { display: block; diff --git a/_sass/_homepage.scss b/_sass/_homepage.scss index f456d4d5..bbea16ec 100644 --- a/_sass/_homepage.scss +++ b/_sass/_homepage.scss @@ -333,9 +333,26 @@ html { } .code-tabs-wrapper { + margin-bottom: 70px; + background-color: $general-background; + border-radius: 50px; + width: 100%; + padding: 0; + .code-tabs-row { display: flex; } + .code-tabs-sidebar-wrapper { + display: none; + + @include breakpoint($medium) { + display: block; + } + } + .code-tabs-sidebar { + margin: 45px 45px; + width: 170px; + } .code-tabs-example-card { display: flex; @@ -357,54 +374,59 @@ html { } .code-tabs-main { - .code-tabs-main-wrapper { - background: none; - display: grid; - grid-template-rows: auto auto; + border-radius: 10px; + width: 100%; + background-color: #f8fafe; - @include breakpoint($medium) { - grid-template-rows: auto; - grid-template-columns: auto 1fr; - } + .code-tabs-main-wrapper { + margin: $p-l; ul { - margin: 0; + margin: 0 0 $p-l 0; padding: 0; - display: grid; - list-style: none; - grid-template-columns: repeat(3, 1fr); + display: flex; @include breakpoint($medium) { - grid-template-columns: auto; - grid-auto-rows: max-content; + margin: 0; } li { + display: inline; + position: relative; + cursor: pointer; + padding: 14px 20px; margin: 0; - border: 1px solid #dbd8df; - border-bottom: none; - - &.active-tab-example { - font-weight: 700; - } + color: #18253d; @include breakpoint($medium) { - position: relative; - padding: $p-m; - border-right: none; + margin-left: 20px; + } - &:last-child { - border-bottom: 1px solid #dbd8df; - } + &:first-child { + margin-left: 0; + } - &.active-tab-example:after { - content: ""; - position: absolute; - right: -1px; - width: 1px; - background: white; - top: 0; - bottom: 0; + &.active-tab-example { + position: relative; + font-weight: bold; + background-color: #fff; + border: 1px solid #d2dff9; + border-radius: 8px; + + @include breakpoint($medium) { + border: 1px solid #d2dff9; + border-bottom: 1px solid #fff; + border-radius: 8px 8px 0px 0px; + + &:after { + content: ""; + position: absolute; + left: 0; + bottom: -1px; + right: 0; + height: 1px; + background: #fff; + } } } } @@ -412,10 +434,12 @@ html { .code-tabs-main-example { border: 1px solid #d2dff9; + border-radius: 7px; background-color: #fff; + min-height: 420px; @include breakpoint($medium) { - padding: $p-l; + border-radius: 0px 7px 7px 7px; } } } @@ -719,7 +743,6 @@ html { .downloads-wrapper { margin-top: $p-3xl; margin-bottom: $p-3xl; - text-align: center; } .apis-wrapper { @@ -998,17 +1021,6 @@ html { padding-right: 10px; } } - .code-tabs-wrapper { - .code-tabs-main { - .code-tabs-main-wrapper { - ul { - li { - padding: 14px 10px; - } - } - } - } - } .wiremock-cloud-robot { width: 58% !important; @@ -1021,7 +1033,7 @@ html { ul { flex-wrap: wrap; display: flex; - margin-bottom: -11px !important; + margin-bottom: $p-l; } } } @@ -1049,17 +1061,6 @@ html { } } - .code-tabs-row { - .code-tabs-sidebar-wrapper { - display: none; - } - } - .code-tabs-wrapper { - .code-tabs-main { - border-top-left-radius: 50px; - } - } - .wiremock-cloud-wrapper { flex-direction: column; align-items: center;