diff interfaces/AB.css @ 2768:789ce0944e4d

#162 #126. Redesigned AB to use flex-boxes
author Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk>
date Wed, 19 Apr 2017 11:22:43 +0100
parents 464c6c6692d6
children 1f9773f8a49b
line wrap: on
line diff
--- a/interfaces/AB.css	Wed Apr 19 10:59:49 2017 +0100
+++ b/interfaces/AB.css	Wed Apr 19 11:22:43 2017 +0100
@@ -2,6 +2,10 @@
     /* Set the background colour (note US English spelling) to grey*/
     background-color: #fff
 }
+div#feedbackHolder {
+    display: flex;
+    flex-direction: column;
+}
 div.pageTitle {
     width: auto;
     height: 20px;
@@ -34,13 +38,25 @@
     position: inherit;
     margin: 0px 5px;
 }
+div#box-holders {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    flex-wrap: wrap;
+}
+div#playback-holder{
+    float:none;
+}
 div.comparator-holder {
     width: 260px;
     height: 300px;
     border: black 1px solid;
-    float: left;
     padding-top: 5px;
     margin: 25px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
 }
 div.comparator-selector {
     width: 248px;
@@ -49,6 +65,7 @@
     position: relative;
     background-color: #FF0000;
     border-radius: 20px;
+    text-align: center;
 }
 div.disabled {
     background-color: #AAA;