This commit introduces a new script that fetches and normalizes event data from Zoho Calendar using OAuth2. The script makes an API call to retrieve calendar events for the current month. The event data is then processed and formatted to be used by a Nunjucks template. Key Changes: - test(dummy-data): Created a dummy calendar and dummy events for development and testing. - feat(events): Added a new script to fetch event data from Zoho Calendar. - feat(oauth2): Implemented OAuth2 authentication for secure API access. - refactor(data): Normalized the fetched data payload for consistency. - feat(ui): Integrated the normalized data with a Nunjucks template to dynamically populate "event cards" on the community events page.
87 lines
1.8 KiB
CSS
87 lines
1.8 KiB
CSS
/* Global Styles */
|
|
html {
|
|
font-size: 17px; /* Base font size for scaling */
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
font-family: 'Calibri', sans-serif;
|
|
font-size: 1rem; /* Default font size based on 16px */
|
|
line-height: 1.5;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #bdd4da; /* Sky Bloom */
|
|
}
|
|
|
|
body h1 {
|
|
text-shadow: 0.5px 0.5px .5px #f7f7f7, /* Bottom-right top shadow */
|
|
-0.5px -0.5px .5px #f7f7f7, /* Top-left top shadow */
|
|
-0.5px 0.5px .5px #f7f7f7, /* Bottom-left top shadow */
|
|
0.5px -0.5px .5px #f7f7f7; /* Top-right top shadow */
|
|
}
|
|
|
|
|
|
|
|
/* Title Large (Arial Bold 30px) */
|
|
h1 {
|
|
font-family: 'Arial', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1.875rem; /* 30px for title */
|
|
}
|
|
|
|
/* Title (Arial Bold 25px) */
|
|
h2 {
|
|
font-family: 'Arial', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1.5625rem;
|
|
}
|
|
|
|
/* Subtitle (Comfortaa Normal 15px) */
|
|
h3 {
|
|
font-family: 'Comfortaa', sans-serif;
|
|
font-size: .9375rem ; /* 15px for subtitle */
|
|
}
|
|
|
|
/* Body Large (Calibri Normal 20px) */
|
|
p.body-large {
|
|
font-family: 'Calibri', sans-serif;
|
|
font-size: 1.25rem; /* 20px for body large */
|
|
}
|
|
|
|
/* Body Strong (Calibri Bold 16px) */
|
|
strong {
|
|
font-family: 'Calibri', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1rem; /* 16px for body strong */
|
|
}
|
|
|
|
/* Body (Calibri Normal 16px) */
|
|
p.body {
|
|
font-family: 'Calibri', sans-serif;
|
|
font-size: 1rem; /* 16px for regular body text */
|
|
}
|
|
|
|
/* Captions (Arial Bold 11px) */
|
|
figcaption {
|
|
font-family: 'Arial', sans-serif;
|
|
font-weight: bold;
|
|
font-size: .6875rem; /* 11px for captions */
|
|
}
|
|
|
|
@media (max-width: 780px) {
|
|
html{
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
|
|
main {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
padding: 20px;
|
|
} |