diff --git a/index.html b/index.html index 91cad2bd..89ee4f10 100644 --- a/index.html +++ b/index.html @@ -1,6 +1,7 @@ + @@ -9,7 +10,9 @@ - + @@ -23,158 +26,188 @@ - + + @media (max-width: 576px) { + .feature-post div { + align-items: center; + } + .tags.social { + justify-content: center; + } - -.form-container { - max-width: 350px; - padding: 20px; -} -.form-group input { - width: 100%; - padding: 1px; + - + + - +
- +
- + - - + - +
-
-
+
+
-
+
- +
-
- +
+ Roaming Routes

@@ -608,8 +662,10 @@

Forgot Password

13 @@ -626,12 +682,14 @@

Forgot Password

- +
-
+
Gaming Chronicles @@ -641,13 +699,15 @@

Forgot Password

Mon 13,2023   12 -
@@ -661,12 +721,14 @@

Forgot Password

- +
-
+
Virtual Realms @@ -677,9 +739,11 @@

Forgot Password

Wed 09,2023   19 - @@ -731,12 +799,14 @@

Forgot Password

- +
-
+
Mouthwatering Memoirs @@ -747,9 +817,11 @@

Forgot Password

Tue 02,2021   10 - @@ -803,12 +879,14 @@

Forgot Password

- +
-
+
Culinary Delights @@ -820,8 +898,10 @@

Forgot Password

12 @@ -838,14 +918,16 @@

Forgot Password

- +
-
+
- Voyage Vista: Where Travel Dreams Take Flight + Voyage Vista: Where Travel Dreams Take Flight @@ -855,8 +937,10 @@

Forgot Password

12 @@ -873,14 +957,16 @@

Forgot Password

- +
-
+
- Beak & Claw: A Chronicle of Birds in the Wild + Beak & Claw: A Chronicle of Birds in the Wild @@ -889,9 +975,11 @@

Forgot Password

Wed 02,2023   12 - - -

-
- -
-
-
- - -
-
-
-
- - + +
+ + +
+ +
+ + +
+ -
- - -
- -
- - -
-
+
- -
- - -
- +
+
- -
+ +
- +
@@ -1144,131 +1254,153 @@

Forgot Password

- + - -
- - -
-
-

Frequently Asked Questions

-
-
-
-

How do I switch between dark and light themes?

- - - -
-
- -

You can easily switch between dark and light themes by clicking the theme toggle button located in the website header. This allows you to customize your viewing experience according to your preference.

-
-
+
+
+ + +
+
+

Frequently Asked Questions

+
+
+
+

How do I switch between dark and light themes?

+ + + +
+
+ +

You can easily switch between dark and light themes by clicking + the theme + toggle button located in the website header. This allows you to customize your viewing + experience + according to your preference.

+
+
-
-
-

How do I use the 'Start Writing' page?

- - - -
-
- -

The 'Start Writing' page provides a simple interface for quickly creating and publishing blog posts. Just click "Start Writing" from the navigation bar, fill in your title, content, and tags, and publish your blog with a single click.

-
-
+
+
+

How do I use the 'Start Writing' page?

+ + + +
+
+ +

The 'Start Writing' page provides a simple interface for + quickly creating and + publishing blog posts. Just click "Start Writing" from the navigation bar, fill in your + title, content, + and tags, and publish your blog with a single click.

+
+
-
-
-

How does the sliding bar with latest blogs work?

- - - -
-
- -

The sliding bar on the home page features the latest blogs published on the platform. It updates automatically and allows users to easily scroll through and click on any blog that catches their attention.

-
-
+
+
+

How does the sliding bar with latest blogs work?

+ + + +
+
+ +

The sliding bar on the home page features the latest blogs + published on the + platform. It updates automatically and allows users to easily scroll through and click + on any blog that + catches their attention.

+
+
-
-
-

How are top picks chosen for the leading blog page?

- - - -
-
- -

Top picks are curated by a combination of editor recommendations and user engagement metrics, such as views, likes, and comments, to highlight the best content available on Word Wise.

-
-
+
+
+

How are top picks chosen for the leading blog page?

+ + + +
+
+ +

Top picks are curated by a combination of editor + recommendations and user + engagement metrics, such as views, likes, and comments, to highlight the best content + available on Word + Wise.

+
+
-
-
-

How can I stay updated with new blog posts?

- - - -
- -
- -

You can stay updated by following your favorite authors or topics, and by checking the sliding bar for the latest blog posts. You can also subscribe to newsletters or enable notifications for real-time updates.

+
+
+

How can I stay updated with new blog posts?

+ + + +
+ +
+ +

You can stay updated by following your favorite authors or + topics, and by + checking the sliding bar for the latest blog posts. You can also subscribe to + newsletters or enable + notifications for real-time updates.

+
+
+
+ +
+

Word of the Day

+

+

- - - -
-

Word of the Day

-

-

-
- - - - -
-
-

Subscribe to Our Newsletter

-

Stay updated with the latest articles and insights from WordWise.

-
- - -
-
-
- - - -
- - - - - - + + + + +
+
+

Subscribe to Our Newsletter

+

Stay updated with the latest articles and insights from WordWise.

+
+ + +
+
+
+ + + +
+ + + + + +
@@ -1276,10 +1408,10 @@

Subscribe to Our Newsletter

chatbot Welcome to Word Wise !
- How can I help You? ^_^ + How can I help You? ^_^ - +
@@ -1289,165 +1421,180 @@

Subscribe to Our Newsletter

+
- - - - - + +
+
+

© WordWise. All rights reserved.

+
+
+ + + + + + @@ -1461,54 +1608,54 @@

Connect with us

- - - + + + - -
- - - + +
+ + + @@ -1518,4 +1665,5 @@

Connect with us

- + + \ No newline at end of file diff --git a/style.css b/style.css index 4b5b45c5..967487da 100644 --- a/style.css +++ b/style.css @@ -395,25 +395,78 @@ html, body { background: #f4978e; } - +footer a{ + color:black; +} body.dark-mode footer a{ - background-color: #333; - color: #f2dede; + background-color: #f7f7f7; + color: #ffffff; } body.dark-mode footer p{ - color: #f2dede; + color: #000000; } body.dark-mode footer h2{ color: #f2dede; } +bod body.dark-mode footer address{ color: #f2dede; } body.dark-mode footer .phone{ color: #f2dede; } + +body.dark-mode footer p{ + color: #f2dede; +} + +body.dark-mode .text-title{ + color:#f2dede ; +} +.footer-title { + position: relative; /* Allows for positioning */ + display: inline-block; /* Fits the text content */ + color: #333; /* Text color */ + font-size: 24px; /* Adjust font size as needed */ + text-decoration: none; /* Remove default underline */ + transition: color 0.3s ease; /* Smooth color transition */ +} + +.footer-title:hover { + color: #f8b5b5; /* Change color on hover (optional) */ + text-decoration: none; /* Remove default underline to customize */ +} + +.footer-title:hover::after { + content: ''; /* Pseudo-element for custom underline */ + position: absolute; /* Position relative to the title */ + left: 0; /* Align to the left */ + right: 0; /* Align to the right */ + bottom: -2px; /* Position just below the text */ + height: 2px; /* Thickness of the underline */ + background: #f8b5b5; /* Underline color */ + transform: scaleX(1); /* Show underline */ + transition: transform 0.3s ease; /* Smooth transition */ +} + +.footer-title::after { + content: ''; /* Create a pseudo-element */ + position: absolute; /* Position it relative to the title */ + left: 0; /* Align to the left */ + right: 0; /* Align to the right */ + bottom: -2px; /* Position below the text */ + height: 2px; /* Thickness of the underline */ + background: #f8b5b5; /* Underline color */ + transform: scaleX(0); /* Initially hide it */ + transition: transform 0.3s ease; /* Smooth transition */ +} + +.footer-title:hover::after { + transform: scaleX(1); /* Show underline on hover */ +} + /* Signup input bar in footer*/ .signup-container { width: 90%; @@ -465,7 +518,7 @@ body.dark-mode footer .phone{ text-decoration: none; } .feature-post .text-title { - color: #b0b0b0; /* Light grey color for titles */ + color: var(--text-color); /* Light grey color for titles */ } .feature-post .secondary-title { @@ -480,7 +533,9 @@ body.dark-mode footer .phone{ text-decoration: none; /* Remove underline for links */ } - +.text-title{ + color: white; +} .form-popup { display: none; @@ -515,6 +570,7 @@ body.dark-mode .bookmark-section { background-color: #141414; /* Dark background for the bookmark section */ color: #ffffff; /* Optional: Change text color to white for better contrast */ } + body.dark-mode .bookmark-section h1{ color: #ffffff; /* Optional: Change text color to white for better contrast */ } @@ -1702,9 +1758,7 @@ a { } -.text-dark { - color: var(--text-color); -} + .text-primary { color: var(--text-color); @@ -1960,9 +2014,11 @@ a { } #footer { - padding-top: 5em; + padding-top: 3.2em; +} +#foot_line{ + color:#f8b5b5; } - #footer .feature-post .flex-item { margin-bottom: 10px; } @@ -2334,7 +2390,7 @@ h1 { margin-left: -5%; } } - +.darl-mode .accordion__wrapper { background-color: #f3b5af; box-shadow: 0px 60px 56px -12px rgba(9, 40, 163, 0.05); @@ -2457,7 +2513,15 @@ h1 { color: black; } - +[data-theme="dark"] #foot_para{ + color: #e7e5e5;/*form heading made light-colored in dark theme*/ +} +#mailhover{ + color:var(--text-color); +} +[data-theme="dark"] #mailhover{ + color: #e7e5e5;/*form heading made light-colored in dark theme*/ +} footer .text-lg { margin: 10px 0 0 0; @@ -3609,4 +3673,4 @@ nav1{ .hamburger { left: 190px; } -} \ No newline at end of file +}