summaryrefslogtreecommitdiffstats
path: root/src/styles/image-upload.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/styles/image-upload.scss')
-rw-r--r--src/styles/image-upload.scss47
1 files changed, 43 insertions, 4 deletions
diff --git a/src/styles/image-upload.scss b/src/styles/image-upload.scss
index 764bb3158..06176a7af 100644
--- a/src/styles/image-upload.scss
+++ b/src/styles/image-upload.scss
@@ -1,9 +1,12 @@
1.image-upload { 1.image-upload {
2 position: absolute; 2 position: absolute;
3 width: 100px; 3 width: 140px;
4 height: 100px; 4 height: 140px;
5 border-radius: $theme-border-radius; 5 border: 1px solid $theme-gray-lighter;
6 border-radius: $theme-border-radius-small;
7 background: $theme-gray-lightest;
6 overflow: hidden; 8 overflow: hidden;
9 margin-top: 5px;
7 10
8 &__preview, 11 &__preview,
9 &__action { 12 &__action {
@@ -19,7 +22,7 @@
19 background-size: 100%; 22 background-size: 100%;
20 background-repeat: no-repeat; 23 background-repeat: no-repeat;
21 background-position: center center; 24 background-position: center center;
22 margin: 5px; 25 border-radius: 3px;
23 } 26 }
24 27
25 &__action { 28 &__action {
@@ -27,6 +30,8 @@
27 z-index: 10; 30 z-index: 10;
28 opacity: 0; 31 opacity: 0;
29 transition: opacity 0.5s; 32 transition: opacity 0.5s;
33 display: flex;
34 justify-content: center;
30 35
31 &-background { 36 &-background {
32 position: absolute; 37 position: absolute;
@@ -41,6 +46,33 @@
41 button { 46 button {
42 position: relative; 47 position: relative;
43 z-index: 100; 48 z-index: 100;
49 color: #FFF;
50
51 .mdi {
52 color: #FFF;
53 }
54 }
55 }
56
57 &__dropzone {
58 text-align: center;
59 border-radius: 5px;
60 padding: 10px;
61 display: flex;
62 align-items: center;
63 justify-content: center;
64 flex-direction: column;
65 }
66
67 &__dropzone,
68 button {
69 .mdi {
70 margin-bottom: 5px;
71 }
72
73 p {
74 font-size: 10px;
75 line-height: 10px;
44 } 76 }
45 } 77 }
46 78
@@ -49,4 +81,11 @@
49 opacity: 1; 81 opacity: 1;
50 } 82 }
51 } 83 }
84}
85
86.image-upload-wrapper {
87 .mdi {
88 font-size: 40px;
89 color: $theme-gray-light;
90 }
52} \ No newline at end of file 91} \ No newline at end of file