Skip to content

Commit 8419a89

Browse files
amarantha-kamarantha-k
authored
Merge pull request #3 from rakeshAlgo/landing-page-ui
All landing page UI styling completed
2 parents 22921f2 + d4843b9 commit 8419a89

30 files changed

+1889
-216
lines changed

‎package-lock.json‎

Lines changed: 377 additions & 99 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@
3939
"gulp-vinyl-zip": "~2.2",
4040
"handlebars": "~4.4",
4141
"highlight.js": "~9.15",
42-
"jquery": "~3.4",
42+
"jquery": "^3.4.1",
4343
"js-yaml": "~3.13",
4444
"mark.js": "~8.11",
4545
"merge-stream": "~2.0",
@@ -57,5 +57,8 @@
5757
"typeface-roboto-mono": "0.0.54",
5858
"vinyl-buffer": "~1.0",
5959
"vinyl-fs": "~3.0"
60+
},
61+
"dependencies": {
62+
"jsdom": "^16.2.2"
6063
}
6164
}

‎preview-src/landing-page-core-concept.adoc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
= Couchbase Tutorials
1+
= Couchbase Core Concept
22
:page-layout: landing-page-core-concept
33
:page-role: tiles
44
:!sectids:

‎preview-src/landing-page-sdk.adoc‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
= Couchbase SDK
2+
:page-layout: landing-page-sdk
3+
:page-role: tiles
4+
:!sectids:

‎preview-src/landing-page-tutorials.adoc‎

Lines changed: 264 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,264 @@
1+
= Couchbase Tutorials
2+
:page-layout: landing-page-tutorials
3+
:page-role: tiles
4+
:!sectids:
5+
6+
7+
[.column]
8+
[.data-filter-column]
9+
====== {empty}
10+
++++
11+
<div data-level="advanced" data-category="advanced java swift javascript developer" class="sub-heading two-column-heading">
12+
<h3 class="text-color-brand-blue-secondary">Lorem ipsum</h3>
13+
<div class="filter-info">
14+
<h5 >
15+
<img src="_/img/landing-page-icon/advanced-icon.svg" alt="" />
16+
Advanced</h5>
17+
<span data-role="advanced">Developer</span>
18+
</div>
19+
</div>
20+
++++
21+
[.content]
22+
23+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras accumsan mi a ligula imperdiet, et cursus lectus bibendum. Etiam metus magna, dapibus vitae ipsum vel, sollicitudin interdum metus. Phasellus quis rutrum enim. Vivamus euismod sem nec posuere accumsan. Praesent elementum lectus vitae magna pellentesque, a facilisis risus pulvinar. Donec scelerisque porttitor aliquet.
24+
25+
++++
26+
<div class="other-info-list">
27+
++++
28+
29+
[.box]
30+
[.link]
31+
32+
* xref:#[Lorem ipsum]
33+
* xref:#[Lorem ipsum]
34+
* xref:#[Lorem ipsum]
35+
36+
[.box]
37+
[.component]
38+
39+
.Component
40+
* Lorem ipsum
41+
* Lorem ipsum
42+
* Lorem ipsum
43+
44+
[.box]
45+
[.languages]
46+
47+
.Languages
48+
* Java
49+
* Swift
50+
* Javascript
51+
52+
++++
53+
</div>
54+
++++
55+
56+
57+
58+
[.column]
59+
[.data-filter-column]
60+
====== {empty}
61+
++++
62+
<div data-level="intermediate" data-category="intermediate c# node Python devOps" class="sub-heading two-column-heading">
63+
<h3 class="text-color-brand-blue-secondary">Lorem ipsum</h3>
64+
<div class="filter-info">
65+
<h5 >
66+
<img src="_/img/landing-page-icon/intermediate-icon.svg" alt="" />
67+
Intermediate</h5>
68+
<span>DevOps</span>
69+
</div>
70+
</div>
71+
++++
72+
[.content]
73+
74+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras accumsan mi a ligula imperdiet, et cursus lectus bibendum. Etiam metus magna, dapibus vitae ipsum vel, sollicitudin interdum metus. Phasellus quis rutrum enim. Vivamus euismod sem nec posuere accumsan. Praesent elementum lectus vitae magna pellentesque, a facilisis risus pulvinar. Donec scelerisque porttitor aliquet.
75+
76+
++++
77+
<div class="other-info-list">
78+
++++
79+
80+
[.box]
81+
82+
* xref:#[Lorem ipsum]
83+
* xref:#[Lorem ipsum]
84+
85+
86+
[.box]
87+
.Component
88+
* Lorem ipsum
89+
90+
[.box]
91+
.Languages
92+
* C#
93+
* Node
94+
* Python
95+
96+
++++
97+
</div>
98+
++++
99+
100+
[.column]
101+
[.data-filter-column]
102+
====== {empty}
103+
++++
104+
<div data-level="intermediate" data-category="intermediate .net developer" class="sub-heading two-column-heading">
105+
<h3 class="text-color-brand-blue-secondary">Lorem ipsum</h3>
106+
<div class="filter-info">
107+
<h5 >
108+
<img src="_/img/landing-page-icon/intermediate-icon.svg" alt="" />
109+
Intermediate</h5>
110+
<span>Developer</span>
111+
</div>
112+
</div>
113+
++++
114+
[.content]
115+
116+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras accumsan mi a ligula imperdiet, et cursus lectus bibendum. Etiam metus magna, dapibus vitae ipsum vel, sollicitudin interdum metus. Phasellus quis rutrum enim. Vivamus euismod sem nec posuere accumsan. Praesent elementum lectus vitae magna pellentesque, a facilisis risus pulvinar. Donec scelerisque porttitor aliquet.
117+
118+
++++
119+
<div class="other-info-list">
120+
++++
121+
122+
[.box]
123+
124+
* xref:#[Lorem ipsum]
125+
* xref:#[Lorem ipsum]
126+
127+
128+
[.box]
129+
.Component
130+
* Lorem ipsum
131+
* Lorem ipsum
132+
133+
[.box]
134+
.Languages
135+
* .NET
136+
137+
++++
138+
</div>
139+
++++
140+
141+
[.column]
142+
[.data-filter-column]
143+
====== {empty}
144+
++++
145+
<div data-level="beginner" data-category="beginner ascidoc java php architect" class="sub-heading two-column-heading">
146+
<h3 class="text-color-brand-blue-secondary">Lorem ipsum</h3>
147+
<div class="filter-info">
148+
<h5 >
149+
<img src="_/img/landing-page-icon/beginner-icon.svg" alt="" />
150+
Beginner</h5>
151+
<span>Architect</span>
152+
</div>
153+
</div>
154+
++++
155+
[.content]
156+
157+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras accumsan mi a ligula imperdiet, et cursus lectus bibendum. Etiam metus magna, dapibus vitae ipsum vel, sollicitudin interdum metus. Phasellus quis rutrum enim. Vivamus euismod sem nec posuere accumsan. Praesent elementum lectus vitae magna pellentesque, a facilisis risus pulvinar. Donec scelerisque porttitor aliquet.
158+
159+
++++
160+
<div class="other-info-list">
161+
++++
162+
163+
[.box]
164+
165+
* xref:#[Lorem ipsum]
166+
167+
[.box]
168+
.Component
169+
* Lorem ipsum
170+
* Lorem ipsum
171+
* Lorem ipsum
172+
173+
[.box]
174+
.Languages
175+
* AsciiDoc
176+
* Java
177+
* PHP
178+
179+
++++
180+
</div>
181+
++++
182+
183+
[.column]
184+
[.data-filter-column]
185+
====== {empty}
186+
++++
187+
<div data-level="intermediate" data-category="intermediate react developer" class="sub-heading two-column-heading">
188+
<h3 class="text-color-brand-blue-secondary">Lorem ipsum</h3>
189+
<div class="filter-info">
190+
<h5 >
191+
<img src="_/img/landing-page-icon/intermediate-icon.svg" alt="" />
192+
Intermediate</h5>
193+
<span>Developer</span>
194+
</div>
195+
</div>
196+
++++
197+
[.content]
198+
199+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras accumsan mi a ligula imperdiet, et cursus lectus bibendum. Etiam metus magna, dapibus vitae ipsum vel, sollicitudin interdum metus. Phasellus quis rutrum enim. Vivamus euismod sem nec posuere accumsan. Praesent elementum lectus vitae magna pellentesque, a facilisis risus pulvinar. Donec scelerisque porttitor aliquet.
200+
201+
++++
202+
<div class="other-info-list">
203+
++++
204+
205+
[.box]
206+
207+
* xref:#[Lorem ipsum]
208+
* xref:#[Lorem ipsum]
209+
210+
[.box]
211+
.Component
212+
* Lorem ipsum
213+
* Lorem ipsum
214+
* Lorem ipsum
215+
216+
[.box]
217+
.Languages
218+
* React
219+
220+
++++
221+
</div>
222+
++++
223+
224+
[.column]
225+
[.data-filter-column]
226+
====== {empty}
227+
++++
228+
<div data-level="advanced" data-category="advanced angular react vue architect" class="sub-heading two-column-heading">
229+
<h3 class="text-color-brand-blue-secondary">Lorem ipsum</h3>
230+
<div class="filter-info">
231+
<h5 >
232+
<img src="_/img/landing-page-icon/advanced-icon.svg" alt="" />
233+
Advanced</h5>
234+
<span>Architect</span>
235+
</div>
236+
</div>
237+
++++
238+
[.content]
239+
240+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras accumsan mi a ligula imperdiet, et cursus lectus bibendum. Etiam metus magna, dapibus vitae ipsum vel, sollicitudin interdum metus. Phasellus quis rutrum enim. Vivamus euismod sem nec posuere accumsan. Praesent elementum lectus vitae magna pellentesque, a facilisis risus pulvinar. Donec scelerisque porttitor aliquet.
241+
242+
++++
243+
<div class="other-info-list">
244+
++++
245+
246+
[.box]
247+
248+
* xref:#[Lorem ipsum]
249+
250+
[.box]
251+
.Component
252+
* Lorem ipsum
253+
* Lorem ipsum
254+
* Lorem ipsum
255+
256+
[.box]
257+
.Languages
258+
* Angular
259+
* React
260+
* Vue
261+
262+
++++
263+
</div>
264+
++++

‎preview-src/landing-page.adoc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
= Couchbase Tutorials
1+
= Couchbase Adoc
22
:page-layout: landing-page
33
:page-role: tiles
44
:!sectids:

‎src/css/body.css‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@ div.body {
33
display: flex;
44
margin-top: var(--height-to-body);
55
/* overflow-wrap: break-word; */
6-
word-wrap: break-word; /* IE only supports word-wrap, which is an alias of overflow-wrap */
6+
word-wrap: break-word;
7+
/* IE only supports word-wrap, which is an alias of overflow-wrap */
78
}
89

910
/* A selector that could possibly be re-used */
@@ -55,3 +56,9 @@ aside.toc.sidebar {
5556
display: block;
5657
}
5758
}
59+
60+
@media screen and (max-width: 767px) {
61+
div.body {
62+
margin-top: 5rem;
63+
}
64+
}

0 commit comments

Comments
 (0)