Skip to content

Commit 595c02f

Browse files
DiptoChakrabartyDiptoChakrabarty
committed
template style
1 parent a869094 commit 595c02f

1 file changed

Lines changed: 186 additions & 0 deletions

File tree

‎resume/static/resume_template.css‎

Lines changed: 186 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,186 @@
1+
html {
2+
box-sizing: border-box;
3+
}
4+
*, *:before, *:after {
5+
box-sizing: inherit;
6+
}
7+
8+
body {
9+
font-family: 'Source Sans Pro', sans-serif;
10+
line-height: 1.5;
11+
background: #F2F2F2;
12+
color: #323232;
13+
}
14+
15+
img {
16+
max-width: 100%;
17+
}
18+
19+
.icon {
20+
fill: currentColor;
21+
display: inline-block;
22+
font-size: inherit;
23+
height: 1em;
24+
overflow: visible;
25+
}
26+
27+
a {
28+
color: #323232;
29+
text-decoration: none;
30+
}
31+
32+
a:hover {
33+
text-decoration: underline;
34+
}
35+
36+
.container {
37+
max-width: 960px;
38+
margin: 40px auto;
39+
padding: 32px;
40+
background: white;
41+
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
42+
}
43+
44+
section {
45+
display: grid;
46+
grid-template-columns: 1fr 4fr;
47+
grid-gap: 20px;
48+
padding: 24px 0;
49+
border-bottom: 1px solid lightgrey;
50+
}
51+
52+
section:last-child {
53+
border-bottom: none;
54+
}
55+
56+
.section-title {
57+
font-weight: bold;
58+
font-size: 18px;
59+
}
60+
61+
/***********************************
62+
* =Main Info
63+
***********************************/
64+
65+
img.avatar {
66+
width: 130px;
67+
}
68+
69+
.my-name {
70+
font-size: 48px;
71+
line-height: 1;
72+
}
73+
74+
.my-title {
75+
font-size: 24px;
76+
font-weight: 300;
77+
color: #236FB2;
78+
}
79+
80+
.links {
81+
display: flex;
82+
margin: 10px 0 20px 0;
83+
}
84+
85+
.link-item {
86+
display: flex;
87+
align-items: center;
88+
flex: 1;
89+
}
90+
91+
.link-item svg {
92+
margin-right: 6px;
93+
}
94+
95+
/***********************************
96+
* =Experience
97+
***********************************/
98+
99+
.job {
100+
padding-bottom: 24px;
101+
margin-bottom: 24px;
102+
border-bottom: 1px solid lightgrey;
103+
}
104+
105+
.job:last-child {
106+
border-bottom: none;
107+
}
108+
109+
.job-title-container {
110+
display: flex;
111+
justify-content: space-between;
112+
margin-bottom: 20px;
113+
font-size: 18px;
114+
}
115+
116+
.job-company {
117+
font-weight: bold;
118+
line-height: 1.2;
119+
}
120+
121+
/***********************************
122+
* =Skills
123+
***********************************/
124+
125+
.skills-container {
126+
display: grid;
127+
grid-template-columns: 1fr 1fr 1fr;
128+
grid-gap: 30px;
129+
margin-bottom: 24px;
130+
}
131+
132+
.skills-container ul {
133+
margin-left: 20px;
134+
list-style-type: disc;
135+
}
136+
137+
/***********************************
138+
* =Interests
139+
***********************************/
140+
141+
.interests-container {
142+
display: flex;
143+
justify-content: space-between;
144+
}
145+
146+
.interests-container img {
147+
height: 35px;
148+
opacity: 0.75;
149+
}
150+
151+
/***********************************
152+
* =References
153+
***********************************/
154+
155+
.reference {
156+
font-size: 18px;
157+
}
158+
159+
.reference-details {
160+
margin-bottom: 20px;
161+
}
162+
163+
@media only screen and (max-width : 768px) {
164+
section {
165+
grid-template-columns: 1fr;
166+
}
167+
168+
.links, .job-title-container {
169+
flex-direction: column;
170+
}
171+
172+
.skills-container {
173+
grid-template-columns: 1fr 1fr;
174+
}
175+
176+
.interests-container {
177+
flex-wrap: wrap;
178+
justify-content: flex-start;
179+
}
180+
181+
.interests-container img {
182+
margin-right: 32px;
183+
margin-bottom: 16px;
184+
}
185+
}
186+

0 commit comments

Comments
 (0)