Import the pebble dev site into devsite/

devsite/source/_sass/elements/form.scss

@@ -0,0 +1,115 @@
+/**
+ * Copyright 2025 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+.form__group {
+  display: table;
+  margin-bottom: 1em;
+  width: 100%;
+
+  input,
+  select,
+  textarea {
+    background-color: white;
+    border: 1px solid $gray-06;
+    border-left: none;
+    border-radius: 0 5px 5px 0;
+    color: $gray-02;
+    display: table-cell;
+    font-family: $sans-serif;
+    font-size: 15px;
+    margin: 0;
+    padding: 7px;
+    text-align: left;
+    width: 100%;
+
+    &.no-label {
+      border-radius: 5px;
+    }
+
+    &:focus {
+      box-shadow: none;
+      outline: none;
+    }
+  }
+
+  textarea {
+    text-align: left;
+    margin-bottom: -5px;
+  }
+
+  select {
+    height: 2em;
+  }
+
+  .select-style {
+    background-color: white;
+    border-radius: 0 5px 5px 0;
+    border: 1px solid $gray-06;
+    border-left-width: 0;
+    color: transparentize(#444, 0.5);
+    display: table-cell;
+    font-family: $sans-serif;
+    font-size: 15px;
+    margin: 0;
+    overflow: hidden;
+    padding: 3px 7px;
+    text-align: left;
+    width: 100%;
+
+    select {
+      -webkit-appearance: none;
+      background-image: none;
+      background: transparent;
+      border: none;
+      box-shadow: none;
+      padding: 5px 8px;
+      width: 130%;
+    }
+
+    select:focus {
+      outline: none;
+    }
+    
+    &.no-label {
+      border-left-width: 1px;
+    }
+  }
+
+  label {
+    background-color: #fff;
+    border: 1px solid $gray-06;
+    border-right: none;
+    border-radius: 5px 0 0 5px;
+    color: #111;
+    display: table-cell;
+    font-size: 14px;
+    font-weight: 400;
+    margin: 0;
+    padding: 7px 10px;
+    vertical-align: top;
+    white-space: nowrap;
+    width: 25%;
+  }
+
+  input.mce_inline_error {
+    background-color: lighten($dark-red, 40);
+    border: 1px solid $dark-red;
+  }
+}
+
+input[type="submit"] {
+  cursor: pointer;
+}