wellfedbison/gilroyhacks.com
wellfedbison/gilroyhacks.com
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added desc tags

Browse Source
This commit is contained in:
James Dinh 2022-07-24 11:31:52 -07:00
parent 4468e14a8c
commit 950227bacf
2 changed files with 76 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
css/general.css
View File

@ -1695,6 +1695,67 @@ section {
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 {
height: 30px;
width: 30px;
@ -1754,6 +1815,16 @@ section {
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 {
padding: 10px 30px;
text-align: center;

5
index.html
View File

@ -496,6 +496,9 @@
<h3 class="title-font-weight">Web Dev Workshop</h3>
<h4>Study Room</h4>
</div>
<!-- <div class="ribbon">
<span>Beginner-Friendly</span>
</div> -->
<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="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="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 class="workshop-difficulty"><p>Beginner-Friendly</p><p>Open to public</p></div>
<div class="workshop-desc">
<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>
@ -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="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 class="workshop-difficulty"><p>Beginner-Friendly</p><p>Open to public</p></div>
<div class="workshop-desc">
<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>