diff options
| author | Jules Laplace <jules@okfoc.us> | 2016-12-31 21:45:15 +0100 |
|---|---|---|
| committer | Jules Laplace <jules@okfoc.us> | 2016-12-31 21:45:15 +0100 |
| commit | 4f6d9d5e5f02f28ce12dbd5b432ecf43a939f8e1 (patch) | |
| tree | 300518b7a4ce8095b0e0cb07b1c7f0813564fa18 | |
| parent | 4157d6531b37c939eb86dd0c1d6df9a94394f329 (diff) | |
center
| -rw-r--r-- | studio-susie/index.js | 4 | ||||
| -rw-r--r-- | studio-susie/public/assets/css/css.css | 10 | ||||
| -rw-r--r-- | 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}} |