diff --git a/Easy/Rigvedi - Task 4/customize.svg b/Easy/Rigvedi - Task 4/customize.svg new file mode 100644 index 0000000..4db6718 --- /dev/null +++ b/Easy/Rigvedi - Task 4/customize.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/explore.svg b/Easy/Rigvedi - Task 4/explore.svg new file mode 100644 index 0000000..71e9da2 --- /dev/null +++ b/Easy/Rigvedi - Task 4/explore.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/extension.svg b/Easy/Rigvedi - Task 4/extension.svg new file mode 100644 index 0000000..f5d2412 --- /dev/null +++ b/Easy/Rigvedi - Task 4/extension.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/index.html b/Easy/Rigvedi - Task 4/index.html new file mode 100644 index 0000000..ec8828a --- /dev/null +++ b/Easy/Rigvedi - Task 4/index.html @@ -0,0 +1,122 @@ + + + + + + ChatGPT + + + + + +
+ +
+ + + ChatGPT + +
+ +
+ + ChatGPT + +
+ +
+
What can I help with?
+
+ +
+ + +
+
+
+ +
ChatGPT can make mistakes. Check important info.
+ +
+ +
+
+
+ + + +
+ +
+ +
ChatGPT
+
+
+ +
Explore GPTs
+
+
+ +
+ +
+ +
+ +
+
+ + + + \ No newline at end of file diff --git a/Easy/Rigvedi - Task 4/logout.svg b/Easy/Rigvedi - Task 4/logout.svg new file mode 100644 index 0000000..50aa46b --- /dev/null +++ b/Easy/Rigvedi - Task 4/logout.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/main.css b/Easy/Rigvedi - Task 4/main.css new file mode 100644 index 0000000..be27696 --- /dev/null +++ b/Easy/Rigvedi - Task 4/main.css @@ -0,0 +1,310 @@ +*{ + box-sizing: border-box; +} + +body { + background-color: #212121; + margin: 0; + font-family: 'Inter'; +} + +.wrap { + margin: 1em; + position: relative; + display: flex; + flex-direction: column; +} + +.wrap-2{ + margin: 1em; + position: relative; +} + +.remove{ + display: none; +} + +.header{ + display: flex; + width: 100%; + align-items: center; + + a{ + &:nth-of-type(n) { + margin-right: 1.2em; + } + text-decoration: none; + } + + .chatgpt{ + font-size: 1.15em; + font-weight: 550; + color: #B4B4B4; + } + + img{ + height: 1.35em; + } + + .b-prof{ + margin-left: auto; + border-radius: 50%; + height: 2.5em; + width: 2.5em; + padding: 0px; + border: none; + background-color: #B4B4B4; + font-weight: 600; + } +} + +.header-2{ + display: flex; + width: 100%; + align-items: center; + justify-content: space-between; + + a{ + text-decoration: none; + } + + img{ + height: 1.35em; + } + + .chatgpt{ + font-size: 1.15em; + font-weight: 550; + color: #B4B4B4; + } +} + +.main{ + display: flex; + flex-direction: column; + position: fixed; + width: 768px; + top: 50%; + left: 50%; + transform: translate(-50%,-60%); + + .what-help{ + font-size: 1.8em; + align-self: center; + margin-bottom: 1em; + color: #ECECEC; + } + + .ask-box{ + display: flex; + flex-direction: column; + width: 100%; + background-color: #303030; + padding: 0.5em; + border-radius: 1.5em; + + input{ + height: 2em; + font-size: 1em; + border: none; + width: 100%; + background-color: #303030; + outline: none; + color: #ECECEC; + ::placeholder { + color: #9B9B9B; + } + } + + .bottom{ + display: flex; + align-items: center; + padding-top: 1.8em; + + .b-plus{ + background-color: #303030; + color: #B4B4B4; + font-size: 2em; + height: 1em; + line-height: 1em; + width: 1em; + border-radius: 50%; + border-width: 0.1px; + padding: 0px; + } + img{ + height: 2.25em; + } + + .voice-note{ + margin-left: auto; + } + } + } +} + +.button{ + cursor: pointer; +} + +.footer{ + position: fixed; + align-self: center; + bottom: 0; + margin-bottom: 0.5em; + font-size: 0.7em; + color: #B4B4B4; +} + +.side{ + background: #171717; + font-size: 0.9em; + color: #ECECEC; + position: fixed; + z-index: 999; + top: 0; + left: 0; + height: 100vh; + margin: 0; + list-style: none; + width: 15em; + padding: 1em; + transform: translateX(-100%); + transition: transform 0.5s ease-in-out; + + .li1{ + display: flex; + margin-bottom: 1em; + align-items: center; + img{ + height: 1.35em; + } + .search{ + margin-left: auto; + margin-right: 0.5em; + img{ + height: 2em; + } + } + } + + .li2,.li3{ + display: flex; + align-items: center; + img{ + height: 2em; + margin-right: 0.5em; + } + .side-txt:hover{ + background-color: #474747; + } + } +} + +.side-open{ + transform: translateX(0); +} + +.plus-menu{ + width: 19em; + padding: 0.25em; + border-radius: 1em; + background-color: #B4B4B4; + position: fixed; + left: 1%; + top: 32%; + padding-right: 2.5em; + border-color: #ECECEC; + + ul{ + li{ + font-size: 0.9em; + color: black; + list-style: none; + display: flex; + align-items: center; + img{ + height: 1.35em; + margin-right: 0.25em; + } + .divider{ + margin: 1em 0; + height: 1px; + width: 100%; + border-bottom: 1px solid rgb(140, 139, 139); + } + } + } +} + +.prof{ + width: 20em; + padding: 0.25em; + border-radius: 1em; + background-color: #B4B4B4; + position: fixed; + top: 10%; + right: 1%; + padding-right: 2.5em; + + ul{ + li{ + font-size: 0.9em; + color: #212121; + list-style: none; + display: flex; + align-items: center; + margin: 0.5em 0; + img{ + height: 1.35em; + margin-right: 0.25em; + } + .divider{ + margin: 1em 0; + height: 1px; + width: 100%; + border-bottom: 1px solid rgb(140, 139, 139); + } + } + } +} + +li.h1:hover{ + background-color: #7d7d7d; +} + +@media(max-width: 798px) { + .main{ + width: 95%; + } +} + +@media(max-width: 510px){ + .ask-box{ + position: fixed; + top: 100%; + left: 50%; + transform: translate(-50%, 100%); + } + .plus-menu{ + position: fixed; + left: 1%; + top: 64%; + } +} + +@media(max-width: 768px){ + .header{ + display: none; + } + .prof{ + display: none; + } +} + +@media(min-width: 768px){ + .header-2{ + display: none; + } +} + diff --git a/Easy/Rigvedi - Task 4/menu-768.svg b/Easy/Rigvedi - Task 4/menu-768.svg new file mode 100644 index 0000000..a1b4a81 --- /dev/null +++ b/Easy/Rigvedi - Task 4/menu-768.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/Easy/Rigvedi - Task 4/new_chat.svg b/Easy/Rigvedi - Task 4/new_chat.svg new file mode 100644 index 0000000..d56bddc --- /dev/null +++ b/Easy/Rigvedi - Task 4/new_chat.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/search.svg b/Easy/Rigvedi - Task 4/search.svg new file mode 100644 index 0000000..880447b --- /dev/null +++ b/Easy/Rigvedi - Task 4/search.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/Easy/Rigvedi - Task 4/settings.svg b/Easy/Rigvedi - Task 4/settings.svg new file mode 100644 index 0000000..ab531f6 --- /dev/null +++ b/Easy/Rigvedi - Task 4/settings.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/side_cg.svg b/Easy/Rigvedi - Task 4/side_cg.svg new file mode 100644 index 0000000..de3b829 --- /dev/null +++ b/Easy/Rigvedi - Task 4/side_cg.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/side_explore.svg b/Easy/Rigvedi - Task 4/side_explore.svg new file mode 100644 index 0000000..ef2276c --- /dev/null +++ b/Easy/Rigvedi - Task 4/side_explore.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/sidebar.svg b/Easy/Rigvedi - Task 4/sidebar.svg new file mode 100644 index 0000000..0ef2f96 --- /dev/null +++ b/Easy/Rigvedi - Task 4/sidebar.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/Easy/Rigvedi - Task 4/upgrade.svg b/Easy/Rigvedi - Task 4/upgrade.svg new file mode 100644 index 0000000..09bbe43 --- /dev/null +++ b/Easy/Rigvedi - Task 4/upgrade.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/upload.svg b/Easy/Rigvedi - Task 4/upload.svg new file mode 100644 index 0000000..7f701c8 --- /dev/null +++ b/Easy/Rigvedi - Task 4/upload.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/voice_note.svg b/Easy/Rigvedi - Task 4/voice_note.svg new file mode 100644 index 0000000..daca6dc --- /dev/null +++ b/Easy/Rigvedi - Task 4/voice_note.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/Easy/Rigvedi - Task 4/windows.svg b/Easy/Rigvedi - Task 4/windows.svg new file mode 100644 index 0000000..2915975 --- /dev/null +++ b/Easy/Rigvedi - Task 4/windows.svg @@ -0,0 +1,7 @@ + + + + + + +