Skip to content

Commit bda93b3

Browse files
committed
bug fixes, visuals
1 parent 63ce36c commit bda93b3

16 files changed

Lines changed: 258 additions & 345 deletions

File tree

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
sail
2+
/sail
13
.htaccess
24
.htaccess
35
server.js

about/css/index.css

Lines changed: 4 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
2-
31
#nav{
42
position: relative;
53
top: 0;
@@ -37,13 +35,9 @@ body{
3735
width: calc(100% - 60px);
3836
padding-bottom: 0px;
3937

40-
background: url("../../images/chalk.jpeg"); /*no-repeat center center fixed*/
41-
/*-webkit-background-size: cover;
42-
-moz-background-size: cover;
43-
-o-background-size: cover;
44-
background-size: cover;*/
38+
/*background: url("../../images/chalk.jpeg");*/
39+
background-image: linear-gradient(120deg, #444C86, #983434);
4540
}
46-
4741
#quote{
4842
text-align: center;
4943
font-family: 'Baron';
@@ -62,7 +56,8 @@ body{
6256
bottom: 0;
6357
left: 20%;
6458
background-color: transparent;
65-
margin-bottom: -4px;
59+
margin-bottom: -12px;
60+
margin-left: 0px;
6661
z-index: 1;
6762
}
6863

@@ -256,42 +251,6 @@ paper-button{
256251
text-align: center;
257252
}
258253

259-
260-
paper-toggle-button::shadow paper-radio-button::shadow #ink[checked] {
261-
color: #E74C3C;
262-
}
263-
264-
paper-toggle-button::shadow paper-radio-button::shadow #onRadio {
265-
background-color: #E74C3C;
266-
}
267-
268-
paper-toggle-button::shadow #toggleBar[checked] {
269-
background-color: #E74C3C;
270-
}
271-
272-
paper-toggle-button::shadow paper-radio-button::shadow #ink {
273-
color: #E74C3C;
274-
}
275-
276-
paper-toggle-button::shadow paper-radio-button::shadow #offRadio {
277-
border-color: #E74C3C;
278-
}
279-
280-
paper-toggle-button::shadow #toggleBar {
281-
background-color: #E74C3C;
282-
}
283-
284-
.tooltip{
285-
position: absolute;
286-
font-family: 'Roboto';
287-
text-align: center;
288-
padding: 10px;
289-
border-radius: 5px;
290-
background-color: #F1C40F;
291-
z-index: 2;
292-
color: #34495E;
293-
}
294-
295254
.hover-col{
296255
padding-bottom: 30px;
297256
}

about/images/old.gif

-1.69 MB
Binary file not shown.

about/images/record.gif

1.57 MB
Loading

about/index.html

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -57,24 +57,20 @@
5757
<h4 id="quote">Your code, set free</h4>
5858

5959
<svg id="svg2" style="width: 100%;height: 100%" width="1283px" height="617px" viewBox="0 0 1283 617" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
60-
<!-- Generator: Sketch 3.0.1 (7597) - http://www.bohemiancoding.com/sketch -->
61-
<title>Browser 2</title>
62-
<description>Created with Sketch.</description>
6360
<defs></defs>
6461
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
6562
<g id="Browser" sketch:type="MSLayerGroup">
6663
<path d="M6.99982428,0 C3.13392808,0 0,3.13457535 0,6.99369875 L0,55 L1283,55 L1283,6.99369875 C1283,3.13118559 1279.86693,0 1276.00018,0 L6.99982428,0 Z" id="background" fill="#D4D4D4" sketch:type="MSShapeGroup"></path>
6764
<circle id="object" fill="#E96E4C" sketch:type="MSShapeGroup" cx="25.5" cy="27.5" r="7.5"></circle>
6865
<path d="M48.5,35 C52.6421356,35 56,31.6421356 56,27.5 C56,23.3578644 52.6421356,20 48.5,20 C44.3578644,20 41,23.3578644 41,27.5 C41,31.6421356 44.3578644,35 48.5,35 Z" id="object" fill="#E6AA34" sketch:type="MSShapeGroup"></path>
6966
<circle id="object" fill="#85C33D" sketch:type="MSShapeGroup" cx="71.5" cy="27.5" r="7.5"></circle>
70-
<rect id="search" opacity="0.85" fill="#FFFFFF" sketch:type="MSShapeGroup" x="97" y="14" width="1172" height="27"></rect>
7167
<rect id="background" fill="#F5F5F5" sketch:type="MSShapeGroup" x="0" y="55" width="1283" height="562">
7268
</rect>
7369
</g>
7470
</g>
7571
</svg>
7672

77-
<img id="screen" src="images/web_record.gif">
73+
<img id="screen" src="images/record.gif">
7874

7975
</div>
8076

@@ -100,7 +96,7 @@ <h6 class="small code-light uppercase">Plus, it's free and open source, so you c
10096
<img class="icon" src="images/eye-black.png">
10197

10298
<h6 class="med black">Preview Your Work</h6>
103-
<h6 class="small gray">See how your code will look (HTML, PHP, and Markdown) and run (Javascript and Coffeescript) as you go.</h6>
99+
<h6 class="small gray">Preview and publish HTML, Markdown, and LaTex files and run Javascript and Coffeescript files.</h6>
104100

105101
</div>
106102

@@ -220,7 +216,6 @@ <h4 id="chart">A growing number of daily users</h4>
220216

221217
<script type="text/javascript" src="//apis.google.com/js/client.js?onload=loadDrive"></script>
222218

223-
<script src="../lib/chartist/libdist/chartist.min.js">
224219
</script>
225220
<script src="../lib/fit/fit.js"></script>
226221
<script src="js/index.js"></script>

about/js/index.js

Lines changed: 1 addition & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -22,44 +22,6 @@ $("#svg2").css("margin-bottom", up + "px");
2222
//$("h1").fitText();
2323
$("#logos").fitText();
2424

25-
26-
27-
function web(){
28-
29-
$("#screen").velocity({
30-
opacity: 0
31-
}, {
32-
duration: 500,
33-
complete: function(){
34-
$("#screen").attr("src","images/web_record.gif");
35-
$("#screen").css("width","80%");
36-
$("#screen").css("left","10%");
37-
38-
$("#screen").velocity({
39-
opacity: 1
40-
}, { duration: 500 });
41-
}
42-
});
43-
}
44-
45-
function mobile(){
46-
$("#screen").velocity({
47-
opacity: 0
48-
}, {
49-
duration: 500,
50-
complete: function(){
51-
$("#screen").attr("src","images/mobile.png");
52-
$("#screen").css("width","50%");
53-
$("#screen").css("left","25%");
54-
55-
$("#screen").velocity({
56-
opacity: 1
57-
}, { duration: 500 });
58-
}
59-
});
60-
}
61-
62-
6325
var ok = true;
6426

6527
/*******
@@ -186,26 +148,4 @@ function redirect(){
186148
}
187149
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
188150
ga('create', 'UA-47415821-1', 'codeyourcloud.com');
189-
ga('send', 'pageview');
190-
191-
192-
193-
//chart
194-
195-
/*
196-
var colors = ["#E74C3C", "#2ECC71", "#3498DB", "#9B59B6", "#E67E22", "#1ABC9C", "#34495E"];
197-
var color_index = 0;
198-
window.setInterval(function(){
199-
color_index++;
200-
if(color_index >= colors.length){
201-
color_index = color_index - colors.length;
202-
}
203-
204-
$("#main").velocity({
205-
backgroundColor: colors[color_index]
206-
},{
207-
duration: 700
208-
});
209-
}, 3000);
210-
*/
211-
151+
ga('send', 'pageview');

css/material.css

Lines changed: 151 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,155 @@
1+
.select-box{
2+
padding: 5px;
3+
display: block;
4+
height: 38px;
5+
}
6+
7+
.select-box > p{
8+
margin: 0;
9+
float: left;
10+
color: #d4cfc9;
11+
font-weight: 400;
12+
font-family: "Roboto";
13+
font-size: 15px;
14+
margin-top: 9px;
15+
}
16+
17+
.select-box > select{
18+
text-decoration: none;
19+
-webkit-appearance: none;
20+
background-color: transparent;
21+
border: 1px solid #555;
22+
-webkit-border-radius: 3px;
23+
-moz-border-radius: 3px;
24+
border-radius: 3px;
25+
width: 120px;
26+
-webkit-box-sizing: border-box;
27+
-moz-box-sizing: border-box;
28+
box-sizing: border-box;
29+
font-size: 12px;
30+
font-weight: 200;
31+
color: #606060;
32+
line-height: 34px;
33+
padding: 0 40px 0 15px;
34+
float: right;
35+
/* display: block; */
36+
text-decoration: none;
37+
z-index: 0;
38+
position: relative;
39+
margin: 0;
40+
}
41+
42+
.select-box > span{
43+
position: absolute;
44+
right: 22px;
45+
margin-top: 6px;
46+
color: #606060;
47+
}
48+
49+
.select-box > .check-switch{
50+
float: right;
51+
margin-top: 6px;
52+
}
53+
54+
.check-switch {
55+
display: inline-block;
56+
position: relative;
57+
cursor: pointer;
58+
-webkit-user-select: none;
59+
-moz-user-select: none;
60+
-ms-user-select: none;
61+
user-select: none;
62+
-webkit-tap-highlight-color: transparent;
63+
tap-highlight-color: transparent;
64+
}
65+
66+
.check-switch input {
67+
opacity: 0;
68+
position: absolute;
69+
}
70+
71+
.check-switch input + span {
72+
position: relative;
73+
display: inline-block;
74+
width: 1.65em;
75+
height: 1em;
76+
background: white;
77+
box-shadow: inset 0 0 0 0.0625em #e9e9e9;
78+
border-radius: 0.5em;
79+
vertical-align: -0.15em;
80+
transition: all 0.40s cubic-bezier(.17,.67,.43,.98);
81+
}
82+
83+
.check-switch:active input + span,
84+
.check-switch input + span:active {
85+
box-shadow: inset 0 0 0 0.73em #e9e9e9;
86+
}
87+
88+
.check-switch input + span:after {
89+
position: absolute;
90+
display: block;
91+
content: '';
92+
width: 0.875em;
93+
height: 0.875em;
94+
border-radius: 0.4375em;
95+
top: 0.0625em;
96+
left: 0.0625em;
97+
background: white;
98+
box-shadow: inset 0 0 0 0.03em rgba(0,0,0,0.1),
99+
0 0 0.05em rgba(0,0,0,0.05),
100+
0 0.1em 0.2em rgba(0,0,0,0.2);
101+
transition: all 0.25s ease-out;
102+
}
103+
104+
.check-switch:active input + span:after,
105+
.check-switch input + span:active:after {
106+
width: 1.15em;
107+
}
108+
109+
.check-switch input:checked + span {
110+
box-shadow: inset 0 0 0 0.73em #E74C3C;
111+
}
112+
113+
.check-switch input:checked + span:after {
114+
left: 0.7125em;
115+
}
116+
117+
.check-switch:active input:checked + span:after,
118+
.check-switch input:checked + span:active:after {
119+
left: 0.4375em;
120+
}
1121

122+
/* accessibility styles */
123+
.check-switch input:focus + span:after {
124+
box-shadow: inset 0 0 0 0.03em rgba(0,0,0,0.15),
125+
0 0 0.05em rgba(0,0,0,0.08),
126+
0 0.1em 0.2em rgba(0,0,0,0.3);
127+
background: #fff;
128+
}
129+
130+
.check-switch input:focus + span {
131+
box-shadow: inset 0 0 0 0.0625em #dadada;
132+
}
133+
134+
.check-switch input:focus:checked + span {
135+
box-shadow: inset 0 0 0 0.73em #E74C3C;
136+
}
137+
138+
/* reset accessibility style on hover */
139+
.check-switch:hover input:focus + span:after {
140+
box-shadow: inset 0 0 0 0.03em rgba(0,0,0,0.1),
141+
0 0 0.05em rgba(0,0,0,0.05),
142+
0 0.1em 0.2em rgba(0,0,0,0.2);
143+
background: #fff;
144+
}
145+
146+
.check-switch:hover input:focus + span {
147+
box-shadow: inset 0 0 0 0.0625em #e9e9e9;
148+
}
149+
150+
.check-switch:hover input:focus:checked + span {
151+
box-shadow: inset 0 0 0 0.73em #E74C3C;
152+
}
2153

3154
/*
4155
FROM MATERIALIZECSS.COM

0 commit comments

Comments
 (0)