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/communications/contacts/style/app.css

@@ -0,0 +1,627 @@
+/* ROOT */
+
+/* Global */
+html {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  font-size: 62.5%;
+  overflow: hidden;
+  position: relative;
+  background-color: white;
+  -moz-user-select: none;
+}
+
+body {
+  color: #fff;
+  font-size: 1.6rem;
+  line-height: 2.2rem;
+  text-align: center;
+  vertical-align: middle;
+}
+
+/* Text conventions */
+h1, h2, h3, h4, h5, h6 {
+  margin: 0;
+  padding: 0;
+  font-weight: normal;
+}
+
+ul, ol, dl, dt, dd {
+  padding: 0;
+  margin: 0;
+  list-style-type: none;
+}
+
+p, li {
+  word-wrap: break-word;
+  margin: 0;
+  padding: 0;
+}
+
+q {
+  quotes: none;
+  display: block;
+}
+
+pre, blockquote {
+  padding: 0;
+  margin: 0;
+}
+
+em {
+  font-style: italic;
+}
+
+address {
+  font-style: normal;
+  display: inline;
+}
+
+abbr, acronym {
+  cursor: default;
+  border: none;
+}
+
+strong {
+  font-weight: bold;
+}
+
+b {
+  font-weight: 600;
+}
+
+small {
+  font-size: 1.1rem;
+  line-height: 1rem;
+  color: #999;
+}
+
+/* Links */
+a {
+  text-decoration: none;
+  outline: none;
+  color: #333;
+}
+
+a:hover {
+  text-decoration: none;
+}
+
+a img {
+  border: none;
+}
+
+a abbr {
+  cursor: pointer;
+}
+
+/* Icons */
+span.icon {
+  font-style: normal;
+}
+
+span.icon + b, span.icon + span {
+  vertical-align: middle;
+}
+
+/* Tables */
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  width: 100%;
+}
+
+td {
+  vertical-align: top;
+}
+
+caption, th {
+  text-align: start;
+}
+
+caption {
+  text-indent: -9999rem;
+  width: 0;
+  height: 0;
+  overflow: hidden;
+}
+
+/* Forms */
+form {
+  margin: 0;
+}
+
+input:focus, textarea:focus {
+  outline: none;
+}
+
+textarea {
+  resize: none;
+  overflow: auto;
+  height: 4.6rem;
+}
+
+[contenteditable] {
+  outline: none;
+  word-wrap: break-word;
+}
+
+/* Media */
+img {
+  display: block;
+  padding: 0;
+  margin: 0;
+  width: 100%;
+}
+
+img:-moz-broken {
+  line-height: 1.1rem;
+  overflow: hidden;
+}
+
+/* HTML 5 */
+article, aside, details, figcaption, figure, footer, header, hgroup,
+menu, nav, section, video, audio, canvas, progress, meter, time {
+  display: block;
+  padding: 0;
+  margin: 0;
+}
+
+/* APP */
+/* view */
+
+.view {
+  position: absolute;
+  overflow: hidden;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  transform: translate(0, 0);
+}
+
+.view:not(.view-noscroll) {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+
+.view-right {
+  transform: translateX(100%);
+}
+
+.view-bottom {
+  transform: translateY(100%);
+}
+
+/* Rewritting from buttons.css */
+section[role="region"] > gaia-header button,
+section[role="region"] > gaia-header a {
+  white-space: normal;
+}
+
+/* Buttons inside list redefinition */
+li button span {
+  font-size: 0;
+}
+
+li button span[data-l10n-id] {
+  font-size: 1.6rem;
+}
+
+/* Extending components */
+li button.activity > b em {
+  color: #727272;
+  font-style: normal;
+}
+
+[data-type="list"] li p {
+  margin-inline-start: 1.5rem;
+}
+
+/* BB Lists extending */
+
+#view-contacts-list [data-type="list"] {
+  /**
+   * BiDi note:
+   * the non-symmetrical padding accomodates the A-Z scrollbar,
+   * which is always on the right edge of the screen
+   */
+  padding: 2.5rem 3.5rem 0 1.5rem; /* BiDi-proof */
+}
+
+[data-type="list"] gaia-header {
+  padding: 0;
+  padding-inline-start: 1.5rem;
+  position: sticky;
+  top: -1.5rem;
+  background: #FFF;
+  z-index: 2;
+}
+
+[data-type="list"].active li:after {
+  offset-inline-end: 0;
+}
+
+/* JS helper */
+[data-type="list"] li p,
+[data-type="list"] li aside {
+  pointer-events: none;
+}
+
+[data-type="list"] li aside.pack-end {
+  margin: 0;
+  margin-inline-end: 1rem;
+}
+
+/* Selection tag extended from shared/style/buttons.css */
+.view-select-tag .selection-list li button {
+  background-color: #fff;
+}
+
+.view-select-tag .selection-list li button.icon-selected:before {
+  background: transparent url(gphx/bitmap/default/lists/tick.png) no-repeat center center / 2rem;
+}
+
+#custom-tag {
+  margin-bottom: 2rem;
+}
+
+/* Body */
+.view-body {
+  position: relative;
+  height: calc(100% - 5rem);
+}
+
+#view-screenshot.contact-list > #view-screenshot-body {
+  position: relative;
+  height: 100%;
+  width: 100%;
+  background: -moz-element(#view-contacts-list);
+}
+
+.view-body-inner {
+  overflow-x: hidden;
+  overflow-y: auto;
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  z-index: 5;
+  width: 100%;
+  box-sizing: border-box;
+  background: #fff;
+  color: #333;
+  text-align: start;
+  will-change: scroll-position;
+}
+
+/* Removes scroll from the view body inner */
+.view-noscroll .view-body-inner {
+  width: calc(100% + 1.5rem);
+}
+
+/* STACK: inline block list items; */
+.stack {
+  letter-spacing: -0.4rem;
+  text-align: center;
+}
+
+.stack > li {
+  display: inline-block;
+  vertical-align: middle;
+  letter-spacing: 0;
+}
+
+/* ICONS */
+
+span.icon {
+  font-size: 0;
+  background: transparent no-repeat center center;
+  background-size: 100% auto;
+  display: inline-block;
+}
+
+/* GENERIC BUTTONS */
+span.icon.icon-delete {
+  background-image: url(/contacts/style/gphx/bitmap/default/forms/delete.png);
+  background-size: 3rem;
+  width: 3rem;
+}
+
+span.icon.icon-addimage {
+  background-image: url(/contacts/style/gphx/bitmap/default/forms/add.png);
+  background-size: 3rem;
+  width: 7rem;
+  height: 3rem;
+}
+
+span.icon.icon-address {
+  background-image: url(/contacts/style/gphx/bitmap/default/buttons/location.png);
+}
+
+li button.icon-link:before {
+  background-image: url(/contacts/style/gphx/bitmap/default/buttons/link.png);
+}
+
+li button.icon-share:before {
+  background-image: url(/contacts/style/gphx/bitmap/default/buttons/share.png);
+}
+
+/* Extending icons */
+li button.icon-fav:before {
+  background-image: url(/contacts/style/images/icon-fav-button-off.png);
+  offset-inline-end: 0.5rem;
+}
+
+li button.icon-fav.on:before {
+  background-image: url(/contacts/style/images/icon-fav-button-on.png);
+}
+
+li button.icon-fb-profile:before {
+  background-image: url(/contacts/style/gphx/bitmap/default/buttons/fb_profile.png);
+}
+
+li button.icon-add:before {
+  background-image: url(/contacts/style/images/Add_button.png);
+  offset-inline-start: 0.2rem
+}
+
+li button.icon-find-and-merge:before {
+  background-image: url(/contacts/style/images/findandmerge.png);
+  background-size: 3rem;
+}
+
+/* Block type (long text) */
+.action-block {
+  height: auto;
+  min-height: 4rem;
+  word-wrap: normal;
+}
+.action-block b {
+  display: block;
+  overflow: hidden;
+  line-height: 1.4em;
+}
+.action-block span {
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* FILL FLOW: general components for helping in defining basic flows in forms; */
+.fill-flow {
+  padding-inline-end: 0;
+}
+
+/* ROW: horizontal separation for elements; */
+.fillflow-row {
+  position: relative;
+}
+
+.fillflow-left {
+  margin-inline-end: 0.7rem;
+}
+
+.fillflow-twocols {
+  overflow: hidden;
+}
+
+.fillflow-twocols button {
+  width: calc(50% - 0.5rem);
+}
+html[dir="ltr"] .fillflow-twocols button { float: left; }
+html[dir="rtl"] .fillflow-twocols button { float: right; }
+
+html[dir="ltr"] .fillflow-twocols button:last-child { float: right; }
+html[dir="rtl"] .fillflow-twocols button:last-child { float: left; }
+
+/* ROW ACTION */
+.fillflow-row-action {
+  position: absolute;
+  offset-inline-end: 0;
+  top: 0;
+  width: auto;
+  height: auto;
+  padding-top: 0;
+}
+
+.fillflow-row-action span.icon {
+  border: none;
+  margin: 0;
+  height: 3.8rem;
+}
+
+/* MEDIA: specific ratio used in forms; */
+.fillflow-media {
+  margin: 0;
+  margin-inline-end: 1rem;
+  margin-bottom: 0.5rem;
+  width: 7rem;
+  height: 7rem;
+  position: relative;
+  z-index: 0;
+  border: 1px solid #c7c7c7;
+  background-color: #fff;
+  border-radius: 7rem;
+  box-sizing: border-box;
+}
+
+.fillflow-media:active {
+  color: #fff;
+  background: rgba(105,230,255,0.5);
+}
+
+.fillflow-media.with-photo:active {
+  background: none;
+}
+
+.fillflow-media p {
+  position: absolute;
+  margin: 0;
+  padding: 0;
+  offset-inline-start: -1.5rem;
+  top: 2rem;
+  text-align: center;
+  z-index: -1;
+  width: 10rem;
+}
+
+.fillflow-media p em {
+  display: block;
+  color: #858585;
+  font-size: 1.1rem;
+  font-weight: normal;
+  font-style: italic;
+  margin-top: 1.8rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.fillflow-media .edit-photo {
+  z-index: 1;
+  display: none;
+  pointer-events: none;
+  margin-top: 3.6rem;
+}
+
+.with-photo .edit-photo {
+  display: block;
+}
+
+.fillflow-media #photo-button {
+  width: 100%;
+  height: 100%;
+  background: none;
+  line-height: inherit;
+  padding: 0;
+}
+
+.fillflow-media img {
+  width: 100%;
+  height: 100%;
+  background: #fff no-repeat center center;
+  background-size: cover;
+}
+
+/* We don't need a delete button on the first section */
+.fillflow-media .img-delete-button {
+  display: none;
+}
+
+#thumbnail-action {
+  margin: 0 1.5rem 0.5rem 1.5rem;
+}
+
+/* JUMPER */
+
+nav[data-type="scrollbar"] {
+  z-index: 6;
+}
+
+nav[data-type="scrollbar"].selecting {
+  bottom: 4.2rem;
+}
+
+nav[data-type="scrollbar"] ol > li > * {
+  pointer-events: none;
+}
+
+#groups-container.selecting {
+  height: calc(100% - 7rem);
+}
+
+.contact-checkbox {
+  offset-inline-start: 0 !important;
+  display: none !important;
+}
+
+.contact-checkbox-selecting {
+  display: block !important;
+}
+
+/* FB contacts will be disabled when adding .disable-fb-items to contact list */
+.disable-fb-items li[data-fb-uid] {
+  color: #333333;
+  opacity: 0.25;
+  pointer-events: none;
+}
+
+/* This makes the checkbox appear unchecked when using .disable-fb-items */
+.disable-fb-items li[data-fb-uid] label span:after {
+  background-position: center top;
+}
+
+#groups-list.selecting .group-section li,
+#search-list.selecting li {
+  padding-inline-start: 2rem;
+}
+
+form[role="dialog"].no-overlay {
+  background: none;
+  pointer-events: none;
+  position: fixed;
+}
+
+form[role="dialog"].no-overlay button {
+  pointer-events: auto;
+}
+
+#selectable-form {
+  background: none;
+}
+
+#groups-list[data-type="list"].active.selecting li:not(:active):after {
+  display:none !important;
+}
+
+#import-settings button {
+  margin: 1.5rem;
+  width: calc(100% - 3rem);
+}
+
+#contact-list-ice {
+  padding-inline-start: 1rem
+}
+
+#contact-list-ice li {
+  display: flex;
+  align-items: baseline;
+}
+
+#contact-list-ice span {
+  width: 3rem;
+  height: 3rem;
+  background: url('/contacts/style/images/icon_ice.png') no-repeat 0 0 / 3rem auto transparent;
+}
+
+#groups-list.selecting #contact-list-ice {
+  display:none;
+}
+
+#ice-list {
+  min-height: 100%;
+  background: #FFF;
+  text-align: start;
+}
+
+.ice-contact {
+  font-size: 1.6rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 24rem;
+}
+/* .ice-contact is a <bdi> */
+html[dir="ltr"] .ice-contact { text-align: left; }
+html[dir="rtl"] .ice-contact { text-align: right; }
+
+#contacts-form-notes textarea {
+  height: 9rem;
+}
+
+#search-list li.contact-item {
+  -moz-user-select: none;
+  text-align: start;
+}

gaia/apps/communications/contacts/style/fb/dialog.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="9" height="9" viewBox="0 0 9 9"><path fill="#ACBEE4" d="M9 0v9h-9"/></svg>

gaia/apps/communications/contacts/style/fb_extensions.css

@@ -0,0 +1,84 @@
+#iframe_extensions {
+  position: fixed;
+  top: 100%;
+  left: 0;
+  z-index: 1000;
+  width: 100%;
+  height: 100%;
+  border: 0;
+  margin: 0;
+  padding: 0;
+  transition: transform .6s ease;
+  background: #f4f4f4;
+}
+
+#iframe_extensions.opening {
+  transform: translateY(-100%);
+}
+
+#iframe_extensions.hidden {
+  visibility: hidden;
+}
+
+/* FB info (non-editable) */
+.view-edit-contact .facebook fieldset legend,
+.view-edit-contact .facebook fieldset input[type="date"] {
+  border-color: #acbee4;
+  color: #8d9abb;
+  background-image: url(fb/dialog.svg);
+}
+
+.view-edit-contact .facebook input {
+  border-color: #acbee4;
+  color: #8d9abb;
+}
+
+.view-edit-contact .facebook span {
+  color: #8d9abb;
+}
+
+.view-edit-contact .facebook fieldset input[value=""] {
+  display: none;
+}
+
+.with-photo.facebook img {
+  pointer-events: auto;
+  opacity: 0.95;
+}
+
+.with-photo.facebook {
+  padding-inline-end: 0;
+}
+
+/* XXX BiDi warning */
+html[dir="ltr"] .with-photo.facebook .edit-photo  { right: 0; }
+html[dir="rtl"] .with-photo.facebook .edit-photo  { right: -1.5rem; }
+
+#settingsFb li p {
+  margin-inline-start: 0;
+}
+
+#settings-article[data-state="fb-disabled"] #settingsFb,
+#settings-article[data-state="fb-disabled"] #fb-header  {
+  display: none;
+}
+
+#settingsFb[data-state="logged-out"] > #fb-update-option > #import-fb,
+#settingsFb[data-state="logged-out"] > #fb-update-option > #renew-pwd-msg,
+#settingsFb[data-state="logged-in"]  > #fb-update-option > #renew-pwd-msg {
+  display: none;
+}
+
+#settingsFb[data-state="renew-pwd"] > #fb-update-option > #import-fb:before {
+  background-image: url(/contacts/style/images/error_icon.png);
+}
+
+#settingsFb[data-state="logged-in"] > #fb-update-option > #import-fb:before {
+  background-image: url(/contacts/style/images/sync_icon.png);
+}
+
+#no-connection {
+  white-space: normal;
+  margin-top: 1rem;
+}
+