Jekyll2017-09-09T12:04:02+00:00/Rajan.WorldRajan's views, thoughts, opinions about World. I mostly writes about software development & technology, sometimes about world and rarely about my-self.
Understand category2017-04-20T12:36:35+00:002017-04-20T12:36:35+00:00/articles/undestand-category<p>Another series of posts can be written as seperate posts.</p>Another series of posts can be written as seperate posts.Adding another category of post2017-04-15T12:36:35+00:002017-04-15T12:36:35+00:00/articles/adding-another-category-of-posts<p>Another series of posts can be written as seperate posts.</p>Another series of posts can be written as seperate posts.How to create your first Jekyll based website2017-04-03T10:36:38+00:002017-04-03T10:36:38+00:00/codes/how-to-create-your-first-jekyll-based-website<p>Steps of creating jekyll based website for biginner.</p>
<p>##Setup for automatic deploy</p>
<ul>
<li>github.io page</li>
<li>custom domain</li>
<li>https with custom domain</li>
<li>travis CI for deployment</li>
</ul>Steps of creating jekyll based website for biginner.Style sample Post2017-04-02T08:36:35+00:002017-04-02T08:36:35+00:00/codes/sample-elements<p>Below is just about everything you’ll need to style in the theme. Check <a href="https://kumarrajan.com">the source code</a> to see the many embedded elements within paragraphs.</p>
<h1 id="heading-1-lorem-ipsum-dolor-sit-amet-test-link-adipiscing-elit-this-is-strong-nullam-dignissim-convallis-est-quisque-aliquam">Heading 1: Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</h1>
<h2 id="heading-2-lorem-ipsum-dolor-sit-amet-test-link-adipiscing-elit-this-is-strong-nullam-dignissim-convallis-est-quisque-aliquam">Heading 2: Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</h2>
<h3 id="heading-3-lorem-ipsum-dolor-sit-amet-test-link-adipiscing-elit-this-is-strong-nullam-dignissim-convallis-est-quisque-aliquam">Heading 3: Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</h3>
<h4 id="heading-4-lorem-ipsum-dolor-sit-amet-test-link-adipiscing-elit-this-is-strong-nullam-dignissim-convallis-est-quisque-aliquam">Heading 4: Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</h4>
<h5 id="heading-5-lorem-ipsum-dolor-sit-amet-test-link-adipiscing-elit-this-is-strong-nullam-dignissim-convallis-est-quisque-aliquam">Heading 5: Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</h5>
<h6 id="heading-6-lorem-ipsum-dolor-sit-amet-test-link-adipiscing-elit-this-is-strong-nullam-dignissim-convallis-est-quisque-aliquam">Heading 6: Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</h6>
<h3 id="body-text">Body text</h3>
<p>Lorem ipsum dolor sit amet, test link adipiscing elit. <strong>This is strong</strong>. Nullam dignissim convallis est. Quisque aliquam.</p>
<p><em>This is emphasized</em>. Donec faucibus. Nunc iaculis suscipit dui. 53 = 125. Water is H<sub>2</sub>O. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. The New York Times <cite>(That’s a citation)</cite>. <u>Underline</u>. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.</p>
<p>HTML and <abbr title="Cascading Stylesheets">CSS</abbr> are our tools. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.</p>
<h3 id="blockquotes">Blockquotes</h3>
<blockquote>
<p>Lorem ipsum dolor sit amet, test link adipiscing elit. Nullam dignissim convallis est. Quisque aliquam.</p>
</blockquote>
<blockquote>
<p><cite>First Lastname, <em>The Greatest Article</em></cite></p>
</blockquote>
<h2 id="list-types">List Types</h2>
<h3 id="ordered-lists">Ordered Lists</h3>
<ol>
<li>Item one
<ol>
<li>sub item one</li>
<li>sub item two</li>
<li>sub item three</li>
</ol>
</li>
<li>Item two</li>
</ol>
<h3 id="unordered-lists">Unordered Lists</h3>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
<h2 id="tables">Tables</h2>
<table>
<thead>
<tr>
<th style="text-align: left">Header1</th>
<th style="text-align: center">Header2</th>
<th style="text-align: right">Header3</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left">cell1</td>
<td style="text-align: center">cell2</td>
<td style="text-align: right">cell3</td>
</tr>
<tr>
<td style="text-align: left">cell4</td>
<td style="text-align: center">cell5</td>
<td style="text-align: right">cell6</td>
</tr>
</tbody>
<tbody>
<tr>
<td style="text-align: left">cell1</td>
<td style="text-align: center">cell2</td>
<td style="text-align: right">cell3</td>
</tr>
<tr>
<td style="text-align: left">cell4</td>
<td style="text-align: center">cell5</td>
<td style="text-align: right">cell6</td>
</tr>
</tbody>
</table>
<h2 id="code-snippets">Code Snippets</h2>
<p>Syntax highlighting via Pygments</p>
<div class="language-css highlighter-rouge"><pre class="highlight"><code><span class="nf">#container</span> <span class="p">{</span>
<span class="nl">float</span><span class="p">:</span> <span class="nb">left</span><span class="p">;</span>
<span class="nl">margin</span><span class="p">:</span> <span class="m">0</span> <span class="m">-240px</span> <span class="m">0</span> <span class="m">0</span><span class="p">;</span>
<span class="nl">width</span><span class="p">:</span> <span class="m">100%</span><span class="p">;</span>
<span class="p">}</span>
</code></pre>
</div>
<h2 id="images">Images</h2>
<figure>
<img src="https://placehold.it/900x400.gif" alt="placehold" />
<figcaption><strong>Example:</strong> One image.</figcaption>
</figure>
<figure class="half">
<img src="https://placehold.it/900x400.gif" alt="placehold" />
<img src="https://placehold.it/900x400.gif" alt="placehold" />
<figcaption><strong>Example:</strong> Two images.</figcaption>
</figure>
<h2 id="font-icon">Font icon</h2>
<h3 id="font-icons">Font icons</h3>
<p>Some fonts such as <i class="fa fa-clock-o"></i> Time
or decoration of large <i class="fa fa-calendar fa-lg" aria-hidden="true"></i> calender and
2xlarge icon <i class="fa fa-th-large fa-2x" aria-hidden="true"></i> can be great to use them all.</p>
<h3 id="stacked-font-icon">Stacked Font icon</h3>
<p><a href="https://github.com">
<span class="fa-stack fa-lg">
<i class="fa fa-square-o fa-stack-2x"></i>
<i class="fa fa-github-alt fa-stack-1x"></i>
</span>
</a></p>
<h2 id="buttons">Buttons</h2>
<p>Make any link standout more when applying the <code class="highlighter-rouge">.btn</code> class.</p>
<div class="language-html highlighter-rouge"><pre class="highlight"><code><span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"btn"</span><span class="nt">></span>Default Button<span class="nt"></a></span>
</code></pre>
</div>
<p><a href="#" class="btn">.btn</a>
<a href="#" class="btn btn--inverse">.btn–inverse</a>
<a href="#" class="btn btn--info">.btn–info</a>
<a href="#" class="btn btn--warning">.btn–warning</a>
<a href="#" class="btn btn--danger">.btn–danger</a>
<a href="#" class="btn btn--success">.btn–success</a></p>
<h2 id="notices">Notices</h2>
<p>Set a block of text off from the rest.</p>
<div class="notice">
<h4 id="default-notice">Default Notice</h4>
<p><a href="">Maecenas ornare tortor</a>. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.</p>
</div>
<div class="notice--info">
<h4 id="info-notice">Info Notice</h4>
<p><code class="highlighter-rouge">.notice--info</code> <a href="">Maecenas ornare tortor</a>. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.</p>
</div>
<div class="notice--warning">
<h4 id="warning-notice">Warning Notice</h4>
<p><code class="highlighter-rouge">.notice--warning</code> Maecenas ornare tortor. Donec sed <a href="">tellus eget</a> sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.</p>
</div>
<div class="notice--danger">
<h4 id="danger-notice">Danger Notice</h4>
<p><code class="highlighter-rouge">.notice--danger</code> Maecenas ornare tortor.<a href=""> Donec sed tellus</a> eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.</p>
</div>
<div class="notice--success">
<h4 id="success-notice">Success Notice</h4>
<p><code class="highlighter-rouge">.notice--success</code> Maecenas ornare tortor. Donec sed tellus eget <a href="">sapien fringilla</a> nonummy. Mauris a ante. Suspendisse quam sem, consequat at.</p>
</div>
<h2 id="fieldsets-and-form-elements">Fieldsets and Form Elements</h2>
<fieldset>
<form>
<h2>Form Element</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui.</p>
<label for="text_field">Text Field:</label>
<input type="text" id="text_field" />
<label for="text_area">Text Area:</label>
<textarea id="text_area"></textarea>
<p>
<label for="select_element">Select Element:</label>
<select name="select_element">
<optgroup label="Option Group 1">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</optgroup>
<optgroup label="Option Group 2">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</optgroup>
</select>
</p>
<p>
<label for="radio_buttons">Radio Buttons:</label>
<label><input type="radio" class="radio" name="radio_button" value="radio_1" />Radio 1</label>
<label><input type="radio" class="radio" name="radio_button" value="radio_2" />Radio 2</label>
<label><input type="radio" class="radio" name="radio_button" value="radio_3" />Radio 3</label>
</p>
<p>
<label for="checkboxes">Checkboxes:</label>
<label><input type="checkbox" class="checkbox" name="checkboxes" value="check_1" />Checkbox 1</label>
<label><input type="checkbox" class="checkbox" name="checkboxes" value="check_2" />Checkbox 2</label>
<label><input type="checkbox" class="checkbox" name="checkboxes" value="check_3" />Checkbox 3</label>
</p>
<p>
<label for="password">Password:</label>
<input type="password" class="password" name="password" />
</p>
<p>
<label for="file">File Input:</label>
<input type="file" class="file" name="file" />
</p>
<p>
<input class="btn" type="submit" value="Submit" />
</p>
</form>
</fieldset>Below is just about everything you'll need to style in the theme.Welcome to Rajan World!2017-04-01T09:36:35+00:002017-04-01T09:36:35+00:00/codes/welcome-to-rajan-world<p>Welcome to Rajan’s personal site. This is the place where I will be writting all my views/thoughts/opinions about World speciacially software develepment.</p>
<p>Idea is to start publish my thoughts as form of articles/blogs as here. I will be also publising my old blogs to this site slowly.</p>
<p>Code snippets will be added to test code highliting, as I will be writting mostly about software development:</p>
<figure class="highlight"><pre><code class="language-ruby" data-lang="ruby"><span class="k">def</span> <span class="nf">print_hi</span><span class="p">(</span><span class="nb">name</span><span class="p">)</span>
<span class="nb">puts</span> <span class="s2">"Hi, </span><span class="si">#{</span><span class="nb">name</span><span class="si">}</span><span class="s2"> World"</span>
<span class="k">end</span>
<span class="n">print_hi</span><span class="p">(</span><span class="s1">'Tom'</span><span class="p">)</span>
<span class="c1">#=> prints 'Hi, Rajan World' to STDOUT.</span></code></pre></figure>
<p>This site will be available at following places to start with. Main site will be <a href="https://kumarrajan.com">here</a>, others will be redirects.</p>
<p>Lots of love to jekyll, lanyon, travis-ci, github, cloudflare.</p>Welcome to Rajan’s personal site. This is the place where I will be writting all my views/thoughts/opinions about World speciacially software develepment.