From 4f6d9d5e5f02f28ce12dbd5b432ecf43a939f8e1 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Sat, 31 Dec 2016 21:45:15 +0100
Subject: center

---
 studio-susie/index.js                  |  4 +++-
 studio-susie/public/assets/css/css.css | 10 +++++++---
 studio-susie/templates/index.liquid    |  2 +-
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/studio-susie/index.js b/studio-susie/index.js
index bb338e0..9ff7a74 100644
--- a/studio-susie/index.js
+++ b/studio-susie/index.js
@@ -31,8 +31,10 @@ var app = okcms.createApp({
     painting: {
       id: {type: 'string', hidden: true},
       title: {type: 'string'},
+      center: {type: 'flag'},
       image: {type: 'image'},
-      body: {type: 'text'},
+      date: {type: 'string'},
+      description: {type: 'string'},
     },
     page: {
       id: {type: 'string', hidden: true},
diff --git a/studio-susie/public/assets/css/css.css b/studio-susie/public/assets/css/css.css
index a1cfe52..15ebedb 100644
--- a/studio-susie/public/assets/css/css.css
+++ b/studio-susie/public/assets/css/css.css
@@ -33,16 +33,20 @@ h1, h2 {
 .section {
   background-size: cover;
   background-repeat: no-repeat;
-  background-position: 0% 0%;
+  background-position: top left;
+  transform: translateZ(0);
   transition: all 0.6s cubic-bezier(0,0,0,1);
 }
+.section.center {
+  background-position: center center;
+}
 .mobile .section {
   background-size: contain;
 }
 .section.zoomed {
-  transform: scale(0.8);
+  transform: translateZ(0) scale(0.8);
   background-size: contain;
-  background-position: 50% 50%;
+  background-position: center center;
 }
 .plaque {
   position: absolute;
diff --git a/studio-susie/templates/index.liquid b/studio-susie/templates/index.liquid
index c31c37f..63bb53f 100644
--- a/studio-susie/templates/index.liquid
+++ b/studio-susie/templates/index.liquid
@@ -105,7 +105,7 @@
 
 <div id="fullpage">
 {% for painting in paintings %}
-  <div class="section {% if painting.contain %}contain{% endif %}" data-image="{{ painting.image.uri }}">
+  <div class="section {% if painting.center %}center{% endif %}" data-image="{{ painting.image.uri }}">
     {% unless painting.title contains "IMG" %}
       <div class="plaque">
         <b>{{painting.title}}</b>{% if painting.date %}, {{painting.date}}.{% endif %} {{painting.description}}
-- 
cgit v1.2.3-70-g09d2