Bootcamp/Levels
No edit summary Tags: Reverted 2017 source edit |
No edit summary Tags: Reverted 2017 source edit |
||
| Line 35: | Line 35: | ||
} | } | ||
.section-container { | .section-container { | ||
display: | display: grid; | ||
grid-template-columns: 150px auto; | |||
align-items: center; | align-items: center; | ||
margin: 20px 0; | margin: 20px 0; | ||
gap: 20px; | |||
} | } | ||
.section { | .section { | ||
| Line 45: | Line 47: | ||
cursor: pointer; | cursor: pointer; | ||
transition: transform 0.3s ease; | transition: transform 0.3s ease; | ||
height: 300px; | height: 300px; | ||
display: flex; | display: flex; | ||
| Line 58: | Line 59: | ||
.beginner { | .beginner { | ||
background: rgba(255, 218, 187, 0.60); | background: rgba(255, 218, 187, 0.60); | ||
} | } | ||
.intermediate { | .intermediate { | ||
background: rgba(217, 217, 217, 0.45); | background: rgba(217, 217, 217, 0.45); | ||
} | } | ||
.advanced { | .advanced { | ||
background: #112B3C; | background: #112B3C; | ||
color: white; | color: white; | ||
} | } | ||
.section-title { | .section-title { | ||
| Line 83: | Line 81: | ||
background-size: contain; | background-size: contain; | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
} | } | ||
.icon-1 { | .icon-1 { | ||
| Line 109: | Line 106: | ||
width: 100px; | width: 100px; | ||
height: 100px; | height: 100px; | ||
margin: 10px | margin: 0 auto 10px; | ||
} | } | ||
.section-container { | .section-container { | ||
grid-template-columns: 1fr; | |||
align | text-align: center; | ||
} | } | ||
.section { | .section { | ||
width: 100%; | width: 100%; | ||
margin: 10px 0; | margin: 10px 0; | ||
padding: 20px; | padding: 20px; | ||
} | } | ||
} | } | ||
| Line 139: | Line 126: | ||
} | } | ||
</style> | </style> | ||
</head> | |||
<body> | |||
<div class="bootcamp-container"> | <div class="bootcamp-container"> | ||
<div class="header"> | <div class="header"> | ||
| Line 155: | Line 144: | ||
<div class="section-container"> | <div class="section-container"> | ||
<a href="#" class="section intermediate" onclick="choosePath('intermediate')"> | <a href="#" class="section intermediate" onclick="choosePath('intermediate')"> | ||
<div class="section-title">INTERMEDIATE</div> | <div class="section-title">INTERMEDIATE</div> | ||
<div class="section-content">You have some understanding of models but you need to brush up on what you know and learn what else is new. Join the trail from here!</div> | <div class="section-content">You have some understanding of models but you need to brush up on what you know and learn what else is new. Join the trail from here!</div> | ||
</a> | </a> | ||
<div class="icon-placeholder icon-2"></div> | |||
</div> | </div> | ||
Revision as of 21:11, 28 July 2024
Choose the right option for you
This page was edited 174 days ago on 08/10/2024. What links here