This is an automated email from the ASF dual-hosted git repository.
apratim pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-resilientdb-site.git
The following commit(s) were added to refs/heads/master by this push:
new 8a991c9 Updated CSS
8a991c9 is described below
commit 8a991c9859ff53ac4f1805900f22793f0c7dad86
Author: Apratim Shukla <[email protected]>
AuthorDate: Wed May 22 23:26:09 2024 -0700
Updated CSS
---
src/app/layout.tsx | 1 -
src/components/About/index.tsx | 2 +-
src/styles/index.css | 103 ++++++++++++++++++++---------------------
3 files changed, 50 insertions(+), 56 deletions(-)
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 52bcd90..4c7a9bb 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -4,7 +4,6 @@ import Footer from "@/components/Footer";
import Header from "@/components/Header";
import ScrollToTop from "@/components/ScrollToTop";
import { Inter } from "next/font/google";
-import "node_modules/react-modal-video/css/modal-video.css";
import "../styles/index.css";
const inter = Inter({ subsets: ["latin"] });
diff --git a/src/components/About/index.tsx b/src/components/About/index.tsx
index 319ddd0..a705096 100644
--- a/src/components/About/index.tsx
+++ b/src/components/About/index.tsx
@@ -2,7 +2,7 @@ import Image from "next/image";
const About = () => {
return (
- <section className="py-16 md:py-20 lg:py-28" style={{ backgroundImage:
`url('data:image/svg+xml,<svg id="visual" viewBox="0 0 2000 1000" width="2000"
height="1000" xmlns="http://www.w3.org/2000/svg";
xmlns:xlink="http://www.w3.org/1999/xlink"; version="1.1"><rect x="0" y="0"
width="2000" height="1000" fill="%230F0F1A"></rect><g
transform="translate(961.35041104432 476.3922111923553)"><path d="M284
-215.3C365.2 -124.6 426.4 -6.7 407.5 99.8C388.6 206.3 289.8 301.4 172.6
357.3C55.5 413.2 [...]
+ <section className="py-16 md:py-20 lg:py-28" style={{ backgroundImage:
`url('data:image/svg+xml,<svg id="visual" viewBox="0 0 2000 1000" width="2000"
height="1000" xmlns="http://www.w3.org/2000/svg";
xmlns:xlink="http://www.w3.org/1999/xlink"; version="1.1"><rect x="0" y="0"
width="2000" height="1000" fill="%230F0F1A"></rect><g
transform="translate(961.35041104432 476.3922111923553)"><path d="M284
-215.3C365.2 -124.6 426.4 -6.7 407.5 99.8C388.6 206.3 289.8 301.4 172.6
357.3C55.5 413.2 [...]
<div className="container">
<div className="-mx-4 flex flex-wrap items-center">
<div className="w-full px-4 lg:w-1/2">
diff --git a/src/styles/index.css b/src/styles/index.css
index 4577cbe..f5e41f8 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -36,16 +36,16 @@
overflow: hidden;
max-height: 0;
transition: max-height 0.15s all, transform 0.15s all;
- transform: translateY(-10px); /* Move up when collapsed */
+ transform: translateY(-10px);
background-color: #1E232E;
- padding: 0; /* Set padding to 0 when collapsed */
+ padding: 0;
width: 100%;
}
.expanded .accordion-content {
- max-height: 500px; /* Adjust based on content size */
- transform: translateY(0px); /* Stay in place when expanded */
- padding: 10px; /* Apply padding only when expanded */
+ max-height: 500px;
+ transform: translateY(0px);
+ padding: 10px;
background-color: #151523;
}
@@ -55,72 +55,72 @@
background-color: #131320;
padding: 10px;
width: 100%;
- position: relative; /* Needed for absolute positioning of the arrow */
+ position: relative;
}
.title-and-badge {
display: flex;
- align-items: center; /* Vertically align items in the center */
- justify-content: flex-start; /* Align items to the left for desktop view */
- flex-wrap: nowrap; /* Prevent wrapping in desktop view */
+ align-items: center;
+ justify-content: flex-start;
+ flex-wrap: nowrap;
}
.title-text {
- overflow: hidden; /* Prevent text from overflowing */
- text-overflow: ellipsis; /* Add ellipsis when text overflows */
- white-space: nowrap; /* Keep the title in a single line */
- flex-grow: 1; /* Allow title text to expand within the container */
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ flex-grow: 1;
}
.badge {
- margin-left: 0.5rem; /* Space between title text and badge */
- background-color: #1E232E; /* Distinctive background color */
- border-radius: 5px; /* Rounded corners for the badge */
- padding: 2px 8px; /* Padding inside the badge */
- flex-shrink: 0; /* Prevent badge from shrinking */
+ margin-left: 0.5rem;
+ background-color: #1E232E;
+ border-radius: 5px;
+ padding: 2px 8px;
+ flex-shrink: 0;
}
.badge-award {
- margin-left: 0.5rem; /* Space between title text and badge */
- background-color: #203c77; /* Distinctive background color */
- border-radius: 5px; /* Rounded corners for the badge */
- padding: 2px 8px; /* Padding inside the badge */
- flex-shrink: 0; /* Prevent badge from shrinking */
+ margin-left: 0.5rem;
+ background-color: #203c77;
+ border-radius: 5px;
+ padding: 2px 8px;
+ flex-shrink: 0;
}
.arrow {
- position: absolute; /* Position the arrow absolutely to keep it on the right
*/
- right: 10px; /* Distance from the right edge */
- transition: transform 0.3s ease; /* Smooth transition for rotation */
+ position: absolute;
+ right: 10px;
+ transition: transform 0.3s ease;
}
@media (max-width: 750px) {
.title-and-badge {
- flex-wrap: wrap; /* Allow items to wrap to the next line in mobile view */
- justify-content: flex-start; /* Align items to the left even when wrapped
*/
- padding-right: 30px; /* Right padding to avoid overlap with the arrow */
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ padding-right: 30px;
flex-grow: 1;
}
.title-text, .badge {
- flex-basis: 100%; /* Each takes full width of the container when wrapped */
- white-space: normal; /* Allow text to wrap naturally */
+ flex-basis: 100%;
+ white-space: normal;
}
.badge {
- order: 2; /* Position badge below title text in mobile view */
- margin-left: 0; /* No left margin in mobile view */
+ order: 2;
+ margin-left: 0;
margin-bottom: 2px;
}
.title-text, .badge-award {
- flex-basis: 100%; /* Each takes full width of the container when wrapped */
- white-space: normal; /* Allow text to wrap naturally */
+ flex-basis: 100%;
+ white-space: normal;
}
.badge-award {
- order: 2; /* Position badge below title text in mobile view */
- margin-left: 0; /* No left margin in mobile view */
+ order: 2;
+ margin-left: 0;
}
}
@@ -143,13 +143,11 @@
border-bottom-right-radius: 10px;
}
-/* When last accordion-item is expanded, remove border-radius from title */
.accordion-item:last-child.expanded .accordion-title {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
-/* When last accordion-item is expanded, add border-radius to content */
.accordion-item:last-child.expanded .accordion-content {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
@@ -159,41 +157,38 @@
transform: rotate(180deg);
}
-/* Specific styles for the SinglePublication container */
.publication-container .rounded-sm {
- background: transparent; /* Remove background */
- border: none; /* Remove borders */
- box-shadow: none; /* Remove shadows */
+ background: transparent;
+ border: none;
+ box-shadow: none;
}
.year-selector {
display: flex;
- width: 100%; /* Match with accordion width */
- justify-content: space-around; /* Distribute space evenly */
- margin-bottom: 20px; /* Spacing between year selector and publications */
+ width: 100%;
+ justify-content: space-around;
+ margin-bottom: 20px;
}
.year-btn {
- flex-grow: 1; /* Makes each button expand to fill the available space */
- text-align: center; /* Centers the text inside the button */
+ flex-grow: 1;
+ text-align: center;
padding-bottom: 10px;
}
.year-btn.active {
- border-bottom: 2px solid #25D8C5; /* Active state indication */
+ border-bottom: 2px solid #25D8C5;
}
.SinglePublication {
- width: 80%; /* Standard width to align with the year selector */
- margin: 0 auto; /* Center the accordion horizontally */
+ width: 80%;
+ margin: 0 auto;
}
.accordion-item {
- width: 100%; /* Ensures accordion items stretch to fill the container */
+ width: 100%;
}
-/* styles.css or your global CSS file */
-
.badge-download {
display: inline-block;
padding: 0.25rem 0.5rem;
