Skip to content

Commit bbb6ac3

Browse files
commit which done in airplane on 10668meters above sea level
1 parent 7900032 commit bbb6ac3

File tree

6 files changed

+294
-28
lines changed

6 files changed

+294
-28
lines changed

composer.json

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,11 +45,26 @@
4545
"css-compiler": [
4646
{
4747
"format": "compact",
48+
"force": true,
49+
"input": [
50+
"tests/shared-fixtures/scss"
51+
],
52+
"output": "var/cache/assets/scss.css"
53+
},
54+
{
55+
"format": "compact",
56+
"force": true,
4857
"input": [
49-
"tests/shared-fixtures/scss",
5058
"tests/shared-fixtures/sass"
5159
],
52-
"output": "var/cache/assets/app.css"
60+
"output": "var/cache/assets/sass.css"
61+
},
62+
{
63+
"format": "compact",
64+
"input": [
65+
"tests/shared-fixtures/compass/app.scss"
66+
],
67+
"output": "var/cache/assets/compass.css"
5368
}
5469
]
5570
}

src/Container/File.php

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,10 @@
66

77
class File
88
{
9-
const TYPE_SCSS = 'scss';
10-
const TYPE_SASS = 'sass';
11-
const TYPE_LESS = 'less';
9+
const TYPE_SCSS = 'scss';
10+
const TYPE_SASS = 'sass';
11+
const TYPE_COMPASS = 'compass';
12+
const TYPE_LESS = 'less';
1213
/**
1314
* @var string
1415
*/
@@ -113,6 +114,9 @@ private function detectSourceTypeFromPath(string $path)
113114
case 0 !== preg_match('/^.*\.' . static::TYPE_SASS . '/', $path):
114115
$this->type = static::TYPE_SASS;
115116
break;
117+
case 0 !== preg_match('/^.*\.' . static::TYPE_COMPASS . '/', $path):
118+
$this->type = static::TYPE_COMPASS;
119+
break;
116120
case 0 !== preg_match('/^.*\.' . static::TYPE_LESS . '/', $path):
117121
$this->type = static::TYPE_LESS;
118122
break;

src/Processor/Processor.php

Lines changed: 24 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,10 @@
1111

1212
class Processor
1313
{
14-
const TYPE_SCSS = 'scss';
14+
const TYPE_SCSS = 'scss';
1515
const TYPE_COMPASS = 'scss';
16-
const TYPE_SASS = 'sass';
17-
const TYPE_LESS = 'less';
16+
const TYPE_SASS = 'sass';
17+
const TYPE_LESS = 'less';
1818
/**
1919
* @var IOInterface
2020
*/
@@ -23,15 +23,31 @@ class Processor
2323
* @var File[]
2424
*/
2525
private $files = [];
26+
/**
27+
* @var SASSCompiler
28+
*/
29+
private $sass;
30+
/**
31+
* @var LESSCompiler
32+
*/
33+
private $less;
34+
/**
35+
* @var CompassCompiler
36+
*/
37+
private $compass;
2638

2739
public function __construct(IOInterface $io)
2840
{
2941
$this->io = $io;
42+
$this->initCompilers();
3043
}
3144

32-
public function resetFiles()
45+
protected function initCompilers()
3346
{
34-
$this->files = [];
47+
$this->less = new LESSCompiler();
48+
$this->sass = new SASSCompiler();
49+
/** attaches compass functionality to the SASS compiler */
50+
$this->compass = new CompassCompiler($this->sass);
3551
}
3652

3753
public function attachFiles(string $inputPath, string $outputPath)
@@ -111,27 +127,18 @@ public function processFiles(string $formatter)
111127
// throw new \InvalidArgumentException('available options are: xxx');
112128
// }
113129

114-
$lessCompiler = new LESSCompiler();
115-
// $lessCompiler->setFormatter()
116-
$sassCompiler = new SASSCompiler();
117-
$sassCompiler->setFormatter($formatter);
118-
119-
/** attaches compass functionality to the SASS compiler */
120-
new CompassCompiler($sassCompiler);
121-
122130
foreach ($this->files as $file) {
123131
$this->io->write("processing file: {$file->getSourcePath()}");
124132
$file->setSourceContentFromSourcePath();
125133

126134
switch ($file->getType()) {
135+
case static::TYPE_COMPASS:
127136
case static::TYPE_SCSS:
128-
$content = $sassCompiler->compile($file->getSourceContent());
129-
break;
130137
case static::TYPE_SASS:
131-
$content = $sassCompiler->compile($file->getSourceContent());
138+
$content = $this->sass->compile($file->getSourceContent());
132139
break;
133140
case static::TYPE_LESS:
134-
$content = $lessCompiler->compile($file->getSourceContent());
141+
$content = $this->less->compile($file->getSourceContent());
135142
break;
136143
default:
137144
throw new CompilerException('unknown compiler');

tests/shared-fixtures/app.scss renamed to tests/shared-fixtures/compass/app.scss

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,10 @@
77

88
/* @import "compass/reset"; */
99

10-
@import "compass";
11-
@import "layout";
12-
@import "layout-loading-animation";
13-
14-
@import "game";
15-
@import "game-results";
10+
@import "compass/reset";
11+
@import "sass/layout";
12+
@import "sass/layout-loading-animation";
13+
//@import "layout-loading-animation";
14+
//
15+
//@import "game";
16+
//@import "game-results";
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
.loading-animation {
2+
position: relative;
3+
width: 57px;
4+
5+
span {
6+
animation: loading-animation 1.5s infinite ease-in-out;
7+
background: #9b59b6;
8+
bottom: 0;
9+
display: block;
10+
height: 5px;
11+
position: absolute;
12+
width: 9px;
13+
14+
&:nth-child(2) {
15+
animation-delay: .2s;
16+
left: 11px;
17+
}
18+
19+
&:nth-child(3) {
20+
animation-delay: .4s;
21+
left: 22px;
22+
}
23+
24+
&:nth-child(4) {
25+
animation-delay: .6s;
26+
left: 33px;
27+
}
28+
29+
&:nth-child(5) {
30+
animation-delay: .8s;
31+
left: 44px;
32+
}
33+
34+
}
35+
}
36+
37+
@keyframes loading-animation {
38+
0% {
39+
height: 5px;
40+
transform: translateY(0px);
41+
background: #9b59b6;
42+
}
43+
25% {
44+
height: 30px;
45+
transform: translateY(15px);
46+
background: #3498db;
47+
}
48+
50% {
49+
height: 5px;
50+
transform: translateY(0px);
51+
background: #9b59b6;
52+
}
53+
100% {
54+
height: 5px;
55+
transform: translateY(0px);
56+
background: #9b59b6;
57+
}
58+
}
Lines changed: 181 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,181 @@
1+
body {
2+
height: 100%;
3+
color: #333;
4+
font-family: 'Lato', sans-serif;
5+
font-size: 16px;
6+
line-height: 1.42857;
7+
/*background: linear-gradient(135deg, #99aaa0 0%,#d197b3 33%,#e5c2c4 65%,#76588c 100%) center center / cover fixed; !* W3C *!*/
8+
/*background: linear-gradient(135deg, rgba(15,11,11,1) 0%,rgba(234,132,7,1) 100%) center center / cover fixed; !* W3C *!*/
9+
/*background: linear-gradient(135deg, rgba(173,28,52,1) 0%, rgba(237,211,220,1) 100%) center center / cover fixed; !* W3C *! */
10+
/*background: linear-gradient(to bottom, rgba(135,224,253,1) 0%,rgba(83,203,241,1) 40%,rgba(5,171,224,1) 100%) center center / cover fixed;*/
11+
12+
background: linear-gradient(to bottom, rgb(32, 23, 99) 0%, rgb(31, 19, 95) 40%, #a94442 100%) center center / cover fixed;
13+
14+
& > .container {
15+
width: 100%;
16+
height: 100%;
17+
padding: 0;
18+
margin: 0;
19+
}
20+
}
21+
22+
.page-sidebar,
23+
.page-content {
24+
transition: all 0.5s ease;
25+
color: #fff;
26+
}
27+
28+
.page-sidebar {
29+
position: fixed;
30+
height: 100%;
31+
left: 0;
32+
z-index: 1000;
33+
overflow-y: auto;
34+
/*background: linear-gradient(to bottom, #b26cab 0%,#765c8b 100%); !* W3C *!*/
35+
background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(255, 255, 255, 0) 100%);
36+
border-right: 1px solid #fff;
37+
}
38+
39+
.page-sidebar,
40+
.sidebar-nav > li {
41+
width: 250px;
42+
}
43+
44+
.page-sidebar.toggled {
45+
width: 0;
46+
}
47+
48+
.page-content {
49+
padding-left: 275px;
50+
51+
&.toggled {
52+
padding-left: 25px;
53+
54+
.toggle-btn {
55+
opacity: 1;
56+
}
57+
}
58+
&:not(.toggled) .toggle-btn {
59+
opacity: 0;
60+
}
61+
}
62+
63+
.toggle-btn {
64+
cursor: pointer;
65+
}
66+
67+
.page-header {
68+
font-size: 24px;
69+
margin: 0;
70+
padding: 40px 0 0 20px;
71+
72+
&,
73+
& > span {
74+
line-height: 32px;
75+
height: 75px;
76+
}
77+
78+
}
79+
80+
.sidebar-nav {
81+
list-style-type: none;
82+
padding: 0;
83+
margin: 0;
84+
85+
& > li {
86+
&.sidebar-brand span {
87+
float: right;
88+
padding-right: 10px;
89+
}
90+
91+
&:not(.sidebar-brand) {
92+
padding: 10px 15px;
93+
font-size: 16px;
94+
text-align: right;
95+
text-transform: uppercase;
96+
background: transparent;
97+
clear: both;
98+
}
99+
}
100+
101+
& > li.selected,
102+
& > li:not(.sidebar-brand):not(.no-hover):hover {
103+
background: #fff;
104+
color: #000;
105+
}
106+
& > li:not(.sidebar-brand):not(.selected):hover {
107+
cursor: pointer;
108+
}
109+
}
110+
111+
.page-content:not(.toggled) .toggle-btn {
112+
opacity: 0;
113+
}
114+
115+
.page-loading {
116+
background: rgba(2, 2, 2, 0.5);
117+
z-index: 10002;
118+
width: 100%;
119+
height: 100%;
120+
position: absolute;
121+
122+
& > .loading-animation {
123+
margin: auto;
124+
top: 50%;
125+
zoom: 4;
126+
}
127+
}
128+
129+
.no-scroll-mode {
130+
position: fixed;
131+
}
132+
133+
#notification-area {
134+
width: calc(100% - 50px);
135+
border: 1px solid;
136+
min-height: 100px;
137+
position: absolute;
138+
border-radius: 10px;
139+
140+
font-size: 72px;
141+
z-index: 1;
142+
text-align: center;
143+
font-style: italic;
144+
}
145+
146+
#notification-area > .notification-control {
147+
float: right;
148+
margin: 10px;
149+
font-size: 24px;
150+
151+
&:hover {
152+
font-weight: bolder;
153+
cursor: pointer;
154+
}
155+
}
156+
157+
#modal-area {
158+
color: #000;
159+
h4, label {
160+
text-transform: uppercase;
161+
}
162+
163+
.help-block {
164+
font-size: 14px;
165+
font-style: italic;
166+
}
167+
}
168+
169+
.container-fluid {
170+
padding-left: 0;
171+
padding-right: 0;
172+
padding-bottom: 25px;
173+
}
174+
175+
.pagination-area {
176+
text-align: center;
177+
}
178+
179+
a.history-title {
180+
color: #F5DEB3;
181+
}

0 commit comments

Comments
 (0)