mirror of
https://github.com/hnasheralneam/hnasheralneam.github.io.git
synced 2024-11-06 23:55:54 -05:00
78 lines
1.3 KiB
CSS
78 lines
1.3 KiB
CSS
|
body {
|
||
|
background-color: #ffbbbb;
|
||
|
color: #fff;
|
||
|
}
|
||
|
|
||
|
.header {
|
||
|
background-color: #663399;
|
||
|
}
|
||
|
|
||
|
.tabswitcher {
|
||
|
display: grid;
|
||
|
grid-template-columns: auto auto auto;
|
||
|
background-color: #222;
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
.tabswitcherbtn {
|
||
|
padding: .8em 0;
|
||
|
display: inline-block;
|
||
|
background-color: #222;
|
||
|
font: 1em sans-serif;
|
||
|
transition: .2s;
|
||
|
}
|
||
|
|
||
|
.activeswitcher {
|
||
|
background-color: #444;
|
||
|
}
|
||
|
|
||
|
.active-section { background-color: #00ff00; }
|
||
|
.timeline-section { background-color: #00ffff; }
|
||
|
.roadmap-section { background-color: #ffff00; }
|
||
|
.activetab { background-color: #ffffff; }
|
||
|
|
||
|
.sections {
|
||
|
padding: 2em 0;
|
||
|
overflow: auto;
|
||
|
white-space: nowrap;
|
||
|
overflow-x: hidden;
|
||
|
}
|
||
|
|
||
|
.sections::-webkit-scrollbar { display: none; }
|
||
|
|
||
|
.section {
|
||
|
box-sizing: border-box;
|
||
|
display: inline-block;
|
||
|
width: 100vw;
|
||
|
white-space: initial;
|
||
|
color: #222;
|
||
|
transition: .05s;
|
||
|
}
|
||
|
|
||
|
|
||
|
.project-block {
|
||
|
padding: 4em 3em;
|
||
|
display: grid;
|
||
|
grid-template-columns: 50% 50%;
|
||
|
background-color: #ddd;
|
||
|
border-bottom: solid .2em #222;
|
||
|
}
|
||
|
|
||
|
.img-parent {
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
.img-parent img {
|
||
|
max-width: 40vw;
|
||
|
}
|
||
|
|
||
|
.text-block {
|
||
|
background-color: #fff;
|
||
|
}
|
||
|
|
||
|
|
||
|
@media only screen and (max-width: 700px) {
|
||
|
.project-block {
|
||
|
grid-template-columns: auto;
|
||
|
}
|
||
|
}
|