setup gh-pages

2024-04-03 11:38:24 -04:00
commit d81bef8a6e
39 changed files with 33112 additions and 0 deletions
--- a/src/components/Instructors/InstructorsElements.js
+++ b/src/components/Instructors/InstructorsElements.js
@@ -0,0 +1,130 @@
+import styled from "styled-components";
+
+
+export const InstructorsContainer = styled.div` 
+    color: #fff;
+    /* background: #f9f9f9; */
+    background: ${({lightBg}) => (lightBg ? '#57c6d1': '#010606')};
+
+    @media screen and (max-width: 768px) {
+        padding: 100px 0;
+    }
+`
+
+export const InstructorsWrapper = styled.div`
+    display: grid ; 
+    z-index: 1;
+    width: 100% ; 
+    max-width: 1100px;
+    margin-right: auto;
+    margin-left: auto;
+    padding: 0 24px;
+    justify-content: center;
+`
+
+export const InstructorsRow = styled.div` 
+    display: grid; 
+    grid-auto-columns: minmax(auto, 1fr);
+    align-items: center;
+    grid-template-areas: ${({imgStart}) => (imgStart ? `'col2 col1'` : `'col1 col2'`)};
+
+    @media screen and (max-width: 768px){
+        grid-template-areas: ${({imgStart}) => (imgStart ? `'col1' 'col2'` : `'col1 col1' 'col2 col2'`)};
+    }
+`
+
+export const InstructorsRow2 = styled.div` 
+    display: grid; 
+    grid-auto-columns: minmax(auto, 1fr);
+    align-items: top;
+    grid-template-areas: ${({imgStart}) => (imgStart ? `'col2 col1'` : `'col1 col2'`)};
+
+    @media screen and (max-width: 768px){
+        grid-template-areas: ${({imgStart}) => (imgStart ? `'col1' 'col2'` : `'col1 col1' 'col2 col2'`)};
+    }
+`
+
+
+export const Column1 = styled.div` 
+    margin-bottom: 15px;
+    padding: 0 15px;
+    grid-area: col1;
+`
+
+export const Column2 = styled.div` 
+    margin-bottom: 15px;
+    padding: 0 15px;
+    grid-area: col2;
+`
+
+export const TextWrapper = styled.div`
+    max-width: 540px ; 
+    padding-top: 0;
+    padding-bottom: 0;
+`
+
+export const TopLine = styled.p` 
+    color: #773c23;
+    font-size: 16px;
+    line-height: 16px;
+    font-weight: 700;
+    letter-spacing: 1.4px;
+    text-transform: uppercase;
+    margin-bottom: 16px;
+`
+
+export const Heading= styled.h1` 
+
+    margin-bottom: 24px;
+    font-size: 48px;
+    line-height: 1.1;
+    font-weight: 600;
+    color: ${({lightText}) => (lightText ? '#f7f8fa' : '#010606')};
+    
+    @media screen and (max-width: 480px)
+    {
+        font-size: 32px;
+    }
+`
+
+
+export const Subtitle = styled.p` 
+    max-width: 440px;
+    margin-bottom: 35px;
+    font-size: 18px;
+    line-height: 24px;
+    color: ${({darkText})=> (darkText ? '#010606' : '#fff')};
+
+`
+
+export const BtnWrap = styled.div`
+    display: flex;
+    justify-content: flex-start;
+`
+
+export const ImgWrap = styled.div` 
+    max-width: 555px;
+    height: 100%;
+`
+
+export const Img = styled.img`
+  width: 100%;
+  margin-top: 0;
+  margin-right: 0;
+  margin-left: 10px;
+  padding-right: 0;
+`;
+
+
+export const InstructorsContent = styled.div` 
+    z-index: 3; 
+    width: 100% ; 
+    max-width: 1100px;
+    position: static;
+    padding: 8px 0px;
+    margin: 10px 0px;
+    display: flex;
+    flex-direction: column;
+    align-items: left ; 
+    list-style-position: inside;
+`