Added desc tags
This commit is contained in:
parent
4468e14a8c
commit
950227bacf
@ -1695,6 +1695,67 @@ section {
|
|||||||
flex-flow: row-reverse;
|
flex-flow: row-reverse;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* .ribbon {
|
||||||
|
position: absolute;
|
||||||
|
display: inline-block;
|
||||||
|
font-weight: 500;
|
||||||
|
letter-spacing: 0.15em;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.ribbon:after, .ribbon:before {
|
||||||
|
content: " ";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -.5em;
|
||||||
|
width: 1em;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #69c48d;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
.ribbon:after {
|
||||||
|
right: -.57em;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
h3:before {
|
||||||
|
bottom: auto;
|
||||||
|
top: -.5em;
|
||||||
|
left: -.57em;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
.ribbon span {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
padding: .15em .75em;
|
||||||
|
text-decoration: none;
|
||||||
|
color: #192238;
|
||||||
|
background-color: #8ed2a9;
|
||||||
|
}
|
||||||
|
.ribbon span:after, h1 span:before {
|
||||||
|
content: " ";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
bottom: -.5em;
|
||||||
|
left: -.05em;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
.ribbon span:before {
|
||||||
|
bottom: auto;
|
||||||
|
top: -.5em;
|
||||||
|
border-bottom: 0.5em solid #398e5b;
|
||||||
|
border-left: .5em solid transparent;
|
||||||
|
}
|
||||||
|
.ribbon span:after {
|
||||||
|
left: auto;
|
||||||
|
right: -.05em;
|
||||||
|
border-top: 0.5em solid #398e5b;
|
||||||
|
border-right: .5em solid transparent;
|
||||||
|
} */
|
||||||
|
|
||||||
.workshop-img {
|
.workshop-img {
|
||||||
height: 30px;
|
height: 30px;
|
||||||
width: 30px;
|
width: 30px;
|
||||||
@ -1754,6 +1815,16 @@ section {
|
|||||||
border: 1px solid rgb(161, 161, 161);
|
border: 1px solid rgb(161, 161, 161);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.workshop-difficulty {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #176e2a;
|
||||||
|
padding: 3px 30px;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
|
||||||
.workshop-footer {
|
.workshop-footer {
|
||||||
padding: 10px 30px;
|
padding: 10px 30px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -496,6 +496,9 @@
|
|||||||
<h3 class="title-font-weight">Web Dev Workshop</h3>
|
<h3 class="title-font-weight">Web Dev Workshop</h3>
|
||||||
<h4>Study Room</h4>
|
<h4>Study Room</h4>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div class="ribbon">
|
||||||
|
<span>Beginner-Friendly</span>
|
||||||
|
</div> -->
|
||||||
<div class="workshop-topics">
|
<div class="workshop-topics">
|
||||||
<span class="tooltip" id="git-tooltip"><img class="workshop-img" loading="lazy" src="img/git.png" alt="Git"></span>
|
<span class="tooltip" id="git-tooltip"><img class="workshop-img" loading="lazy" src="img/git.png" alt="Git"></span>
|
||||||
<span class="tooltip" id="html-tooltip"><img class="workshop-img" loading="lazy" src="img/html.png" alt="HTML"></span>
|
<span class="tooltip" id="html-tooltip"><img class="workshop-img" loading="lazy" src="img/html.png" alt="HTML"></span>
|
||||||
@ -506,6 +509,7 @@
|
|||||||
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>11am - 12pm</div>
|
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>11am - 12pm</div>
|
||||||
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="10" r="3"/><path d="M12 21.7C17.3 17 20 13 20 10a8 8 0 1 0-16 0c0 3 2.7 6.9 8 11.7z"/></svg>Gilroy Library</div>
|
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="10" r="3"/><path d="M12 21.7C17.3 17 20 13 20 10a8 8 0 1 0-16 0c0 3 2.7 6.9 8 11.7z"/></svg>Gilroy Library</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="workshop-difficulty"><p>Beginner-Friendly</p><p>Open to public</p></div>
|
||||||
<div class="workshop-desc">
|
<div class="workshop-desc">
|
||||||
<h4>Description</h4>
|
<h4>Description</h4>
|
||||||
<p>A chance for you to learn the world's most common version control system: Git -- and how to create your own website!</p><br>
|
<p>A chance for you to learn the world's most common version control system: Git -- and how to create your own website!</p><br>
|
||||||
@ -541,6 +545,7 @@
|
|||||||
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>1 - 2pm</div>
|
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>1 - 2pm</div>
|
||||||
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="10" r="3"/><path d="M12 21.7C17.3 17 20 13 20 10a8 8 0 1 0-16 0c0 3 2.7 6.9 8 11.7z"/></svg>Gilroy Library</div>
|
<div><svg class="workshop-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="10" r="3"/><path d="M12 21.7C17.3 17 20 13 20 10a8 8 0 1 0-16 0c0 3 2.7 6.9 8 11.7z"/></svg>Gilroy Library</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="workshop-difficulty"><p>Beginner-Friendly</p><p>Open to public</p></div>
|
||||||
<div class="workshop-desc">
|
<div class="workshop-desc">
|
||||||
<h4>Description</h4>
|
<h4>Description</h4>
|
||||||
<p>Join us for a lecture on Python Programming basics. You'll learn basic data structures and be able to code your own programs!</p><br>
|
<p>Join us for a lecture on Python Programming basics. You'll learn basic data structures and be able to code your own programs!</p><br>
|
||||||
|
Loading…
Reference in New Issue
Block a user