Skip to content

Commit 29aece6

Browse files
committed
create sample webpage
1 parent bf60a08 commit 29aece6

10 files changed

Lines changed: 344 additions & 5 deletions

File tree

docs/INDEX.md

Lines changed: 0 additions & 3 deletions
This file was deleted.

docs/favicon.ico

237 KB
Binary file not shown.

docs/images/gears-1236578_1920.jpg

573 KB
Loading

docs/images/open_flow_org.svg

Lines changed: 21 additions & 0 deletions
Loading
Lines changed: 9 additions & 0 deletions
Loading

docs/images/white/open_flow.svg

Lines changed: 29 additions & 0 deletions
Loading
Lines changed: 30 additions & 0 deletions
Loading

docs/images/white/open_rpa.svg

Lines changed: 97 additions & 0 deletions
Loading

docs/index.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,13 @@
66
<link rel="stylesheet" type="text/css" href="style.css">
77
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,300i|Quicksand" rel="stylesheet">
88
<link rel="shortcut icon" href="favicon.ico" />
9-
<title> OpenRPA and OpenFlow </title>
9+
<title>OpenFlow</title>
1010
</head>
1111

1212
<body>
1313
<div class="page">
1414
<header>
1515
<div class="logo"><img src="images/open_flow_org.svg"><div class="name">Open Flow</div></div>
16-
1716
<div class="payoff">Make the most of your resources!</div>
1817
</header>
1918
<main>

docs/style.css

Lines changed: 157 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,157 @@
1+
body {
2+
font-family: 'Open Sans', sans-serif;
3+
margin: 0;
4+
5+
6+
}
7+
8+
.page{
9+
display: flex;
10+
flex-direction: column;
11+
background-image: url(images/gears-1236578_1920.jpg);
12+
background-size: cover;
13+
min-height: 100vh;
14+
15+
}
16+
header{
17+
width: 100%;
18+
padding: 30px 20px 70px;
19+
box-sizing: border-box;
20+
background-color: #1b1b33;
21+
clip-path: polygon(
22+
0 0,
23+
100% 0%,
24+
100% calc(100% - 6vw),
25+
0% 100%
26+
);
27+
margin-bottom: -6vw;
28+
}
29+
main {
30+
flex-grow: 2;
31+
display: flex;
32+
flex-direction: column;
33+
clip-path: polygon(
34+
6w 0,
35+
100% 0,
36+
100% 100%,
37+
0% 100%
38+
);
39+
}
40+
.product1{
41+
background: linear-gradient(to right, rgba(3,119,148,0.9), rgba(87,69,147,0.9));
42+
flex-grow: 1;
43+
padding-top: 6vw;
44+
clip-path: polygon(
45+
0 6vw,
46+
100% 0%,
47+
100% 100%,
48+
0% calc(100% - 6vw)
49+
);
50+
padding: 3vw 10vw;
51+
display: flex;
52+
flex-direction: row;
53+
justify-content: flex-end;
54+
}
55+
.product2 {
56+
background: linear-gradient(to left, rgba(3,119,148,0.9), rgba( 55,167,74,0.9));
57+
flex-grow: 1;
58+
margin-top: -6vw;
59+
clip-path: polygon(
60+
0 0,
61+
100% 6vw,
62+
100% calc(100% - 6vw),
63+
0% 100%
64+
);
65+
padding: 3vw 10vw;
66+
display: flex;
67+
flex-direction: row;
68+
justify-content: flex-start;
69+
}
70+
footer {
71+
background-color: #1b1b33;
72+
color: rgba(255,255,255,0.5);
73+
margin-top: -6vw;
74+
padding: 0.7vw 20px 10px 20px;
75+
font-size: 11px;
76+
clip-path: polygon(
77+
0 6vw,
78+
100% 0%,
79+
100% 100%,
80+
0% 100%
81+
);
82+
display: flex;
83+
align-content: flex-end;
84+
justify-content: flex-end;
85+
}
86+
h2{
87+
font-family: 'Quicksand', sans-serif;
88+
margin-bottom: 0.5em;
89+
}
90+
h4{
91+
margin-bottom: 0.3em;
92+
font-weight: bold;
93+
}
94+
p {
95+
margin-top: 0.5em;
96+
margin-bottom: 0.5em;
97+
}
98+
.logo{
99+
text-align: center;
100+
margin: 10px;
101+
}
102+
.logo img {
103+
max-width: 40px;
104+
margin-right: 10px
105+
}
106+
.name {
107+
color: #ffffff;
108+
font-size: 36px;
109+
font-family: 'Quicksand', sans-serif;
110+
display: inline-block;
111+
vertical-align: 0.15em;
112+
}
113+
.payoff {
114+
color: #ffffff;
115+
text-align: center;
116+
font-style: italic;
117+
font-size: 24px;
118+
color: rgba(255,255,255,0.5);
119+
}
120+
.description {
121+
width: 80vw;
122+
max-width: 480px;
123+
color: #ffffff;
124+
margin-top:10px;
125+
margin-bottom: 20px;
126+
}
127+
.product_logo{
128+
margin-bottom: 10px;
129+
display: inline-block;
130+
margin-right: 10px;
131+
}
132+
.product_logo img {
133+
width: 30px;
134+
}
135+
.product_name{
136+
display: inline-block;
137+
vertical-align: 0.15em;
138+
}
139+
140+
.button {
141+
border: 1px solid #ffffff;
142+
border-radius: 16px;
143+
color:#ffffff;
144+
text-decoration: none;
145+
padding: 3px 15px 4px;
146+
margin: 5px 0;
147+
cursor: pointer;
148+
display: inline-block;
149+
}
150+
.button:hover{
151+
background-color: #ffffff;
152+
color: #1b1b33;
153+
}
154+
.company-info{
155+
text-align: right;
156+
padding-bottom: 10px;
157+
}

0 commit comments

Comments
 (0)