Publish Vulpes Preview 15 sources for desktop, Android and Tundra

Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.

gaia/apps/camera/style/settings.css

@@ -0,0 +1,235 @@
+
+.settings {
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+  width: 100%;
+  height: 100%;
+  font-size: 1.6rem;
+  color: #FFF;
+  background: rgba(0,0,0,0.85);
+  overflow: hidden;
+  opacity: 1;
+  transition: opacity 150ms linear, visibility 0s;
+  visibility: visible;
+  will-change: opacity;
+}
+
+.settings.hidden {
+  opacity: 0;
+  visibility: hidden;
+  transition-delay: 0s, 150ms;
+}
+
+/**
+ * COMPLEX
+ *
+ * The camera app has fixed rotation,
+ * this means that when the orientation of the
+ * device changes, the application doesn't rotate.
+ *
+ * Although the settings menu must rotate. This
+ * means we need to use CSS transforms to reposition
+ * the settings menu so that it appears rotate with
+ * the orientation of the device.
+ *
+ */
+
+/**
+ * @deg90
+ */
+
+.deg90 .settings {
+  width: 100vh;
+  height: 100vw;
+  transform:
+    rotate(270deg)
+    translate(-100%, 0);
+  transform-origin: 0 0;
+}
+
+/**
+ * @deg180
+ */
+
+.deg180 .settings {
+  transform: rotate(180deg);
+}
+
+/**
+ * @deg270
+ */
+
+.deg270 .settings {
+  width: 100vh;
+  height: 100vw;
+  transform:
+    rotate(90deg)
+    translate(0px, -100vw);
+  transform-origin: 0 0;
+}
+
+/** Pane
+ ---------------------------------------------------------*/
+
+.pane {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  padding: 0 1.5rem;
+}
+
+.pane > .inner {
+  height: 100%;
+}
+
+/**
+ * @deg90
+ */
+
+.deg90 .pane > .inner {
+  padding-right: 7rem;
+}
+
+/**
+ * @deg270
+ */
+
+.deg270 .pane > .inner {
+  padding-left: 7rem;
+}
+
+/** Pane 1
+ ---------------------------------------------------------*/
+
+/**
+ * [show-pane=2]
+ */
+
+[show-pane=pane-2] .pane-1 {
+  transform: translateX(-100%);
+  visibility: hidden;
+}
+
+/** Pane 2
+ ---------------------------------------------------------*/
+
+.pane-2 {
+  transform: translateX(100%);
+  visibility: hidden;
+}
+
+/**
+ * [show-pane=2]
+ */
+
+[show-pane=pane-2] .pane-2 {
+  transform: translateX(0);
+  visibility: visible;
+}
+
+/** Inner
+ ---------------------------------------------------------*/
+
+.settings_inner {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+/** Header
+ ---------------------------------------------------------*/
+
+/**
+ * 1. Space it out from under the
+ *    setting menu button.
+ */
+
+.settings_header {
+  position: relative;
+  height: 9rem;
+  margin-right: 5rem; /* 1 */
+  line-height: 9rem;
+}
+
+/** Title
+ ---------------------------------------------------------*/
+
+/**
+ * 1. In case of the title being longer than the header
+ *    we show ellipsis and prevent line wrapping
+ */
+.settings_title {
+  padding: 0 1.5rem 0 3rem;
+  font-size: 2.4rem;
+  font-weight: 300;
+  font-style: italic;
+  line-height: 9rem;
+  color: rgba(255,255,255,0.8);
+  pointer-events: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap; /* 1 */
+}
+
+/**
+ * [dir=rtl]
+ */
+
+[dir="rtl"] .settings_title {
+  text-align: center;
+}
+
+/** Items
+ ---------------------------------------------------------*/
+
+.settings_items {
+  flex: 1;
+  overflow: scroll;
+}
+
+/** Close
+ ---------------------------------------------------------*/
+
+/**
+ * @extends .hud a
+ */
+
+.settings_close {
+  position: absolute;
+  top: 0; right: 0;
+  margin: 0;
+  border-width: 2rem 1.5rem;
+  background-color: #008eab;
+}
+
+/**
+ * @deg90,
+ * @deg270
+ */
+
+.deg90 .settings_close,
+.deg270 .settings_close {
+  border-width: 1.5rem 2rem;
+}
+
+/**
+ * @deg90
+ */
+
+.deg90 .settings_close {
+  top: auto;
+  bottom: 0;
+}
+
+/**
+ * @deg270
+ */
+
+.deg270 .settings_close {
+  right: auto;
+  left: 0;
+}