tgui-core 1.7.0 → 1.7.2

package/styles/functions.scss

@@ -0,0 +1,74 @@
+@use "sass:color";
+@use "sass:map";
+@use "sass:math";
+@use "sass:meta";
+
+//  Type-casting
+// --------------------------------------------------------
+
+// Get a unit-less numeric value
+@function num($value) {
+  @if meta.type-of($value) != number {
+    @error 'Could not convert `#{$value}` - must be `type-of number`';
+    @return null;
+  }
+  @if math.unit($value) == "%" {
+    @return math.div($value, 100%);
+  }
+  @return math.div($value, $value * 0 + 1);
+}
+
+//  Color
+// --------------------------------------------------------
+
+// Increases perceptual color lightness.
+@function lighten($color, $percent) {
+  $scaled: hsl(
+    color.channel($color, "hue", $space: hsl),
+    color.channel($color, "saturation", $space: hsl),
+    color.channel($color, "lightness", $space: hsl) * (1 + num($percent))
+  );
+  $mixed: color.mix(hsl(0, 0%, 100%), $color, 100% * num($percent));
+  @return color.mix($scaled, $mixed, 75%);
+}
+
+// Returns the NTSC luminance of `$color` as a float (between 0 and 1).
+// 1 is pure white, 0 is pure black.
+@function luminance($color) {
+  $colors: (
+    "red": color.channel($color, "red", $space: rgb),
+    "green": color.channel($color, "green", $space: rgb),
+    "blue": color.channel($color, "blue", $space: rgb),
+  );
+
+  @each $name, $value in $colors {
+    $adjusted: 0;
+    $value: math.div($value, 255);
+    @if $value < 0.03928 {
+      $value: math.div($value, 12.92);
+    } @else {
+      $value: math.div($value + 0.055, 1.055);
+      $value: math.pow($value, 2.4);
+    }
+
+    $colors: map.merge(
+      $colors,
+      (
+        $name: $value,
+      )
+    );
+  }
+
+  @return (map.get($colors, "red") * 0.2126) +
+    (map.get($colors, "green") * 0.7152) + (map.get($colors, "blue") * 0.0722);
+}
+
+// Blends an RGBA color with a static background color based on its
+// alpha channel. Returns an RGB color, which is compatible with IE8.
+@function fake-alpha($color-rgba, $color-background) {
+  @return color.mix(
+    color.change($color-rgba, $alpha: 1),
+    $color-background,
+    color.alpha($color-rgba) * 100%
+  );
+}

package/styles/main.scss

@@ -0,0 +1,33 @@
+@use "sass:meta";
+@use "base";
+
+// Core styles
+@include meta.load-css("./reset.scss");
+
+// Components
+@include meta.load-css("./components/BlockQuote.scss");
+@include meta.load-css("./components/Button.scss");
+@include meta.load-css("./components/ColorBox.scss");
+@include meta.load-css("./components/Dialog.scss");
+@include meta.load-css("./components/Dimmer.scss");
+@include meta.load-css("./components/Divider.scss");
+@include meta.load-css("./components/Dropdown.scss");
+@include meta.load-css("./components/Flex.scss");
+@include meta.load-css("./components/Icon.scss");
+@include meta.load-css("./components/ImageButton.scss");
+@include meta.load-css("./components/Input.scss");
+@include meta.load-css("./components/Knob.scss");
+@include meta.load-css("./components/LabeledList.scss");
+@include meta.load-css("./components/MenuBar.scss");
+@include meta.load-css("./components/Modal.scss");
+@include meta.load-css("./components/NoticeBox.scss");
+@include meta.load-css("./components/NumberInput.scss");
+@include meta.load-css("./components/ProgressBar.scss");
+@include meta.load-css("./components/RoundGauge.scss");
+@include meta.load-css("./components/Section.scss");
+@include meta.load-css("./components/Slider.scss");
+@include meta.load-css("./components/Stack.scss");
+@include meta.load-css("./components/Table.scss");
+@include meta.load-css("./components/Tabs.scss");
+@include meta.load-css("./components/TextArea.scss");
+@include meta.load-css("./components/Tooltip.scss");

package/styles/reset.scss

@@ -0,0 +1,63 @@
+@use "base";
+
+html,
+body {
+  box-sizing: border-box;
+  height: 100%;
+  margin: 0;
+  font-size: base.$font-size;
+}
+
+html {
+  overflow: hidden;
+  cursor: default; // Reset the cursor.
+}
+
+body {
+  overflow: auto;
+  font-family: Verdana, Geneva, sans-serif;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  display: block;
+  margin: 0;
+  padding: 6px 0;
+  padding: 0.5rem 0;
+}
+
+h1 {
+  font-size: 18px;
+  font-size: 1.5rem;
+}
+
+h2 {
+  font-size: 16px;
+  font-size: 1.333rem;
+}
+
+h3 {
+  font-size: 14px;
+  font-size: 1.167rem;
+}
+
+h4 {
+  font-size: 12px;
+  font-size: 1rem;
+}
+
+td,
+th {
+  vertical-align: baseline;
+  text-align: left;
+}