Browse Source

Introduce Sass Compilation

Maximilian Korndörfer 4 years ago
parent
commit
326ecf20f9

+ 6
- 6
css/assets/_iconfont.scss View File

@@ -1,11 +1,11 @@
1 1
 @font-face {
2 2
   font-family: 'icomoon';
3
-  src:  url('fonts/icomoon.eot?4wup98');
4
-  src:  url('fonts/icomoon.eot?4wup98#iefix') format('embedded-opentype'),
5
-    url('fonts/icomoon.woff2?4wup98') format('woff2'),
6
-    url('fonts/icomoon.ttf?4wup98') format('truetype'),
7
-    url('fonts/icomoon.woff?4wup98') format('woff'),
8
-    url('fonts/icomoon.svg?4wup98#icomoon') format('svg');
3
+  src:  font-url('icomoon.eot?4wup98');
4
+  src:  font-url('icomoon.eot?4wup98#iefix') format('embedded-opentype'),
5
+    font-url('icomoon.woff2?4wup98') format('woff2'),
6
+    font-url('icomoon.ttf?4wup98') format('truetype'),
7
+    font-url('icomoon.woff?4wup98') format('woff'),
8
+    font-url('icomoon.svg?4wup98#icomoon') format('svg');
9 9
   font-weight: normal;
10 10
   font-style: normal;
11 11
 }

+ 8
- 8
css/assets/_jquery-ui.scss View File

@@ -1065,31 +1065,31 @@ a.ui-button:active,
1065 1065
 }
1066 1066
 .ui-icon,
1067 1067
 .ui-widget-content .ui-icon {
1068
-	background-image: url("images/ui-icons_444444_256x240.png");
1068
+	background-image: image-url("jquery-ui-icons/ui-icons_444444_256x240.png");
1069 1069
 }
1070 1070
 .ui-widget-header .ui-icon {
1071
-	background-image: url("images/ui-icons_444444_256x240.png");
1071
+	background-image: image-url("jquery-ui-icons/ui-icons_444444_256x240.png");
1072 1072
 }
1073 1073
 .ui-state-hover .ui-icon,
1074 1074
 .ui-state-focus .ui-icon,
1075 1075
 .ui-button:hover .ui-icon,
1076 1076
 .ui-button:focus .ui-icon {
1077
-	background-image: url("images/ui-icons_555555_256x240.png");
1077
+	background-image: image-url("jquery-ui-icons/ui-icons_555555_256x240.png");
1078 1078
 }
1079 1079
 .ui-state-active .ui-icon,
1080 1080
 .ui-button:active .ui-icon {
1081
-	background-image: url("images/ui-icons_ffffff_256x240.png");
1081
+	background-image: image-url("jquery-ui-icons/ui-icons_ffffff_256x240.png");
1082 1082
 }
1083 1083
 .ui-state-highlight .ui-icon,
1084 1084
 .ui-button .ui-state-highlight.ui-icon {
1085
-	background-image: url("images/ui-icons_777620_256x240.png");
1085
+	background-image: image-url("jquery-ui-icons/ui-icons_777620_256x240.png");
1086 1086
 }
1087 1087
 .ui-state-error .ui-icon,
1088 1088
 .ui-state-error-text .ui-icon {
1089
-	background-image: url("images/ui-icons_cc0000_256x240.png");
1089
+	background-image: image-url("jquery-ui-icons/ui-icons_cc0000_256x240.png");
1090 1090
 }
1091 1091
 .ui-button .ui-icon {
1092
-	background-image: url("images/ui-icons_777777_256x240.png");
1092
+	background-image: image-url("jquery-ui-icons/ui-icons_777777_256x240.png");
1093 1093
 }
1094 1094
 
1095 1095
 /* positioning */
@@ -1309,4 +1309,4 @@ a.ui-button:active,
1309 1309
 .ui-widget-shadow {
1310 1310
 	-webkit-box-shadow: 0px 0px 5px #666666;
1311 1311
 	box-shadow: 0px 0px 5px #666666;
1312
-}
1312
+}

+ 0
- 8
css/main.css
File diff suppressed because it is too large
View File


+ 0
- 1
css/main.scss View File

@@ -31,7 +31,6 @@
31 31
 @import "layout/_justifize.scss";
32 32
 @import "layout/_buttons-layout.scss";
33 33
 
34
-
35 34
 //UI
36 35
 @import "ui/_alert.scss";
37 36
 @import "ui/_alert-popup.scss";

+ 31
- 16
css/settings/_global-variables.scss View File

@@ -1,41 +1,56 @@
1
+//Make paths of assets variable
2
+$base-path: "" !default;
3
+$font-path: $base-path + "fonts/" !default;
4
+$img-path: "../img/" !default;
5
+
6
+$slick-loader-path: $base-path;
7
+@function image-url($url) {
8
+  @return url($img-path + $url);
9
+}
10
+
11
+@function font-url($url) {
12
+  @return url($font-path + $url);
13
+  
14
+}
15
+
1 16
 // FONT STACKS
2 17
 
3 18
 @font-face {
4 19
 	font-family: 'Margot';
5
-	src: url('fonts/Margot-Regular.eot');
6
-	src: url('fonts/Margot-Regular.eot?#iefix') format('embedded-opentype'),
7
-		url('fonts/Margot-Regular.woff') format('woff'),
8
-		url('fonts/Margot-Regular.ttf') format('truetype');
20
+	src: font-url('Margot-Regular.eot');
21
+	src: font-url('Margot-Regular.eot?#iefix') format('embedded-opentype'),
22
+		font-url('Margot-Regular.woff') format('woff'),
23
+		font-url('Margot-Regular.ttf') format('truetype');
9 24
 	font-weight: normal;
10 25
 	font-style: normal;
11 26
 }
12 27
 
13 28
 @font-face {
14 29
 	font-family: 'Margot';
15
-	src: url('fonts/Margot-BoldItalic.eot');
16
-	src: url('fonts/Margot-BoldItalic.eot?#iefix') format('embedded-opentype'),
17
-		url('fonts/Margot-BoldItalic.woff') format('woff'),
18
-		url('fonts/Margot-BoldItalic.ttf') format('truetype');
30
+	src: font-url('Margot-BoldItalic.eot');
31
+	src: font-url('Margot-BoldItalic.eot?#iefix') format('embedded-opentype'),
32
+		font-url('Margot-BoldItalic.woff') format('woff'),
33
+		font-url('Margot-BoldItalic.ttf') format('truetype');
19 34
 	font-weight: bold;
20 35
 	font-style: italic;
21 36
 }
22 37
 
23 38
 @font-face {
24 39
 	font-family: 'Margot';
25
-	src: url('fonts/Margot-Bold.eot');
26
-	src: url('fonts/Margot-Bold.eot?#iefix') format('embedded-opentype'),
27
-		url('fonts/Margot-Bold.woff') format('woff'),
28
-		url('fonts/Margot-Bold.ttf') format('truetype');
40
+	src: font-url('Margot-Bold.eot');
41
+	src: font-url('Margot-Bold.eot?#iefix') format('embedded-opentype'),
42
+		font-url('Margot-Bold.woff') format('woff'),
43
+		font-url('Margot-Bold.ttf') format('truetype');
29 44
 	font-weight: bold;
30 45
 	font-style: normal;
31 46
 }
32 47
 
33 48
 @font-face {
34 49
 	font-family: 'Margot';
35
-	src: url('fonts/Margot-RegularItalic.eot');
36
-	src: url('fonts/Margot-RegularItalic.eot?#iefix') format('embedded-opentype'),
37
-		url('fonts/Margot-RegularItalic.woff') format('woff'),
38
-		url('fonts/Margot-RegularItalic.ttf') format('truetype');
50
+	src: font-url('Margot-RegularItalic.eot');
51
+	src: font-url('Margot-RegularItalic.eot?#iefix') format('embedded-opentype'),
52
+		font-url('Margot-RegularItalic.woff') format('woff'),
53
+		font-url('Margot-RegularItalic.ttf') format('truetype');
39 54
 	font-weight: normal;
40 55
 	font-style: italic;
41 56
 }

+ 1
- 1
css/ui/_happenings.scss View File

@@ -1,5 +1,5 @@
1 1
 .happenings {
2
-	background:url(../img/dashboard/happenings-bg.jpg) no-repeat;
2
+	background:image-url('dashboard/happenings-bg.jpg') no-repeat;
3 3
 	background-color: rgb(54, 182, 217);
4 4
 	background-blend-mode: multiply;
5 5
 	background-position: center;

+ 5
- 5
css/ui/_lightbox.scss View File

@@ -1,6 +1,6 @@
1 1
 /* Preload img/lightbox */
2 2
 body:after {
3
-  content: url(../img/lightbox/close.png) url(../img/lightbox/loading.gif) url(../img/lightbox/prev.png) url(../img/lightbox/next.png);
3
+  content: image-url('lightbox/close.png') image-url('lightbox/loading.gif') image-url('lightbox/prev.png') image-url('lightbox/next.png');
4 4
   display: none;
5 5
 }
6 6
 
@@ -78,7 +78,7 @@ body.lb-disable-scrolling {
78 78
   width: 32px;
79 79
   height: 32px;
80 80
   margin: 0 auto;
81
-  background: url(../img/lightbox/loading.gif) no-repeat;
81
+  background: image-url('lightbox/loading.gif') no-repeat;
82 82
 }
83 83
 
84 84
 .lb-nav {
@@ -109,7 +109,7 @@ body.lb-disable-scrolling {
109 109
   width: 34%;
110 110
   left: 0;
111 111
   float: left;
112
-  background: url(../img/lightbox/prev.png) left 48% no-repeat;
112
+  background: image-url('lightbox/prev.png') left 48% no-repeat;
113 113
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
114 114
   opacity: 0;
115 115
   -webkit-transition: opacity 0.6s;
@@ -127,7 +127,7 @@ body.lb-disable-scrolling {
127 127
   width: 64%;
128 128
   right: 0;
129 129
   float: right;
130
-  background: url(../img/lightbox/next.png) right 48% no-repeat;
130
+  background: image-url('lightbox/next.png') right 48% no-repeat;
131 131
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
132 132
   opacity: 0;
133 133
   -webkit-transition: opacity 0.6s;
@@ -195,7 +195,7 @@ body.lb-disable-scrolling {
195 195
   float: right;
196 196
   width: 30px;
197 197
   height: 30px;
198
-  background: url(../img/lightbox/close.png) top right no-repeat;
198
+  background: image-url('lightbox/close.png') top right no-repeat;
199 199
   text-align: right;
200 200
   outline: none;
201 201
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);

+ 4
- 4
css/ui/_questionnaires-intro.scss View File

@@ -1,6 +1,6 @@
1 1
 .questionnaires-intro {
2 2
     background-color: $midblue;
3
-    background-image: url(../img/questionnaires/pattern-logo.svg);
3
+    background-image: image-url('questionnaires/pattern-logo.svg');
4 4
     background-repeat: repeat;
5 5
     background-position: center;
6 6
     overflow: hidden;
@@ -66,7 +66,7 @@
66 66
                 @include breakpoint(desktop) {
67 67
                     font-size: toem(44px);
68 68
                 }
69
-            } 
69
+            }
70 70
             
71 71
             h3 {
72 72
                 font-size: toem(20px);
@@ -176,7 +176,7 @@
176 176
                 outline: none !important;
177 177
             }
178 178
         }
179
-            
179
+        
180 180
         @include breakpoint(tablet) {
181 181
             margin: 30px auto 0;
182 182
             padding: 0 70px;
@@ -198,4 +198,4 @@
198 198
             }
199 199
         }
200 200
     }
201
-}
201
+}

+ 1
- 1
css/ui/_user-profile.scss View File

@@ -1,5 +1,5 @@
1 1
 .user-profile {
2
-    background: url(../img/banner/dashboard.jpg) no-repeat;
2
+    background: image-url('banner/dashboard.jpg') no-repeat;
3 3
     background-position: center;
4 4
     background-size: cover;
5 5
     -webkit-background-size: cover;

css/images/ui-icons_444444_256x240.png → img/jquery-ui-icons/ui-icons_444444_256x240.png View File


css/images/ui-icons_555555_256x240.png → img/jquery-ui-icons/ui-icons_555555_256x240.png View File


css/images/ui-icons_777620_256x240.png → img/jquery-ui-icons/ui-icons_777620_256x240.png View File


css/images/ui-icons_777777_256x240.png → img/jquery-ui-icons/ui-icons_777777_256x240.png View File


css/images/ui-icons_cc0000_256x240.png → img/jquery-ui-icons/ui-icons_cc0000_256x240.png View File


css/images/ui-icons_ffffff_256x240.png → img/jquery-ui-icons/ui-icons_ffffff_256x240.png View File


Loading…
Cancel
Save