-
- Pick an image to create new container.
-
-
-
+
+
+
+ Pick an image to create new container.
+
+
-
-
{title}
- {results}
-
+
+
+
{title}
+ {results}
diff --git a/styles/containers.less b/styles/containers.less
index 052b3d5c40..5fafe40909 100644
--- a/styles/containers.less
+++ b/styles/containers.less
@@ -23,10 +23,17 @@
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
- margin-top: 20px;
+ margin-top: 10px;
overflow: auto;
.image-item {
display: flex;
+ width: 320px;
+ height: 170px;
+ border-radius: 4px;
+ border: 1px solid @gray-lightest;
+ background-color: white;
+ margin-right: 20px;
+ margin-bottom: 20px;
.logo {
flex: 1 auto;
min-width: 90px;
@@ -113,22 +120,28 @@
bottom: 0px;
}
}
- width: 320px;
- height: 170px;
- border-radius: 4px;
- border: 1px solid @gray-lightest;
- background-color: white;
- margin-right: 20px;
- margin-bottom: 20px;
}
}
.new-container {
+ display: flex;
+ flex: 1 auto;
+ flex-direction: column;
padding: 35px 20px 32px 25px;
- .new-container-header {
- margin-bottom: 28px;
+ .results {
display: flex;
- flex: 1;
+ flex-direction: column;
+ flex: 1 auto;
+ .no-results {
+ flex: 1 auto;
+ display: flex;
+ align-items: center;
+ }
+ }
+ .new-container-header {
+ margin-bottom: 8px;
+ display: flex;
+ flex: 0 auto;
.text {
flex: 1 auto;
width: 50%;
diff --git a/styles/main.less b/styles/main.less
index 1c23e621c5..55c669b146 100644
--- a/styles/main.less
+++ b/styles/main.less
@@ -15,7 +15,6 @@ html, body {
height: 100%;
width: 100%;
overflow: hidden;
- -webkit-font-smoothing: antialiased;
-webkit-user-select: none;
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
diff --git a/styles/radial.less b/styles/radial.less
index 4e989d16f8..4f68f23bfc 100644
--- a/styles/radial.less
+++ b/styles/radial.less
@@ -12,12 +12,12 @@
.radial-progress {
&.radial-spinner {
- -webkit-animation: rotating 2.4s linear infinite;
+ -webkit-animation: rotating 1.6s linear infinite;
}
@circle-size: 140px;
@circle-background: #F2F2F2;
- @inset-size: 136px;
+ @inset-size: @circle-size - 4;
@inset-color: white;
@transition-length: 1s;
// @percentage-color: #3FD899;
@@ -28,7 +28,6 @@
width: @circle-size;
height: @circle-size;
- background-color: @circle-background;
border-radius: 100%;
.circle {
.mask, .fill, .shadow {