@upendra19/swagger-ui-custom 1.0.0

package/src/style/_markdown.scss

@@ -0,0 +1,34 @@
+@use "variables" as *;
+@use "type";
+
+.markdown,
+.renderedMarkdown {
+  p,
+  pre {
+    margin: 1em auto;
+
+    word-break: break-all; /* Fallback trick */
+    word-break: break-word;
+  }
+  pre {
+    color: black;
+    font-weight: normal;
+    white-space: pre-wrap;
+    background: none;
+    padding: 0px;
+  }
+
+  code {
+    font-size: 14px;
+    padding: 5px 7px;
+
+    border-radius: 4px;
+    background: rgba($info-code-background-color, 0.05);
+
+    @include type.text_code($info-code-font-color);
+  }
+
+  pre > code {
+    display: block;
+  }
+}

package/src/style/_mixins.scss

@@ -0,0 +1,159 @@
+@use "sass:color";
+@use "variables" as *;
+
+// - - - - - - - - - - - - - - - - - - -
+// - - _mixins.scss module
+// styles for the _mixins.scss module
+@function calculateRem($size) {
+  $remSize: $size / 16px;
+  @return $remSize * 1rem;
+}
+
+@mixin font-size($size) {
+  font-size: $size;
+  font-size: calculateRem($size);
+}
+
+%clearfix {
+  &:before,
+  &:after {
+    display: table;
+
+    content: " ";
+  }
+  &:after {
+    clear: both;
+  }
+}
+
+@mixin size($width, $height: $width) {
+  width: $width;
+  height: $height;
+}
+
+$ease: (
+  in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53),
+  in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19),
+  in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22),
+  in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06),
+  in-sine: cubic-bezier(0.47, 0, 0.745, 0.715),
+  in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035),
+  in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335),
+  in-back: cubic-bezier(0.6, -0.28, 0.735, 0.045),
+  out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94),
+  out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1),
+  out-quart: cubic-bezier(0.165, 0.84, 0.44, 1),
+  out-quint: cubic-bezier(0.23, 1, 0.32, 1),
+  out-sine: cubic-bezier(0.39, 0.575, 0.565, 1),
+  out-expo: cubic-bezier(0.19, 1, 0.22, 1),
+  out-circ: cubic-bezier(0.075, 0.82, 0.165, 1),
+  out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275),
+  in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955),
+  in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1),
+  in-out-quart: cubic-bezier(0.77, 0, 0.175, 1),
+  in-out-quint: cubic-bezier(0.86, 0, 0.07, 1),
+  in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95),
+  in-out-expo: cubic-bezier(1, 0, 0, 1),
+  in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86),
+  in-out-back: cubic-bezier(0.68, -0.55, 0.265, 1.55),
+);
+
+@function ease($key) {
+  @if map-has-key($ease, $key) {
+    @return map-get($ease, $key);
+  }
+
+  @warn 'Unkown \'#{$key}\' in $ease.';
+  @return null;
+}
+
+@mixin ease($key) {
+  transition-timing-function: ease($key);
+}
+
+@mixin text-truncate {
+  overflow: hidden;
+
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+@mixin aspect-ratio($width, $height) {
+  position: relative;
+  &:before {
+    display: block;
+
+    width: 100%;
+    padding-top: ($height / $width) * 100%;
+
+    content: "";
+  }
+  > iframe {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+}
+
+$browser-context: 16;
+
+@function em($pixels, $context: $browser-context) {
+  @if (unitless($pixels)) {
+    $pixels: $pixels * 1px;
+  }
+
+  @if (unitless($context)) {
+    $context: $context * 1px;
+  }
+
+  @return $pixels / $context * 1em;
+}
+
+@mixin maxHeight($height) {
+  @media (max-height: $height) {
+    @content;
+  }
+}
+
+@mixin breakpoint($class) {
+  @if $class == tablet {
+    @media (min-width: 768px) and (max-width: 1024px) {
+      @content;
+    }
+  } @else if $class == mobile {
+    @media (min-width: 320px) and (max-width: 736px) {
+      @content;
+    }
+  } @else if $class == desktop {
+    @media (min-width: 1400px) {
+      @content;
+    }
+  } @else {
+    @warn 'Breakpoint mixin supports: tablet, mobile, desktop';
+  }
+}
+
+@mixin invalidFormElement() {
+  animation: shake 0.4s 1;
+  border-color: $color-delete;
+  background: color.adjust($color-delete, $lightness: 35%);
+}
+
+@mixin method($color) {
+  border-color: $color;
+  background: rgba($color, 0.1);
+
+  .opblock-summary-method {
+    background: $color;
+  }
+
+  .opblock-summary {
+    border-color: $color;
+  }
+
+  .tab-header .tab-item.active h4 span:after {
+    background: $color;
+  }
+}

package/src/style/_modal.scss

@@ -0,0 +1,95 @@
+@use "variables" as *;
+@use "type";
+
+.dialog-ux {
+  position: fixed;
+  z-index: 9999;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+
+  .backdrop-ux {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+
+    background: rgba($dialog-ux-backdrop-background-color, 0.8);
+  }
+
+  .modal-ux {
+    position: absolute;
+    z-index: 9999;
+    top: 50%;
+    left: 50%;
+
+    width: 100%;
+    min-width: 300px;
+    max-width: 650px;
+
+    transform: translate(-50%, -50%);
+
+    border: 1px solid $dialog-ux-modal-border-color;
+    border-radius: 4px;
+    background: $dialog-ux-modal-background-color;
+    box-shadow: 0 10px 30px 0 rgba($dialog-ux-modal-box-shadow-color, 0.2);
+  }
+
+  .modal-ux-content {
+    overflow-y: auto;
+
+    max-height: 540px;
+    padding: 20px;
+
+    p {
+      font-size: 12px;
+
+      margin: 0 0 5px 0;
+
+      color: $dialog-ux-modal-content-font-color;
+
+      @include type.text_body();
+    }
+
+    h4 {
+      font-size: 18px;
+      font-weight: 600;
+
+      margin: 15px 0 0 0;
+
+      @include type.text_headline();
+    }
+  }
+
+  .modal-ux-header {
+    display: flex;
+
+    padding: 12px 0;
+
+    border-bottom: 1px solid $dialog-ux-modal-header-border-bottom-color;
+
+    align-items: center;
+
+    .close-modal {
+      padding: 0 10px;
+
+      border: none;
+      background: none;
+
+      appearance: none;
+    }
+
+    h3 {
+      font-size: 20px;
+      font-weight: 600;
+
+      margin: 0;
+      padding: 0 20px;
+
+      flex: 1;
+      @include type.text_headline();
+    }
+  }
+}

package/src/style/_models.scss

@@ -0,0 +1,330 @@
+@use "variables" as *;
+@use "type";
+
+.model {
+  font-size: 12px;
+  font-weight: 300;
+
+  @include type.text_code();
+
+  .deprecated {
+    span,
+    td {
+      color: $model-deprecated-font-color !important;
+    }
+
+    > td:first-of-type {
+      text-decoration: line-through;
+    }
+  }
+  &-toggle {
+    font-size: 10px;
+
+    position: relative;
+    top: 6px;
+
+    display: inline-block;
+
+    margin: auto 0.3em;
+
+    cursor: pointer;
+    transition: transform 0.15s ease-in;
+    transform: rotate(90deg);
+    transform-origin: 50% 50%;
+
+    &.collapsed {
+      transform: rotate(0deg);
+    }
+
+    &:after {
+      display: block;
+
+      width: 20px;
+      height: 20px;
+
+      content: "";
+
+      background: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg>')
+        center no-repeat;
+      background-size: 100%;
+    }
+  }
+
+  &-jump-to-path {
+    position: relative;
+
+    cursor: pointer;
+
+    .view-line-link {
+      position: absolute;
+      top: -0.4em;
+
+      cursor: pointer;
+    }
+  }
+
+  &-title {
+    position: relative;
+
+    &:hover .model-hint {
+      display: block;
+    }
+  }
+
+  &-hint {
+    position: absolute;
+    top: -1.8em;
+
+    display: none;
+
+    padding: 0.1em 0.5em;
+
+    white-space: nowrap;
+
+    color: $model-hint-font-color;
+    border-radius: 4px;
+    background: rgba($model-hint-background-color, 0.7);
+  }
+
+  p {
+    margin: 0 0 1em 0;
+  }
+
+  .property {
+    color: #999;
+    font-style: italic;
+
+    &.primitive {
+      color: #6b6b6b;
+
+      &.extension {
+        display: block;
+
+        > td:first-child {
+          padding-left: 0;
+          padding-right: 0;
+          width: auto;
+
+          &:after {
+            content: ":\00a0";
+          }
+        }
+      }
+    }
+  }
+
+  .external-docs {
+    color: #666;
+    font-weight: normal;
+  }
+}
+
+table.model {
+  tr {
+    &.description {
+      color: #666;
+      font-weight: normal;
+
+      td:first-child {
+        font-weight: bold;
+      }
+    }
+
+    &.property-row {
+      &.required td:first-child {
+        font-weight: bold;
+      }
+
+      td {
+        vertical-align: top;
+
+        &:first-child {
+          padding-right: 0.2em;
+        }
+      }
+
+      .star {
+        color: red;
+      }
+    }
+
+    &.extension {
+      color: #777;
+
+      td:last-child {
+        vertical-align: top;
+      }
+    }
+
+    &.external-docs {
+      td:first-child {
+        font-weight: bold;
+      }
+    }
+
+    .renderedMarkdown p:first-child {
+      margin-top: 0;
+    }
+  }
+}
+
+section.models {
+  margin: 30px 0;
+
+  border: 1px solid rgba($section-models-border-color, 0.3);
+  border-radius: 4px;
+
+  .pointer {
+    cursor: pointer;
+  }
+
+  &.is-open {
+    padding: 0 0 20px;
+    h4 {
+      margin: 0 0 5px 0;
+
+      border-bottom: 1px solid
+        rgba($section-models-isopen-h4-border-bottom-color, 0.3);
+    }
+  }
+  h4 {
+    font-size: 16px;
+
+    display: flex;
+    align-items: center;
+
+    margin: 0;
+    padding: 10px 20px 10px 10px;
+
+    cursor: pointer;
+    transition: all 0.2s;
+
+    @include type.text_headline($section-models-h4-font-color);
+
+    svg {
+      transition: all 0.4s;
+    }
+
+    span {
+      flex: 1;
+    }
+
+    &:hover {
+      background: rgba($section-models-h4-background-color-hover, 0.02);
+    }
+  }
+
+  h5 {
+    font-size: 16px;
+
+    margin: 0 0 10px 0;
+
+    @include type.text_headline($section-models-h5-font-color);
+  }
+
+  .model-jump-to-path {
+    position: relative;
+    top: 5px;
+  }
+
+  .model-container {
+    margin: 0 20px 15px;
+    position: relative;
+
+    transition: all 0.5s;
+
+    border-radius: 4px;
+    background: rgba($section-models-model-container-background-color, 0.05);
+
+    &:hover {
+      background: rgba($section-models-model-container-background-color, 0.07);
+    }
+
+    &:first-of-type {
+      margin: 20px;
+    }
+
+    &:last-of-type {
+      margin: 0 20px;
+    }
+
+    .models-jump-to-path {
+      position: absolute;
+      top: 8px;
+      right: 5px;
+      opacity: 0.65;
+    }
+  }
+
+  .model-box {
+    background: none;
+
+    &:has(.model-box) {
+      width: 100%;
+      overflow-x: auto;
+    }
+  }
+}
+
+.model-box {
+  padding: 10px;
+  display: inline-block;
+
+  border-radius: 4px;
+  background: rgba($section-models-model-box-background-color, 0.1);
+
+  .model-jump-to-path {
+    position: relative;
+    top: 4px;
+  }
+
+  &.deprecated {
+    opacity: 0.5;
+  }
+}
+
+.model-title {
+  font-size: 16px;
+
+  @include type.text_headline($section-models-model-title-font-color);
+
+  img {
+    margin-left: 1em;
+    position: relative;
+    bottom: 0px;
+  }
+}
+
+.model-deprecated-warning {
+  font-size: 16px;
+  font-weight: 600;
+
+  margin-right: 1em;
+
+  @include type.text_headline($color-delete);
+}
+
+span {
+  > span.model {
+    .brace-close {
+      padding: 0 0 0 10px;
+    }
+  }
+}
+
+.prop-name {
+  display: inline-block;
+
+  margin-right: 1em;
+}
+
+.prop-type {
+  color: $prop-type-font-color;
+}
+
+.prop-enum {
+  display: block;
+}
+.prop-format {
+  color: $prop-format-font-color;
+}

package/src/style/_servers.scss

@@ -0,0 +1,66 @@
+@use "variables" as *;
+@use "type";
+
+.servers {
+  > label {
+    font-size: 12px;
+
+    margin: -20px 15px 0 0;
+
+    @include type.text_headline();
+
+    select {
+      min-width: 130px;
+      max-width: 100%;
+      width: 100%;
+    }
+  }
+
+  h4.message {
+    padding-bottom: 2em;
+  }
+
+  table {
+    tr {
+      width: 30em;
+    }
+    td {
+      display: inline-block;
+      max-width: 15em;
+      vertical-align: middle;
+      padding-top: 10px;
+      padding-bottom: 10px;
+
+      &:first-of-type {
+        padding-right: 1em;
+      }
+
+      input {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+
+  .computed-url {
+    margin: 2em 0;
+
+    code {
+      display: inline-block;
+      padding: 4px;
+      font-size: 16px;
+      margin: 0 1em;
+    }
+  }
+}
+
+.servers-title {
+  font-size: 12px;
+  font-weight: bold;
+}
+
+.operation-servers {
+  h4.message {
+    margin-bottom: 2em;
+  }
+}

package/src/style/_split-pane-mode.scss

@@ -0,0 +1,3 @@
+.Resizer.vertical.disabled {
+  display: none;
+}