Compare commits

...

9 Commits

17 changed files with 1218 additions and 492 deletions

2
.gitignore vendored
View File

@ -24,4 +24,4 @@ Thumbs.db
# Ignore by editors/IDEs # Ignore by editors/IDEs
.vscode/ .vscode/
.idea/ .idea/
*.iml *.iml

View File

@ -1,2 +1,3 @@
source "https://rubygems.org" source 'http://rubygems.org'
gem "github-pages", group: :jekyll_plugins
gem 'github-pages', group: :jekyll_plugins

View File

@ -1,5 +1,5 @@
GEM GEM
remote: https://rubygems.org/ remote: http://rubygems.org/
specs: specs:
activesupport (7.2.2.1) activesupport (7.2.2.1)
base64 base64

115
README.md Normal file
View File

@ -0,0 +1,115 @@
# WONA GitHub Website
A Jekyll-based static website for Watch Out News Agency.
## Project Structure
### Root Files
- `_config.yml` - Jekyll configuration file with site settings, plugins, and build options
- `index.html` - Homepage template
- `404.html` - Custom 404 error page
- `Gemfile` - Ruby dependencies specification
- `Gemfile.lock` - Locked dependency versions
- `sitemap.xml` - XML sitemap for search engines
- `atom.xml` - RSS/Atom feed for content syndication
- `favicon.ico` - Website favicon
- `CNAME` - Custom domain configuration for GitHub Pages
### Directories
#### `_includes/`
Reusable HTML components that can be included in layouts and pages:
- `cat_header.html` - Category page header
- `footer.html` - Site footer
- `google_analytics.html` - Google Analytics tracking code
- `head.html` - HTML head section with meta tags and stylesheets
- `header.html` - Site header and navigation
- `horizontal_post.html` - Horizontal post layout component
- `navbar.html` - Navigation bar component
#### `_layouts/`
Page templates that define the structure for different content types:
- `category.html` - Template for category archive pages
- `layout.html` - Base layout template
- `post.html` - Individual blog post template
#### `_posts/`
Markdown files containing blog posts and articles (follows Jekyll naming convention: `YYYY-MM-DD-title.md`)
#### `_sass/`
SCSS stylesheets organized by component:
- `bootstrap/` - Bootstrap framework styles
- `_bootstrap.scss` - Bootstrap imports
- `css/` - Custom stylesheets
- `base.scss` - Base styles and variables
- `fontawesome.min.css` - Font Awesome icons
- `mobile.css` - Mobile-responsive styles
- `posts.css` - Post-specific styling
- `pure.css` - Pure CSS framework
- `pygments.css` - Syntax highlighting styles
- `table.css` - Table styling
#### Content Directories
- `edc/` - EDC (Editorial Development Cell) related content
- `fonts/` - Custom web fonts
- `getinvolved/` - Pages about getting involved with WONA
- `guide/` - User guides and documentation
- `images/` - Static images and media files
- `js/` - JavaScript files
- `news/` - News articles and posts
- `team/` - Team member profiles and information
#### Styling
- `table.css` - Standalone CSS file for table styling
## Installation
### Prerequisites
- [Docker](https://www.docker.com/get-started) installed on your system
- Git (to clone the repository)
### Setup Steps
1. **Clone the repository**
```bash
git clone https://github.com/WatchOutNewsAgency/wona.github.com.git
cd wona.github.com
```
2. **Run with Docker**
```bash
docker run --rm -it \
-v "${PWD}:/srv/jekyll" \
-p 4000:4000 \
jekyll/jekyll:4 \
jekyll serve --host 0.0.0.0
```
- If you might face error in dockerization use this instead: jekyll/jekyll:3
- This command will start a Jekyll server, serving your site at 4000 port
- If any other error, all the best debugging
3. **Access the site**
- Open your browser and navigate to `http://localhost:4000`
- The site will automatically rebuild when you make changes to files
### Docker Command Explanation
- `--rm` - Automatically remove the container when it exits
- `-it` - Interactive terminal mode
- `-v "${PWD}:/srv/jekyll"` - Mount current directory to Jekyll's working directory in container
- `-p 4000:4000` - Map port 4000 from container to host
- `jekyll/jekyll:4` - Use Jekyll Docker image version 4
- `jekyll serve --host 0.0.0.0` - Start Jekyll development server accessible from all network interfaces
### Development Notes
- Changes to `_config.yml` require a server restart
- New posts in `_posts/` will be automatically detected
- CSS/SCSS changes will trigger automatic regeneration
- Press `Ctrl+C` to stop the development server
### Troubleshooting
- If port 4000 is already in use, change `-p 4000:4000` to `-p 4001:4000` and access via `http://localhost:4001`
- On Windows, use PowerShell or Command Prompt
- Ensure Docker Desktop is running before executing the command
## Repository
[https://github.com/WatchOutNewsAgency/wona.github.com](https://github.com/WatchOutNewsAgency/wona.github.com)

View File

@ -63,3 +63,5 @@
title: Summer 2021 title: Summer 2021
- name: summer2022 - name: summer2022
title: Summer 2022 title: Summer 2022
- name: summer2025
title: Summer 2025

View File

@ -23,5 +23,6 @@ summer2019: Summer 2019
summer2020: Summer 2020 summer2020: Summer 2020
summer2021: Summer 2021 summer2021: Summer 2021
summer2022: Summer 2022 summer2022: Summer 2022
summer2025: Summer 2025
memoirs: Memoirs memoirs: Memoirs
report: Report report: Report

View File

@ -7,7 +7,7 @@
<div class="desc">Student Media<br>Body of IITR</div> <div class="desc">Student Media<br>Body of IITR</div>
</div> </div>
</div> </div>
<div class="social pull-right"> <div class="social pull-right hidden-xs">
<!-- <a href="/team">Team</a> --> <!-- <a href="/team">Team</a> -->
<a href="/about">About</a> <a href="/about">About</a>
<a href="/guide">Guide</a> <a href="/guide">Guide</a>

View File

@ -1,15 +1,9 @@
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-0DKSQSXFTB"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
<!-- Google Analytics --> gtag('config', 'G-0DKSQSXFTB');
<script type="text/javascript"> </script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-35663579-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>

View File

@ -55,4 +55,4 @@
<script type="text/javascript" src="/js/bootstrap.min.js"></script> <script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/masonry.min.js"></script> <script type="text/javascript" src="/js/masonry.min.js"></script>
<script type="text/javascript" src="/js/application.js"></script> <script type="text/javascript" src="/js/application.js"></script>
</head> </head>

View File

@ -1,5 +1,5 @@
{% assign post = include.post %} {% assign post = include.post %}
<div class="row article article-horiozntal"> <div class="row article article-horizontal">
<div class="col-md-4 center-fill-container img-container"> <div class="col-md-4 center-fill-container img-container">
<img src="/images/posts/{{post.image}}" alt="" class="img-center-fill center-both {% if post.image == null %}hidden{% endif %}"> <img src="/images/posts/{{post.image}}" alt="" class="img-center-fill center-both {% if post.image == null %}hidden{% endif %}">
</div> </div>

View File

@ -10,14 +10,14 @@
</a> </a>
<!-- Mobile toggle button --> <!-- Mobile toggle button -->
<button type="button" class="navbar-toggle" id="mobile-menu-toggle"> <button type="button" class="navbar-toggle visible-xs" id="mobile-menu-toggle">
<span class="sr-only">Toggle navigation</span> <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
</button> </button>
<div class="social pull-right"> <div class="social pull-right hidden-xs">
<a href="/about">About</a> <a href="/about">About</a>
<a href="/guide">Guide</a> <a href="/guide">Guide</a>
<a href="/getinvolved">Get Involved</a> <a href="/getinvolved">Get Involved</a>
@ -25,31 +25,49 @@
<a href="https://www.youtube.com/channel/UCthZ7tKOzy4EJpuVxtdcp1A"><img src="/images/youtube-play.svg"></a> <a href="https://www.youtube.com/channel/UCthZ7tKOzy4EJpuVxtdcp1A"><img src="/images/youtube-play.svg"></a>
<a href="mailto:watchout@iitr.ac.in"><img src="/images/email.png" width="16px"></a> <a href="mailto:watchout@iitr.ac.in"><img src="/images/email.png" width="16px"></a>
</div> </div>
</div>
<!-- Mobile navigation overlay -->
<div class="mobile-nav-overlay visible-xs" id="mobile-nav-overlay"></div>
<!-- Mobile navigation slider -->
<div class="mobile-nav visible-xs" id="mobile-nav">
<div class="mobile-nav-header">
<span class="mobile-nav-title">Menu</span>
<button class="mobile-nav-close" id="mobile-nav-close">&times;</button>
</div>
<!-- Mobile navigation menu --> <ul class="nav">
<div class="mobile-nav" id="mobile-nav"> {% for cat in site.data.categories %}
<ul class="nav"> {% if cat.subcategories != nil %}
{% for cat in site.data.categories %} <li class="dropdown">
{% if cat.subcategories != nil %} <a href="#" class="dropdown-toggle" data-category="{{ cat.name }}">{{ cat.title }}</a>
<li class="dropdown"> <ul class="dropdown-menu">
<a href="#" class="dropdown-toggle" data-category="{{ cat.name }}">{{ cat.title }}</a> {% for subcat in cat.subcategories %}
<ul class="dropdown-menu"> {% if site.categories[subcat.name] != nil %}
{% for subcat in cat.subcategories %} <li><a href="/category/{{ subcat.name }}/">{{ subcat.title }}</a></li>
{% if site.categories[subcat.name] != nil %} {% endif %}
<li><a href="/category/{{ subcat.name }}/">{{ subcat.title }}</a></li> {% endfor %}
{% endif %} </ul>
{% endfor %} </li>
</ul> {% elsif site.categories[cat.name] != nil%}
</li> <li><a href="/category/{{ cat.name }}/">{{ cat.title }}</a></li>
{% elsif site.categories[cat.name] != nil%} {% endif %}
<li><a href="/category/{{ cat.name }}/">{{ cat.title }}</a></li> {% endfor %}
{% endif %} </ul>
{% endfor %}
</ul> <div class="mobile-nav-social">
<a href="/about">About</a>
<a href="/guide">Guide</a>
<a href="/getinvolved">Get Involved</a>
<br><br>
<a href="http://fb.com/watchoutiitr"><img src="/images/fb-logo.svg" alt="Facebook"></a>
<a href="https://www.youtube.com/channel/UCthZ7tKOzy4EJpuVxtdcp1A"><img src="/images/youtube-play.svg" alt="YouTube"></a>
<a href="mailto:watchout@iitr.ac.in"><img src="/images/email.png" width="20px" alt="Email"></a>
</div> </div>
</div> </div>
<nav class="navbar navbar-default" data-spy="affix" data-offset-top="110"> <nav class="navbar navbar-default hidden-xs" data-spy="affix" data-offset-top="110">
<div class="container"> <div class="container">
<div class="navbar-header"> <div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false"
@ -59,15 +77,13 @@
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
</button> </button>
<!-- <a class="navbar-brand" href="/">Watch Out!</a> -->
</div> </div>
<div id="navbar" class="navbar-collapse collapse"> <div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right hacky-css"> <ul class="nav navbar-nav navbar-right hacky-css">
{% for cat in site.data.categories %} {% for cat in site.data.categories %}
{% if cat.subcategories != nil %} {% if cat.subcategories != nil %}
<li class="dropdown"> <li class="dropdown">
<a class="hover-underline" href="#" class="dropdown-toggle" data-toggle="dropdown">{{ cat.title }} <span <a class="hover-underline dropdown-toggle" href="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{ cat.title }} <span class="caret"></span></a>
class="caret"></span></a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
{% for subcat in cat.subcategories %} {% for subcat in cat.subcategories %}
{% if site.categories[subcat.name] != nil %} {% if site.categories[subcat.name] != nil %}
@ -82,20 +98,73 @@
{% endfor %} {% endfor %}
</ul> </ul>
</div> </div>
<!--/.nav-collapse -->
</div> </div>
</nav> </nav>
<!-- Mobile Navigation JavaScript -->
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
// Mobile menu toggle functio // Mobile menu elements
const mobileToggle = document.getElementById('mobile-menu-toggle'); const mobileToggle = document.getElementById('mobile-menu-toggle');
const mobileNav = document.getElementById('mobile-nav'); const mobileNav = document.getElementById('mobile-nav');
const mobileNavOverlay = document.getElementById('mobile-nav-overlay');
const mobileNavClose = document.getElementById('mobile-nav-close');
if (mobileToggle && mobileNav) { // Function to open mobile menu
mobileToggle.addEventListener('click', function() { function openMobileMenu() {
mobileNav.classList.toggle('show'); if (mobileNav && mobileNavOverlay) {
mobileNav.classList.add('show');
mobileNavOverlay.classList.add('show');
mobileToggle.classList.add('active');
document.body.style.overflow = 'hidden'; // Prevent body scroll
}
}
// Function to close mobile menu
function closeMobileMenu() {
if (mobileNav && mobileNavOverlay) {
mobileNav.classList.remove('show');
mobileNavOverlay.classList.remove('show');
mobileToggle.classList.remove('active');
document.body.style.overflow = ''; // Restore body scroll
// Close all open dropdowns
const openDropdowns = document.querySelectorAll('.mobile-nav .dropdown.open');
openDropdowns.forEach(function(dropdown) {
dropdown.classList.remove('open');
});
}
}
// Mobile menu toggle functionality
if (mobileToggle) {
mobileToggle.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
if (mobileNav.classList.contains('show')) {
closeMobileMenu();
} else {
openMobileMenu();
}
});
}
// Close button functionality
if (mobileNavClose) {
mobileNavClose.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
closeMobileMenu();
});
}
// Overlay click to close
if (mobileNavOverlay) {
mobileNavOverlay.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
closeMobileMenu();
}); });
} }
@ -104,9 +173,10 @@ document.addEventListener('DOMContentLoaded', function() {
dropdownToggles.forEach(function(toggleBtn) { dropdownToggles.forEach(function(toggleBtn) {
toggleBtn.addEventListener('click', function(e) { toggleBtn.addEventListener('click', function(e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation();
const dropdown = this.parentElement; const dropdown = this.parentElement;
// Close other open dropdowns jab some other dropdown is clicked // Close other open dropdowns
const otherDropdowns = document.querySelectorAll('.mobile-nav .dropdown.open'); const otherDropdowns = document.querySelectorAll('.mobile-nav .dropdown.open');
otherDropdowns.forEach(function(otherDropdown) { otherDropdowns.forEach(function(otherDropdown) {
if (otherDropdown !== dropdown) { if (otherDropdown !== dropdown) {
@ -118,11 +188,26 @@ document.addEventListener('DOMContentLoaded', function() {
}); });
}); });
// Close mobile menu when clicking outside // Close mobile menu when window is resized to desktop
document.addEventListener('click', function(e) { window.addEventListener('resize', function() {
if (mobileNav && !mobileNav.contains(e.target) && !mobileToggle.contains(e.target)) { if (window.innerWidth > 768) {
mobileNav.classList.remove('show'); closeMobileMenu();
} }
}); });
// Handle navigation clicks (close menu after navigation)
const mobileNavLinks = document.querySelectorAll('.mobile-nav a[href^="/"]');
mobileNavLinks.forEach(function(link) {
link.addEventListener('click', function() {///delaye
setTimeout(closeMobileMenu, 100);
});
});
// Prevent menu from closing when clicking inside the nav
if (mobileNav) {
mobileNav.addEventListener('click', function(e) {
e.stopPropagation();
});
}
}); });
</script> </script>

View File

@ -0,0 +1,153 @@
---
layout: post
title: "Fortune Faded"
category: summer2025
tags: [wona, column]
author: "Chandramouli Koushik"
image: summer2025.png
excerpt: "I didnt have the strongest CGPA, wasnt from a core intern-heavy branch, and wasnt exactly a fan of coding. But I stayed consistent, showed up for every opportunity, and kept learning from each setback. In the end, it all came together. If theres one thing Id say to anyone going into intern or placement season, its this: prepare well, trust your effort, and dont count yourself out too early"
---
## STATEMENT OF PURPOSE
Im writing this not to inspire you but primarily to show you that anythings possible, and
you should be prepared enough to grab the opportunity when it arises. Read it like a
story - maybe grab a vegan shake at CCD, put on some Red Hot Chili Peppers
(shoutout to their biggest fan that I know - 19119031) and breeze through this (this is
precisely what I was doing while typing this out).
## SETTING THE STAGE
Im Chandramouli Koushik; as Im typing this, Im a senior from the Chemical
Engineering department. Ill set the stage a little for the semester before the intern
season - my department isnt known for fabulous intern seasons, which I realised after
joining college (if someone doing JEE prep is reading this, I beseech you to research
well about what companies hire from which branches across all the IITs, before taking a
decision). My CGPA wasnt great either; it was a touch above 7.4. I was recovering from
a severe case of Pulmonary Tuberculosis. And I had little to no interest in coding. All I
wanted to do was play basketball.
I had dipped my toes into the usual coding stuff - Codeforces, CodeChef, Leetcode. But
after the 4th sem, I decided to lock in a little, but I didnt really have hopes of securing
an on-campus internship offer. I wont bore you with my preparation details (I think there
are way better people out there to guide you, but Im always open to helping people out,
so youre free to reach out to me anytime, and Ill try my best to guide you in the right
direction) and get to when the intern season started.
## THE INTERN SEASON BEGINS
Day 0 companies made nary an offer in Chemical Engineering, as I had expected.
AmEx Analytics was the first company to extend an offer to someone from my branch. I
was on the waitlist for that company, but they stopped calling people from the waitlist
two names before me. But I just saw making it to the waitlist as a massive win in itself.
This was repeated again with Tata AIG - they didnt even make it to the waitlist.
I vividly remember walking back from the Sprinklr coding round on 19th July at 11:50 pm
thinking, damn, that was the biggest “hes not him” performance Ive ever given. I
entered my room, and my friends were there with a cake and candles. July 20th was my
birthday. But I just felt extremely low after that underwhelming coding round. By 12:10
am, the cake was finished, and I sat back down to study more, while my friends
continued chilling in my neighbors (and bestie, shoutout 21112013) room.
Then came one rainy night, when I was out with a junior and another friend (shoutout to
another bestie 21119034) in Rustic. Standard Chartereds coding round was that night,
and I was a hairs width away from just giving up and not appearing for it. The rain only
added to my laziness and despair. But, almost prophetically, the skies cleared up, and I
thought, why not just give it? After some initial technical hitches, I was the second or
third person to finish both the questions, even after starting a little later. I was pretty
happy with how it went. I called a senior of mine (shoutout 19117075) and told him
everything. He was highly confident Id make it to the shortlist this time. I didnt share
the same enthusiasm, but two days later, my name was on the Noticeboard app under
the shortlist. I was overjoyed.
## THE INTERVIEWS - R1
My interview readiness levels were mid, at best. I knew most of my projects from top to
bottom and DSA pretty well, too. Why did I say I wasnt too well prepared then? Youll
find out soon enough. In the first round, my interviewer was a fun late -30s man who
worked in the analytics department, if I remember correctly. He constantly had a smile
on his face and made a strong effort to make me feel comfortable throughout the
interview. I had (still have a bit of) performance anxiety, which didnt surface because of
how nice he was. The round went wonderfully well, and my name was on top of the list
of 10 people shortlisted for the second round. I assumed that was a good sign and was
quite excited for the next one.
## THE INTERVIEWS - R2
Heres the part of this read thatll clarify why I know I was underprepared, looking back
now. I completely blew over preparing for common HR questions because, for one, I
never thought Id make it that far, and two, I thought Id be able to bullshit my way
through it. But let me stress this, it is IMPERATIVE to know HOW to bullshit through it,
and that requires SOME prep.
My interviewer for this round was (no offense to him whatsoever) a little scary - no smile
on his face, a mean mustache, and a very unnerving voice. He exposed my lack of
knowledge in commonplace things about coding (for example, I couldnt answer which
programming languages use a compiler, which ones use an interpreter, and which ones
use both. Stuff Ive known since school, but Id forgotten).
Then he got to grilling me about the weak points in my resume (I was pretty proud of the
rest of my resume, by the way, arranged and worded beautifully thanks to 19117109),
and there was the prominent single glaring crater in it - my CGPA. He asked me to
explain why its low. Now, theres a way of answering this, which I did not know at the
time because, well, I hadnt done the slightest research on how to tackle these
questions. I beat around the bush under-confidently, mainly talking about how I faced
major health episodes in college (which I really did; I faced things no healthy 20 -
something year old would even dream of). This answer fell flat on its face; the
interviewer didnt buy it.
After what felt like being thrown into a food processor after being defended by prime
2014 Kawhi Leonard for two hours, I got out of the round. I didnt want to be seen; call
me 2012 John Cena, the way I felt at rock bottom (someone please get all the
references I threw in here, I know 19117016 will).
## THE FALLOUT
9 more people were left until I found out what would become of me after this round, and
so began the strenuous 2-hour wait. 8 names came out after. Mine was not there.
Heartbroken. Tired of the process. Despair. Agony (too dramatic, maybe?). I began the
long walk back to my hostel. My mother, the real MVP, ever so supportive, told me its
alright. Ill get something else. I wasnt too sure of it.
But wait, I didnt get an offer. Why am I writing this?
## THE SURPRISE
A few days passed. I had mostly gotten over the interview fiasco. But I had a lab course
to deal with (torturous as usual). The professor had once yelled at me for sitting on the
table while observing an experiment - I was told to go sit on the ceiling—trademark
South Indian sarcasm. Almost made me laugh in nostalgia. I missed home so much.
My phone was on silent that day, and when I checked it, I had three missed calls from
an unknown number. A classmate of mine walked up to me and told me to call it back -
it was a Placement Cell rep that had called me. I was pretty confused. I jogged out of
the lab and called back. The rep told me I have my third round of interviews scheduled
for the afternoon!? How? Why? I was obviously ecstatic, but I didnt understand how this
happened. The third round was just a formality round to give location and other
preferences - it basically meant you had secured an offer.
After that call was over, I was informed that I did actually get an offer from Standard
Chartered. Seventh heaven. I remember running to my room and slamming the balcony
door in happiness. I remember calling both my parents and informing them about this. I
remember thinking “oh shit, I can hoop seriously again”. I remember taking 21322024
(bestie 3) to Milk Bar for celebratory sweets. I remember story-ing a photo of the iconic
Kevin Garnett “ANYTHING IS POSSIBLE” below (after the 2008 championship win) -
because it really felt that way. This should explain the “SOP” of the article.
Later, I found out how this actually went down. The students are to fill out a Google form
giving their preferences for a particular interview day - one of the Standard Chartered
selects had Jaguar higher on his priority list, and he ended up going there. That opened
up a vacancy, and I was slotted in to fill that. A stroke of luck, finally, after all the
setbacks.
## THE CULMINATION
Later, I was told that my office would be in Bangalore (which meant I could just stay
home). I had a great 2 months at the organisation. I worked under an excellent
manager. In those two months, I got my health and fitness to the best it had ever been.
If I may sidetrack a little - I bought myself a pair of Ja 1s, a KD jersey, and a LeBron
jersey (both city edition) as soon as my stipend hit. I even received a PPO from the
company later, which spared me a lot of placement season stress.
To anyone reading this with an upcoming intern/placement season, Ill reiterate what I
said at the beginning of this article - prepare. No matter your branch, your CGPA, or
your interests, be prepared for the process. It will result in something great. As cliche as
it sounds, take help from the people around you to define a goal and the means to attain
it, hustle and trust the process (unless youre a 76ers fan, in which case Im sorry you
read those words). You've got this.

View File

@ -0,0 +1,3 @@
---
category: summer2025
---

View File

@ -26,10 +26,6 @@ $article-cover-img-height: 190px;
$carousel-bg-color: #333; $carousel-bg-color: #333;
$carousel-height: 625px; $carousel-height: 625px;
// Mobile breakpoints
$mobile-breakpoint: 768px;
$small-mobile-breakpoint: 480px;
// =============== /VARS ===============// // =============== /VARS ===============//
@import "bootstrap"; @import "bootstrap";
@ -60,17 +56,6 @@ $small-mobile-breakpoint: 480px;
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1); box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1);
} }
@mixin mobile {
@media (max-width: #{$mobile-breakpoint}) {
@content;
}
}
@mixin small-mobile {
@media (max-width: #{$small-mobile-breakpoint}) {
@content;
}
}
// ============== /MIXINS ============== // // ============== /MIXINS ============== //
@ -95,12 +80,6 @@ $small-mobile-breakpoint: 480px;
src: local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v7/IQHow_FEYlDC4Gzy_m8fcoWiMMZ7xLd792ULpGE4W_Y.woff2) format('woff2'); src: local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v7/IQHow_FEYlDC4Gzy_m8fcoWiMMZ7xLd792ULpGE4W_Y.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
} }
// Base styles with mobile-first approach (very impotant)
html {
overflow-x: hidden;
max-width: 100%;
}
body { body {
font-size: 13px; font-size: 13px;
@ -108,49 +87,21 @@ body {
background: #fff; background: #fff;
font-family: Lato, Merriweather, Open Sans, sans-serif; font-family: Lato, Merriweather, Open Sans, sans-serif;
@include box-sizing(); @include box-sizing();
overflow-x: hidden;
max-width: 100%;
@include mobile {
font-size: 14px;
}
@include small-mobile {
font-size: 13px;
}
} }
*{ *{
font-family: Lato, Merriweather, Open Sans, sans-serif; font-family: Lato, Merriweather, Open Sans, sans-serif;
box-sizing: border-box;
} }
// Ensure all containers don't overflow
.container, .container-fluid {
max-width: 100%;
overflow-x: hidden;
}
// ================ NAV ================// // ================ NAV ================//
.pre-nav, .pre-footer { .pre-nav, .pre-footer {
height: $pre-nav-logo-height * 1.6; height: $pre-nav-logo-height * 1.6;
border-bottom: 1px solid #f3f3f3; border-bottom: 1px solid #f3f3f3;
@include mobile {
height: auto;
padding: 15px 0;
text-align: center;
}
.brand { .brand {
height: 100%; height: 100%;
padding: $pre-nav-logo-height * .3 0; padding: $pre-nav-logo-height * .3 0;
@include mobile {
float: none;
display: block;
padding: 10px 0;
}
} }
.name-container { .name-container {
@ -158,11 +109,6 @@ body {
position: relative; position: relative;
margin-left: 2em; margin-left: 2em;
line-height: 1; line-height: 1;
@include mobile {
margin-left: 1em;
height: auto;
}
.name { .name {
position: absolute; position: absolute;
@ -170,15 +116,6 @@ body {
width: 7em; width: 7em;
font-size: 18px; font-size: 18px;
color: $navbar-default-brand-color; color: $navbar-default-brand-color;
@include mobile {
position: static;
font-size: 16px;
}
@include small-mobile {
font-size: 14px;
}
} }
.desc { .desc {
@ -187,26 +124,12 @@ body {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
color: #ababab; color: #ababab;
@include mobile {
position: static;
font-size: 12px;
margin-top: 5px;
}
@include small-mobile {
font-size: 11px;
}
} }
} }
.logo { .logo {
height: $pre-nav-logo-height; height: $pre-nav-logo-height;
float: left; float: left;
@include mobile {
height: 50px;
}
} }
.social { .social {
@ -218,19 +141,9 @@ body {
> * { > * {
margin-left: 1em; margin-left: 1em;
@include mobile {
margin: 0 5px;
}
}
@include mobile {
float: none;
display: block;
padding: 10px 0;
margin-top: 10px;
} }
} }
} }
nav { nav {
@ -246,10 +159,6 @@ nav {
width: 100%; width: 100%;
position: relative; position: relative;
left: -15px; left: -15px;
@include mobile {
left: 0;
}
} }
&.affix { &.affix {
@ -280,28 +189,14 @@ nav {
float: none; float: none;
margin-bottom: -100%; // Hack to fix the spacing between header and navbar margin-bottom: -100%; // Hack to fix the spacing between header and navbar
@include mobile {
display: block;
margin-bottom: 0;
}
&:first-of-type a { &:first-of-type a {
padding-left: 0; padding-left: 0;
@include mobile {
padding-left: 15px;
}
} }
&:last-of-type a { &:last-of-type a {
padding-right: 0; padding-right: 0;
@include mobile {
padding-right: 15px;
}
} }
} }
.navbar-nav { .navbar-nav {
font-size: 16px; font-size: 16px;
text-align: justify; text-align: justify;
@ -311,23 +206,6 @@ nav {
width: 100%; /* Ensures justification for single lines */ width: 100%; /* Ensures justification for single lines */
display: inline-block; display: inline-block;
} }
@include mobile {
font-size: 14px;
text-align: left;
> li > a {
padding: 10px 15px;
}
}
}
.navbar-collapse {
@include mobile {
border-top: 1px solid #e5e5e5;
margin-top: 10px;
padding-top: 10px;
}
} }
// ================ /NAV ================// // ================ /NAV ================//
@ -336,10 +214,6 @@ nav {
#header { #header {
font-size: 12px; font-size: 12px;
@include mobile {
margin-bottom: 20px;
}
.header-row { .header-row {
position: relative; position: relative;
@ -349,14 +223,7 @@ nav {
overflow: hidden; overflow: hidden;
color: white; color: white;
box-shadow: $home-header-shadow; box-shadow: $home-header-shadow;
@include mobile {
height: auto;
min-height: 250px;
border-radius: 0;
display: flex;
flex-direction: column;
}
} }
.row { .row {
@ -365,20 +232,10 @@ nav {
.cover-image { .cover-image {
height: $home-header-height; height: $home-header-height;
@include mobile {
height: 200px;
order: 1;
}
} }
.cover-details { .cover-details {
padding: 2em 1.5em; padding: 2em 1.5em;
@include mobile {
order: 2;
padding: 20px 15px;
}
} }
.cover-link { .cover-link {
@ -393,10 +250,6 @@ nav {
.cover-title-label { .cover-title-label {
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
@include mobile {
font-size: 12px;
}
} }
.title { .title {
@ -404,15 +257,6 @@ nav {
font-weight: bold; font-weight: bold;
margin-top: 0; margin-top: 0;
margin-bottom: 20px; margin-bottom: 20px;
@include mobile {
font-size: 20px;
margin-bottom: 15px;
}
@include small-mobile {
font-size: 18px;
}
} }
} }
@ -421,12 +265,6 @@ nav {
.cover-image { .cover-image {
border-radius: 10px; border-radius: 10px;
@include mobile {
height: 150px;
margin-bottom: 15px;
border-radius: 0;
}
} }
.title { .title {
@ -449,11 +287,6 @@ nav {
.cover-excerpt { .cover-excerpt {
margin-top: 12px; margin-top: 12px;
@include mobile {
font-size: 13px;
line-height: 1.4;
}
} }
// ============= /HOME-HEADER ============= // // ============= /HOME-HEADER ============= //
@ -462,10 +295,6 @@ nav {
color: white; color: white;
margin-bottom: 60px; margin-bottom: 60px;
position: relative; position: relative;
@include mobile {
margin-bottom: 30px;
}
.container-title { .container-title {
position: absolute; position: absolute;
@ -613,7 +442,7 @@ nav {
} }
.article-horiozntal { .article-horizontal {
height: 10em; height: 10em;
margin-bottom: 3.5em; margin-bottom: 3.5em;
margin-left: 0; margin-left: 0;
@ -991,4 +820,4 @@ footer {
} }
font-size: 1.2em; font-size: 1.2em;
} }

File diff suppressed because it is too large Load Diff

View File

@ -1,105 +1,19 @@
.mbtablestyle { .mbtablestyle {
border-collapse: collapse; border-collapse: collapse;
margin-top: 5rem; margin-top: 5rem;
width: 100%;
max-width: 100%;
} }
.mdtablestyle { .mdtablestyle {
border-collapse: collapse; border-collapse: collapse;
margin: 2rem 0; margin: 2rem 0;
width: 100%;
max-width: 100%;
} }
.mbtablestyle td, .mbtablestyle td,
.mbtablestyle th, .mbtablestyle th,
.mdtablestyle td, .mdtablestyle td,
.mdtablestyle th { .mdtablestyle th {
border: 1px solid black; border: 1px solid black;
padding: 0.5rem 1.5rem; padding: 0.5rem 1.5rem;
padding-bottom: 2rem; padding-bottom: 2rem;
vertical-align: top; vertical-align: top;
word-wrap: break-word;
}
/* Mobile table styles for the articles and stuff */
@media (max-width: 768px) {
.mbtablestyle,
.mdtablestyle {
margin-top: 2rem;
margin-bottom: 2rem;
font-size: 12px;
display: block;
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
.mbtablestyle td,
.mbtablestyle th,
.mdtablestyle td,
.mdtablestyle th {
padding: 0.25rem 0.75rem;
padding-bottom: 1rem;
min-width: 100px;
}
/* Alternative responsive table approach - stacked layout */
.responsive-table {
display: block;
width: 100%;
}
.responsive-table thead {
display: none;
}
.responsive-table tbody,
.responsive-table tr,
.responsive-table td {
display: block;
width: 100%;
}
.responsive-table tr {
border: 1px solid #ccc;
margin-bottom: 10px;
padding: 10px;
}
.responsive-table td {
border: none;
position: relative;
padding-left: 50% !important;
padding-top: 10px;
padding-bottom: 10px;
}
.responsive-table td:before {
content: attr(data-label) ": ";
position: absolute;
left: 6px;
width: 45%;
font-weight: bold;
white-space: nowrap;
}
}
@media (max-width: 480px) {
.mbtablestyle,
.mdtablestyle {
font-size: 11px;
margin-top: 1rem;
margin-bottom: 1rem;
}
.mbtablestyle td,
.mbtablestyle th,
.mdtablestyle td,
.mdtablestyle th {
padding: 0.2rem 0.5rem;
padding-bottom: 0.5rem;
min-width: 80px;
}
} }

View File

@ -17,8 +17,16 @@ title: "Watch Out, IIT Roorkee"
{% endfor %} {% endfor %}
{% endfor %} {% endfor %}
</div> </div>
<!-- Replace the Facebook widget section in your index.html with this: -->
<div class="col-md-4"> <div class="col-md-4">
<div class="fb-page" data-href="https://www.facebook.com/watchoutiitr/" data-tabs="timeline" data-width="330" data-height="540" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/watchoutiitr/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/watchoutiitr/">Watch Out! News Agency</a></blockquote></div> <div class="facebook-widget-container">
<div class="fb-page" data-href="https://www.facebook.com/watchoutiitr/" data-tabs="timeline" data-width="330" data-height="540" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
<blockquote cite="https://www.facebook.com/watchoutiitr/" class="fb-xfbml-parse-ignore">
<a href="https://www.facebook.com/watchoutiitr/">Watch Out! News Agency</a>
</blockquote>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -32,10 +40,11 @@ title: "Watch Out, IIT Roorkee"
<div class="embed-responsive embed-responsive-16by9"> <div class="embed-responsive embed-responsive-16by9">
<iframe class="youtube-video" id="youtube-video-{{ video.id }}" data-id="{{ video.id }}" src="https://www.youtube.com/embed/{{ video.id }}?enablejsapi=1&showinfo=0" allowfullscreen></iframe> <iframe class="youtube-video" id="youtube-video-{{ video.id }}" data-id="{{ video.id }}" src="https://www.youtube.com/embed/{{ video.id }}?enablejsapi=1&showinfo=0" allowfullscreen></iframe>
</div> </div>
<div class="video-caption" id="youtube-title-{{ video.id }}" data-id="{{ video.id }}">
<h2 class="caption">{{ video.title }}</h2>
</div>
</div> </div>
<div class="video-caption" id="youtube-title-{{ video.id }}" data-id="{{ video.id }}">
<h2 class="caption">{{ video.title }}</h2>
</div>
</div> <!-- col-md-8 --> </div> <!-- col-md-8 -->
<ul class="col-md-4 video-list"> <ul class="col-md-4 video-list">
{% for video in site.data.youtube offset: 1 limit: 4 %} {% for video in site.data.youtube offset: 1 limit: 4 %}