Adjust Colours. (#10417)

- Change the lightness of the component colours to match Figma.
- Remove the background image from tailwind.css.
- Alter the code editor background to be white.
- Make the selection colour much brighter in the dashboard.

![image](https://github.com/enso-org/enso/assets/4699705/4ae8f03a-bdeb-48cf-86eb-aa058a2a1b01)

![image](https://github.com/enso-org/enso/assets/4699705/eb5d4cf8-d275-4c0d-b876-4a29ce7768bf)

![image](https://github.com/enso-org/enso/assets/4699705/0df64403-75e5-4e44-a818-58cedbbcd3c9)

# Important Notes
Removed the `is-hidden-file` package from the project manager shim. It seems to be unreliable in Win11 and as just for local testing made just do dot file logic.

app/gui2/src/components/CodeEditor.vue

@@ -425,7 +425,7 @@ const editorStyle = computed(() => {
   color: white;
   width: 100%;
   height: 100%;
-  background-color: rgba(255, 255, 255, 0.35);
+  background-color: rgba(255, 255, 255, 0.9);
   box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.4);
   border-radius: 5px;
@@ -449,7 +449,7 @@ const editorStyle = computed(() => {
 
   &::before {
     content: '';
-    background-color: rgba(255, 255, 255, 0.35);
+    background-color: rgba(255, 255, 255, 0.9);
     backdrop-filter: blur(64px);
     border-radius: 4px;
   }

app/gui2/src/util/colors.ts

@@ -25,7 +25,7 @@ export function colorFromString(s: string) {
 export function ensoColor(hue: number): Oklch {
   return {
     mode: 'oklch',
-    l: 0.545,
+    l: 0.464,
     c: 0.14,
     h: normalizeHue(hue) * 360,
   }

app/ide-desktop/lib/dashboard/src/tailwind.css

@@ -418,13 +418,13 @@
     inset: 0 -16vw -16vh 0;
     z-index: -1;
 
-    background: url("enso-assets/background.jpg");
+    background-color: #ea9a39ff;
 
     @apply fixed bg-cover pointer-events-none;
   }
 
   & > * {
-    @apply bg-white/90;
+    @apply bg-white/80;
   }
 }
 

app/ide-desktop/lib/dashboard/tailwind.config.js

@@ -520,7 +520,7 @@ inset 0 -36px 51px -51px #00000014`,
               & > tbody > tr.rounded-rows-child.selected > td:not(.rounded-rows-skip-level),
               & > tbody > tr.rounded-rows-child.selected > td.rounded-rows-skip-level > *
             )`]: {
-              backgroundColor: 'rgb(255 255 255 / 40%)',
+              backgroundColor: 'rgb(255 255 255 / 90%)',
             },
             [`:where(
               & > tbody > tr.rounded-rows-child[data-drop-target] > td:not(.rounded-rows-skip-level),

app/ide-desktop/lib/project-manager-shim/src/projectManagerShimMiddleware.ts

@@ -5,7 +5,6 @@ import * as fsSync from 'node:fs'
 import * as http from 'node:http'
 import * as path from 'node:path'
 
-import * as isHiddenFile from 'is-hidden-file'
 import * as tar from 'tar'
 import * as yaml from 'yaml'
 
@@ -466,19 +465,10 @@ function extractProjectMetadata(yamlObj: unknown, jsonObj: unknown): ProjectMeta
 }
 
 /**
- * Checks if the provided path should be hidden.
- *
- * On Windows, files that start with the dot but don't have the hidden property
- * should also be hidden.
+ * Checks if files that start with the dot.
+ * Note on Windows does not check the hidden property.
  */
 function isHidden(filePath: string): boolean {
-    const dotfile = /(^|\/)\.[^/.]/g
-    try {
-        return isHiddenFile.isHiddenFile(filePath) || dotfile.test(filePath)
-    } catch {
-        // is-hidden-file library occasionally
-        // fails on Windows due to native library loading
-        // issues. Fallback to the filename check.
-        return dotfile.test(filePath)
-    }
+    const dotfile = /(^|[\\/])\.[^\\/]+$/g
+    return dotfile.test(filePath)
 }

app/ide-desktop/package.json

@@ -36,7 +36,6 @@
     "@stripe/stripe-js": "^2.1.10",
     "esbuild-plugin-inline-image": "^0.0.9",
     "eslint-plugin-react": "^7.32.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "is-hidden-file": "^1.1.2"
+    "eslint-plugin-react-hooks": "^4.6.0"
   }
 }

distribution/lib/Standard/Base/0.0.0-dev/package.yaml

@@ -10,22 +10,22 @@ maintainers:
     email: contact@enso.org
 component-groups:
   new:
-    - Input: { color: oklch(0.545 0.14 170) }
-    - Constants: { color: oklch(0.545 0.14 145) }
-    - Metadata: { color: oklch(0.545 0.14 120) }
-    - Output: { color: oklch(0.545 0.14 60) }
-    - Calculations: { color: oklch(0.545 0.14 230) }
-    - Statistics: { color: oklch(0.545 0.14 230) }
-    - Selections: { color: oklch(0.545 0.14 325) }
-    - Conversions: { color: oklch(0.545 0.14 40) }
-    - Values: { color: oklch(0.545 0.14 275) }
-    - Math: { color: oklch(0.545 0.14 300) }
-    - Rounding: { color: oklch(0.545 0.14 300) }
-    - Trigonometry: { color: oklch(0.545 0.14 300) }
-    - Random: { color: oklch(0.545 0.14 145) }
-    - Bitwise: { color: oklch(0.545 0.14 300) }
-    - Text: { color: oklch(0.545 0.14 290) }
-    - DateTime: { color: oklch(0.545 0.14 295) }
-    - Logical: { color: oklch(0.545 0.14 300) }
-    - Operators: { color: oklch(0.545 0.14 275) }
-    - Errors: { color: oklch(0.545 0.14 15) }
+    - Input: { color: oklch(0.464 0.14 170) }
+    - Constants: { color: oklch(0.464 0.14 145) }
+    - Metadata: { color: oklch(0.464 0.14 120) }
+    - Output: { color: oklch(0.464 0.14 60) }
+    - Calculations: { color: oklch(0.464 0.14 230) }
+    - Statistics: { color: oklch(0.464 0.14 230) }
+    - Selections: { color: oklch(0.464 0.14 325) }
+    - Conversions: { color: oklch(0.464 0.14 40) }
+    - Values: { color: oklch(0.464 0.14 275) }
+    - Math: { color: oklch(0.464 0.14 300) }
+    - Rounding: { color: oklch(0.464 0.14 300) }
+    - Trigonometry: { color: oklch(0.464 0.14 300) }
+    - Random: { color: oklch(0.464 0.14 145) }
+    - Bitwise: { color: oklch(0.464 0.14 300) }
+    - Text: { color: oklch(0.464 0.14 290) }
+    - DateTime: { color: oklch(0.464 0.14 295) }
+    - Logical: { color: oklch(0.464 0.14 300) }
+    - Operators: { color: oklch(0.464 0.14 275) }
+    - Errors: { color: oklch(0.464 0.14 15) }

distribution/lib/Standard/Base/0.0.0-dev/src/Data/Time/Date.enso

@@ -26,6 +26,7 @@ import project.Panic.Panic
 from project.Data.Boolean import Boolean, False, True
 from project.Data.Text.Extensions import all
 from project.Data.Time.Date_Time import ensure_in_epoch
+from project.Metadata import Display, Widget
 from project.Widget_Helpers import make_date_format_selector
 
 polyglot java import java.lang.ArithmeticException
@@ -95,9 +96,11 @@ type Date
          Get the local date of 5th August 1986.
 
              example_new = Date.new 1986 8 5
-
+    @year Widget.Numeric_Input
+    @month (Widget.Numeric_Input minimum=1 maximum=12)
+    @day make_day_picker
     new : Integer -> Integer -> Integer -> Date ! Time_Error
-    new year (month = 1) (day = 1) =
+    new year:Integer (month:Integer=1) (day:Integer=1) =
         Panic.catch JException (new_builtin year month day) caught->
             Error.throw (Time_Error.Error caught.payload.getMessage)
 
@@ -863,3 +866,13 @@ fits_in_range start end date =
 Date.from (that:JS_Object) =
     if that.get "type" == "Date" && ["year", "month", "day"].all that.contains_key then Date.new (that.get "year") (that.get "month") (that.get "day") else
         Error.throw (Illegal_Argument.Error "Invalid JS_Object for Date.from.")
+
+## PRIVATE
+private make_day_picker cache=Nothing =
+    year = cache.if_not_nothing <| cache "year"
+    month = cache.if_not_nothing <| cache "month"
+    days = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]
+    max = if month.is_nothing then 31 else
+        if month != 2 || year.is_nothing then days.at (month - 1) else
+            if Date.new year month 1 . is_leap_year then 29 else 28
+    Widget.Numeric_Input minimum=1 maximum=max