Complete Revamp and Redesigned BlissRoms Website
Co-authored-by: Ayan Mukherjee <mukherjeeayan725@gmail.com>
Signed-off-by: Ayan Mukherjee <mukherjeeayan725@gmail.com>
Signed-off-by: Jackeagle <jackeagle102@gmail.com>
diff --git a/components/member.css b/components/member.css
new file mode 100644
index 0000000..2498696
--- /dev/null
+++ b/components/member.css
@@ -0,0 +1,133 @@
+.member-container {
+ cursor: pointer;
+ display: flex;
+ position: relative;
+ align-items: flex-start;
+ justify-content: center;
+}
+.member-container1 {
+ flex: 0 0 auto;
+ width: 240px;
+ height: 280px;
+ margin: var(--dl-space-space-halfunit);
+ display: flex;
+ padding: var(--dl-space-space-unit);
+ transition: 0.3s;
+ align-items: center;
+ border-radius: var(--dl-radius-radius-radius8);
+ flex-direction: column;
+ justify-content: center;
+ background-color: #121212;
+}
+.member-container1:hover {
+ box-shadow: 0px 2px 32px 24px #000000;
+ background-color: #181818;
+}
+.member-image {
+ width: 104px;
+ height: 104px;
+ min-width: var(--dl-size-size-small);
+ min-height: var(--dl-size-size-small);
+ object-fit: cover;
+ border-radius: var(--dl-radius-radius-round);
+}
+.member-text {
+ color: var(--dl-color-primary-300);
+ margin-top: var(--dl-space-space-unit);
+}
+.member-text1 {
+ color: var(--dl-color-gray-900);
+ align-self: center;
+ margin-top: var(--dl-space-space-halfunit);
+ text-align: center;
+ margin-bottom: var(--dl-space-space-halfunit);
+}
+.member-text2 {
+ color: var(--dl-color-gray-500);
+ width: 250px;
+ display: none;
+ text-align: center;
+}
+.member-icons {
+ flex: 0 0 auto;
+ display: flex;
+ flex-wrap: wrap;
+ margin-top: var(--dl-space-space-halfunit);
+ align-items: center;
+ margin-bottom: var(--dl-space-space-halfunit);
+ justify-content: center;
+}
+.member-icon {
+ fill: #D9D9D9;
+ width: 20px;
+ transition: 0.3s;
+}
+.member-icon:hover {
+ fill: var(--dl-color-primary-500);
+}
+.member-icon2 {
+ fill: #D9D9D9;
+ width: 20px;
+ transition: 0.3s;
+ margin-left: var(--dl-space-space-unit);
+ margin-right: var(--dl-space-space-unit);
+}
+.member-icon2:hover {
+ fill: var(--dl-color-primary-500);
+}
+.member-icon4 {
+ fill: #D9D9D9;
+ width: 20px;
+ transition: 0.3s;
+}
+.member-icon4:hover {
+ fill: var(--dl-color-primary-500);
+}
+
+
+
+
+
+.rootClassName5 {
+ align-self: center;
+}
+
+
+
+
+
+
+
+
+@media(max-width: 479px) {
+ .member-container {
+ width: auto;
+ }
+ .member-container1 {
+ width: auto;
+ height: auto;
+ margin: 0px;
+ padding-top: var(--dl-space-space-unit);
+ padding-left: 24px;
+ padding-right: 24px;
+ padding-bottom: var(--dl-space-space-unit);
+ }
+ .member-image {
+ width: var(--dl-size-size-medium);
+ height: var(--dl-size-size-medium);
+ min-width: var(--dl-size-size-small);
+ min-height: var(--dl-size-size-small);
+ }
+ .member-text1 {
+ width: var(--dl-size-size-medium);
+ }
+ .member-icon {
+ width: var(--dl-size-size-xsmall);
+ }
+ .member-icon2 {
+ width: var(--dl-size-size-xsmall);
+ }
+ .member-icon4 {
+ width: var(--dl-size-size-xsmall);
+ }
+}