first commit

themes/honey/css/components/messages.css

@@ -0,0 +1,73 @@
+/*
+ * DO NOT EDIT THIS FILE.
+ * See the following change record for more information,
+ * https://www.drupal.org/node/2815083
+ * @preserve
+ */
+
+/**
+ * Messages.
+ *
+ */
+
+:root {
+  /*
+   * This is default Farmers market color scheme. It will be overriden when you change it in theme settings.
+   */
+  /* static colors */
+  /*
+   * Typography.
+   */ /* 1rem = 16px if font root is 100% ands browser defaults are used. */ /* ~64px */ /* ~48px */ /* ~32px */ /* ~24px */ /* ~20px */ /* 16px */ /* ~14px */ /* ~13px */ /* ~11px */
+  /**
+   * Spaces.
+   */ /* 4 * 16px = 64px */ /* 3 * 16px = 48px */ /* 2 * 16px = 32px */ /* 1 * 16px = 16px */ /* 0.75 * 16px = 12px */ /* 0.5 * 16px = 8px */ /* 0.25 * 16px = 4px */ /* 120 * 16px = 1920px */ /* 101.25 * 16px = 1620px */
+  /**
+   * Common.
+   */
+  /**
+   * Inputs.
+   */
+}
+
+.messages {
+  position: relative;
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+  padding: 2rem 2rem 2rem 6rem;
+  border-width: 3px;
+  border-style: solid;
+  border-radius: 1rem;
+  font-size: 1.5rem;
+}
+
+.messages--error {
+  color: #ff0000;
+  fill: #ff0000;
+  border-color: #ff0000;
+}
+
+.messages--status {
+  color: #712c1e;
+  fill: #712c1e;
+  border-color: #712c1e;
+}
+
+.messages--warning {
+  color: #db9e36;
+  fill: #db9e36;
+  border-color: #db9e36;
+}
+
+.messages__icon {
+  position: absolute;
+  top: 2rem;
+  left: 2rem;
+  width: 2rem;
+  height: 2rem;
+}
+
+@media screen and (min-width: 48rem) {
+  .messages__content {
+    margin-left: var(--messages__text-margin);
+  }
+}