word-games-theme 2.0.8 → 2.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2f7d6618cfa469c893f44e0317699d6568e22d8c6c30b6f652ec7e2901c7cffe
-  data.tar.gz: 16253ffc372b34c5d9d8eff1260ae4c9e6e08c442e22a70c89c4c76901662ae6
+  metadata.gz: c7802ef660368c3742b5d99e44b8d7c76c9c9593fc8e0ffc61ddefb011dc58b6
+  data.tar.gz: df1c7a1be0d88e61a4be22d96a21622a238be2d3aa624d898109724dfd0f8813
 SHA512:
-  metadata.gz: 67d6c06f7b3d8ea018465ad229fd3519585abe248cf7458d987df774e25d93db84508a590f2cd81a2b0f7c113b2f77f7eb63f1ffa24c5826067828aa1cb7c8e3
-  data.tar.gz: 65f0e9b6ade329e95251eb054f85e7e90cd127dfc9510a0ec990c6b4424def850f14209324f3563e77199aa25086df6625fbf1e55e9db27e375c58f067732cbf
+  metadata.gz: eb189ada6cfb99e90dbdd9c3c922d0c89503c926f187c02ed4df4f3bf4e1e51f129af90b8734e88f1645e2067e11c3794f8a6f70e149c9b3d922c1caf3c76716
+  data.tar.gz: fb2d3a457ee71091a3f36a1f2aa8cadeac8ac98f2dc02c8594a72430e99dffcb4c6875dcd4057297f0778349f9038d9e82d039d98cafe69cd4597129b6528a7c

data/_data/wordgames/en/find-words-that-start-with-the-letters.json

@@ -54,5 +54,8 @@
             "Question": "",
             "Answer": ""
         }
+    ],
+    "cssfilepaths": [
+        ""
     ]
 }

data/_data/wordgames/en/root.json

@@ -14,6 +14,29 @@
    "Faq_title": "FAQ",
    "aboutNo": "05",
    "about_title": "About",
+   "infographics": [
+    {
+      "image": "/assets/images/1.png",
+      "description": "How to set alarm on wake me up at 4:45 am tool"
+    },
+    {
+      "image": "/assets/images/2.png",
+      "description": "5 benefits of using wake me up at 4:45 am tool"
+    },
+    {
+      "image": "/assets/images/3.png",
+      "description": "Additional features of wake me up at 4:45 am tool"
+    },
+    {
+      "image": "/assets/images/3.png",
+      "description": "Additional features of wake me up at 4:45 am tool"
+    },
+    {
+      "image": "/assets/images/3.png",
+      "description": "Additional features of wake me up at 4:45 am tool"
+    }
+    
+  ],
    "featureList": [
      {
        "feature_heading": "How to create words with letters by using this tool?",
@@ -47,6 +70,7 @@
      }
    ],
    "HOW_TO_CONTENT": {
+    "YoutubeVideoUrl": "https://www.youtube.com/watch?v=KvG92NJQssk&ab_channel=WordsWithLettersOrg",
     "logoImageUrl": "/assets/images/check.svg",
     "heading": "How to set alarm for $variable minutes:",
     "steps": [

data/_data/wordleSolver/en/data.json

@@ -56,9 +56,11 @@
         }
     ],
     "jsfilepaths": [
-        "/assets/js/wordleSolver.js"
+        "/assets/js/wordleSolver.js",
+        "https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.12/cropper.min.js"
     ],
     "cssfilepaths": [
-        "/assets/css/wordleSolver.css"
+        "/assets/css/wordleSolver.css",
+         "https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.12/cropper.min.css"
     ]
 }

data/_includes/authors/authors.html

@@ -18,7 +18,7 @@ shares his thoughts and helps those he can. He have a knack of writing essays,st
 poems.&&https://twitter.com/PaavanThandra" | split: '&&' %}
 {% assign arjyahi = "Arjyahi Bhattacharya&&/assets/images/Arjyahi.webp&&Arjyahi is a Data Science and Machine Learning
 enthusiast who loves music, books, photography, and philosophy. She also loves nature and animals. She enjoys reading
-and sharing information on various topics involving her knacks.&&https://twitter.com/arjyahi" | split: '&&' %}
+and sharing information on various topics involving her knacks&&https://twitter.com/arjyahi" | split: '&&' %}
 {% assign nikita = "Nikita Gupta&&/assets/images/Nikita.webp&&Nikita is an aspiring MBA graduate, who loves creating
 content. She loves reading and watching anime. She is into other languages and currently learning Spanish, French and
 Japanese. Her favourite timepass is solving sudokus. &&N/A" | split: '&&' %}
@@ -48,6 +48,22 @@ profound ability to stay up to date with latest industry trends.&&N/A" | split:
 pursuing my master's. I am very passionate about writing because it shapes my personality and connects me with
 world.&&N/A" | split:
 '&&' %}
+{% assign karuna = "Karuna Shree&&/assets/images/karuna.jpeg&&RK Shree - A science enthusiast with a poetic flair, 
+and possesses an insatiable desire to explore diverse fields seeking new knowledge and experiences. 
+My work ethic is highly disciplined and dedicated. I take pleasure in pursuing creative endeavors that captivate me.
+&&https://twitter.com/rkshree2118?t=wuhNmjgq18UleNBfLyumag&s=09" | split: '&&' %}
+{% assign debosmita = "Debosmita Bedajna&&/assets/images/debosmita.jpeg&&I'm Debosmita Bedajna. I have a keen interest in the arts. Dancing, painting, and playing string instruments are just a few of the ways I enjoy expressing myself creatively. I believe that engaging in art is an essential part of personal growth and development.
+&&N/A" | split: '&&' %}
+{% assign suchita = "Suchita Kasab&&/assets/images/suchita.jpeg&&Hi, I'm Suchita Kasab. Along with writing, I also enjoy painting. I think I can express myself better through these art forms.
+&&N/A" | split: '&&' %}
+{% assign aditya = "Aditya Thakur&&/assets/images/avatar.jpeg&&Hey there! I'm Aditya Thakur, a dedicated technology enthusiast with a strong passion for music and anime. I tackle challenges head-on and consistently strive for excellence. In my past time, you can find me indulging in my favorite tunes or exploring captivating anime worlds.
+&&N/A" | split: '&&' %}
+{% assign taufik = "Taufik Ali&&/assets/images/taufik.jpeg&&Taufik has an analytical mindset and great attention to detail. He excels in analyzing website performance, conducting keyword research, optimizing on-page content, and developing effective link-building strategies.
+&&N/A" | split: '&&' %}
+{% assign bandana = "Kumari Bandana&&/assets/images/bandana.jpeg&&Bandana is an experienced SEO professional. In addition to her technical expertise, Bandana possesses excellent communication skills, allowing her to effectively collaborate with cross-functional teams and provide actionable recommendations to improve website performance
+&&N/A" | split: '&&' %}
+{% assign mahika = "Mahika Agrawal&&/assets/images/mahika.jpeg&&I'm Mahika Agrawal, an experienced content writer with a passion for words and skills in creating high-quality content that drives results.
+&&N/A" | split: '&&' %}
 {%- assign postAuthor = post.author | split: " " -%}
 {%- assign author = postAuthor.first | downcase -%}
 {%- assign collection = [author] -%}

data/_includes/cssfile/links.html

@@ -2,9 +2,16 @@
 {{site.data.customcdns.customcdns.cssfiles}}
 {%- if cssData.cssfilepaths -%}
 {%- for path in cssData.cssfilepaths -%}
-{%- if site.versioning -%}
 {%- assign asset_dir = path -%}
+
+{%- if site.versioning and asset_dir != "" -%}
+
+{%- if asset_dir contains "https" and asset_dir contains "https://" -%}
+<link defer rel="stylesheet" href="{{path}}">
+{%- else -%}
 <link defer rel="stylesheet" href="{% ministamp { source_path: '{{ asset_dir }}', destination_path: '{{ asset_dir }}' } %}">
+{%- endif -%}
+
 {%- else -%}
 <link defer rel="stylesheet" href="{{path}}">
 {%- endif -%}

data/_includes/howto.html

@@ -5,30 +5,58 @@
     </div>
     <div class="container">
         <div class="row pt-5 justify-content-center">
-            <div class="col-md-6 order-0 ">
-                {%- if dataToShow.HOW_TO_CONTENT.logoImageUrl -%}
-                <div class="how-to-img-wrapper ">
-                    <img class="how-to-leftimg" height="300px" width="300px"
-                        src="{{dataToShow.HOW_TO_CONTENT.logoImageUrl}}" loading="lazy"
-                        alt="{{dataToShow.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}">
-                </div>
-                {%- endif -%}
-            </div>
-            <div class="col-md-6 order-1">
-                <div class="how-to-right">
-                    <h3 class="how-to-title">{{dataToShow.HOW_TO_CONTENT.heading | replace: "$variable",
-                        page.value}}</h3>
-                    <ol class="how-to-list">
-                        {% for data in dataToShow.HOW_TO_CONTENT.steps %}
-                        <li id="step{{forloop.index}}" class="how-to-list-item">
-                            <span>{{forloop.index}}.</span>{{data |
-                            replace: "$variable",
-                            page.value}}
-                        </li>
-                        {% endfor %}
-                    </ol>
+            {%- if site.ezoicAds -%}
+            <div class="col-md-9 mx-auto">
+                <div class="row">
+                    {%- endif -%}
+                    <div class="col-md-6 order-0 ">
+                        {%- if dataToShow.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
+                        <div class="how-to-video-wrapper">
+                            {% assign video_url = dataToShow.HOW_TO_CONTENT.YoutubeVideoUrl %}
+                            {% assign params = video_url | split: "?" | last | split: "&" %}
+                            {% for param in params %}
+                            {% if param contains "v=" %}
+                            {% assign video_id = param | split: "=" | last %}
+                            {% endif %}
+                            {% endfor %}
+                            {%- if site.ezoicAds -%}
+                            <iframe class="youtubeVideoPlayer mb-5" width="400" height="315"
+                                src="https://www.youtube.com/embed/{{video_id}}?autoplay=1&mute=1" allowfullscreen>
+                            </iframe>
+                            {%- else -%}
+                            <iframe class="youtubeVideoPlayer mb-5" width="500" height="315"
+                                src="https://www.youtube.com/embed/{{video_id}}?autoplay=1&mute=1" allowfullscreen>
+                            </iframe>
+                            {%- endif -%}
+
+                        </div>
+                        {%- else -%}
+                        <div class="how-to-img-wrapper ">
+                            <img class="how-to-leftimg" height="300px" width="300px"
+                                src="{{dataToShow.HOW_TO_CONTENT.logoImageUrl}}" loading="lazy"
+                                alt="{{dataToShow.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}">
+                        </div>
+                        {%- endif -%}
+                    </div>
+                    <div class="col-md-6 order-1">
+                        <div class="how-to-right">
+                            <h3 class="how-to-title">{{dataToShow.HOW_TO_CONTENT.heading | replace: "$variable",
+                                page.value}}</h3>
+                            <ol class="how-to-list">
+                                {% for data in dataToShow.HOW_TO_CONTENT.steps %}
+                                <li id="step{{forloop.index}}" class="how-to-list-item">
+                                    <span>{{forloop.index}}.</span>{{data |
+                                    replace: "$variable",
+                                    page.value}}
+                                </li>
+                                {% endfor %}
+                            </ol>
+                        </div>
+                    </div>
+                    {%- if site.ezoicAds -%}
                 </div>
             </div>
+            {%- endif -%}
         </div>
     </div>
 </section>

data/_includes/infographics/infographics.html

@@ -0,0 +1,342 @@
+<!-- <style>
+    /* Reset default browser styles */
+   
+    .infographic {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin: 50px auto;
+      max-width: 800px;
+    }
+    .infographic-item {
+      flex-basis: 30%;
+      text-align: center;
+      /* background-color: #404040; */
+      /* border-radius: 10px; */
+      /* padding: 30px; */
+    }
+
+    .infographic-item img {
+      max-width: 100%;
+      height: auto;
+      border-radius: 8px;
+      margin-bottom: 10px;
+      box-shadow: 15px 15px 40px rgba(0, 0, 0, 50%);
+    }
+
+    .infographic-item h3 {
+      font-size: 20px;
+      margin-bottom: 10px;
+      color: #fff;
+    }
+
+    .infographic-item p {
+      font-size: 16px;
+      margin-bottom: 0px;
+    }
+
+    @media (max-width: 600px) {
+      .infographic {
+        flex-wrap: wrap;
+      }
+
+      .infographic-item {
+        flex-basis: 100%;
+        margin-bottom: 30px;
+      }
+    }
+  </style>
+<div class="infographics_section">
+    <h3 class="text-center w-100 mb-5"><b>Other useful information</b></h3>
+    <div class="infographic">
+        {%- for item in dataToShow.infographics -%}
+        <div class="infographic-item">
+            <img src="{{item.image}}" alt="Image 1">
+            <p class="infographic-desc">{{item.description | capitalize }}</p>
+        </div>
+            {%- endfor -%}
+    </div>
+
+
+     <div class="slider">
+        <div class="row">
+            <div class="col-md-12 mx-auto">
+                <div id="carousel">
+                    {%- for item in featureData.infographics -%}
+                    <div class="slide">
+                        <img src="{{item.image}}" alt="Photo1" />
+                     <p class="infographics-desc">{{item.description | capitalize }}</p>
+                    </div>
+                    {%- endfor -%}
+                </div>
+            </div>
+        </div>
+        <button class="btn-slide prev"><i class="fas fa-3x fa-chevron-circle-left"></i></button>
+        <button class="btn-slide next"><i class="fas fa-3x fa-chevron-circle-right"></i></button>
+    </div> 
+    <div class="dots-container">
+        {%- for item in featureData.infographics -%}
+        <span class="dot active" data-slide="{{ forloop.index0 }}"></span>
+        {%- endfor -%}
+    </div> -->
+<!-- </div>  -->
+
+<!-- <script>
+    function Slider() {
+        const carouselSlides = document.querySelectorAll('.slide');
+        const btnPrev = document.querySelector('.prev');
+        const btnNext = document.querySelector('.next');
+        const dotsSlide = document.querySelector('.dots-container');
+        let currentSlide = 0;
+
+        const activeDot = function (slide) {
+            document.querySelectorAll('.dot').forEach(dot => dot.classList.remove('active'));
+            document.querySelector(`.dot[data-slide="${slide}"]`).classList.add('active');
+        };
+        activeDot(currentSlide);
+
+        const changeSlide = function (slides) {
+            carouselSlides.forEach((slide, index) => (slide.style.transform = `translateX(${100 * (index - slides)}%)`));
+        };
+        changeSlide(currentSlide);
+
+        btnNext.addEventListener('click', function () {
+            currentSlide++;
+            if (carouselSlides.length - 1 < currentSlide) {
+                currentSlide = 0;
+            };
+            changeSlide(currentSlide);
+            activeDot(currentSlide);
+        });
+        btnPrev.addEventListener('click', function () {
+            currentSlide--;
+            if (0 >= currentSlide) {
+                currentSlide = 0;
+            };
+            changeSlide(currentSlide);
+            activeDot(currentSlide);
+        });
+
+        dotsSlide.addEventListener('click', function (e) {
+            if (e.target.classList.contains('dot')) {
+                const slide = e.target.dataset.slide;
+                changeSlide(slide);
+                activeDot(slide);
+            }
+        });
+    };
+    Slider();
+</script> -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+<style>
+    .infographics-wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        overflow-x: hidden;
+        overflow-y: hidden;
+        height: 130vh;
+    }
+
+    .infographics-wrapper .container {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        transform-style: preserve-3d;
+        align-items: center;
+        flex-direction: column;
+    }
+
+    .infographics-wrapper .cards {
+        position: relative;
+        width: 300px;
+        height: 300px;
+        margin-bottom: 20px;
+        perspective: 1000px;
+        transform-style: preserve-3d;
+    }
+
+    .infographics-wrapper .cards label {
+        position: absolute;
+        width: 300px;
+        left: 0;
+        right: 0;
+        margin: auto;
+        cursor: pointer;
+        transition: transform 0.55s ease;
+    }
+
+    .infographics-wrapper .cards .card {
+        position: relative;
+        height: 100%;
+        background-color: #323444;
+        border-radius: 10px;
+        padding: 5px;
+    }
+
+    .infographics-wrapper .card .image {
+        display: flex;
+        justify-content: space-between;
+    }
+
+    .infographics-wrapper .card .image img {
+        border-radius: 5px;
+        box-shadow: 15px 15px 40px rgba(0, 0, 0, 50%);
+        margin-top: 23px;
+        width: 86%;
+        object-fit: cover;
+    }
+
+    .infographics-wrapper .card .image .dots {
+        text-align: center;
+    }
+
+    .dots div {
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        margin-bottom: 10px;
+    }
+
+    .dots div:nth-child(1) {
+        background-color: var(--current-color1);
+    }
+
+    .dots div:nth-child(2) {
+        background-color: #5B85F9;
+    }
+
+    .dots div:nth-child(3) {
+
+        background-color: #000;
+    }
+
+    .card .infos {
+        display: block;
+        text-align: end;
+        padding-top: 2rem;
+    }
+
+    .infos span {
+
+        display: block;
+    }
+
+    .infos .name {
+        font-size: 30px;
+        color: var(--current-color1);
+        letter-spacing: 8px;
+        margin-bottom: 20px;
+        padding-left: 25%;
+        transition: all .6s ease;
+    }
+
+    .infos .lorem {
+        font-size: 15px;
+        color: #ECEAED;
+
+        text-align: center;
+    }
+
+    #s1:checked~.cards #slide4,
+    #s2:checked~.cards #slide5,
+    #s3:checked~.cards #slide1,
+    #s4:checked~.cards #slide2,
+    #s5:checked~.cards #slide3 {
+        transform: translate3d(-70%, 0, -220px);
+        --current-color1: #ECEAED;
+        --current-color2: #404457;
+    }
+
+    #s1:checked~.cards #slide5,
+    #s2:checked~.cards #slide1,
+    #s3:checked~.cards #slide2,
+    #s4:checked~.cards #slide3,
+    #s5:checked~.cards #slide4 {
+
+        transform: translate3d(-35%, 0, -120px);
+        --current-color1: #ECEAED;
+        --current-color2: #404457;
+    }
+
+    #s1:checked~.cards #slide1,
+    #s2:checked~.cards #slide2,
+    #s3:checked~.cards #slide3,
+    #s4:checked~.cards #slide4,
+    #s5:checked~.cards #slide5 {
+        transform: translate3d(0, 0, 0);
+        --current-color1: #fad00c;
+        --current-color2: #ECEAED;
+    }
+
+    #s1:checked~.cards #slide2,
+    #s2:checked~.cards #slide3,
+    #s3:checked~.cards #slide4,
+    #s4:checked~.cards #slide5,
+    #s5:checked~.cards #slide1 {
+
+        transform: translate3d(35%, 0, -120px);
+        --current-color1: #ECEAED;
+        --current-color2: #404457;
+    }
+
+    #s1:checked~.cards #slide3,
+    #s2:checked~.cards #slide4,
+    #s3:checked~.cards #slide5,
+    #s4:checked~.cards #slide1,
+    #s5:checked~.cards #slide2 {
+        transform: translate3d(70%, 0, -220px);
+        --current-color1: #ECEAED;
+        --current-color2: #404457;
+    }
+
+    @media (max-width:768px) {
+        .infographics-wrapper .cards label{
+            left: -100px;
+        }
+        
+    }
+</style>
+
+<div class="infographics-wrapper">
+    <div class="container">
+        <h3 class="text-center w-100 mb-5 mt-5" style="font-size:20px"><b>Other useful information</b></h3>
+        <input type="radio" name="slider" class="d-none" id="s1" checked>
+        <input type="radio" name="slider" class="d-none" id="s2">
+        <input type="radio" name="slider" class="d-none" id="s3">
+        <input type="radio" name="slider" class="d-none" id="s4">
+        <input type="radio" name="slider" class="d-none" id="s5">
+        <div class="cards">
+
+            {%- for item in dataToShow.infographics -%}
+            <label for="s{{ forloop.index }}" id="slide{{ forloop.index }}">
+                <div class="card">
+                    <div class="image">
+                        <img src="{{item.image}}" alt="">
+                        <div class="dots">
+                            <div class="dot1"></div>
+                            <div class="dot2"></div>
+                            <div class="dot3"></div>
+                          </div>
+                    </div>
+                    <div class="infos">
+                        <span class="lorem">{{item.description | capitalize }}</span>
+                    </div>
+                </div>
+            </label>
+            {%- endfor -%}
+        </div>
+    </div>
+</div>

data/_includes/script.html

@@ -33,10 +33,18 @@
 {{site.data.customcdns.customcdns.jsfiles}}
 {%- if scriptData.jsfilepaths -%}
 {%- for path in scriptData.jsfilepaths -%}
-{%- if site.versioning -%}
+
 {%- assign asset_dir = path -%}
+{%- if site.versioning and asset_dir != "" -%}
+
+{%- if asset_dir contains "https" and asset_dir contains "https://" -%}
+<script defer src="{{path}}" data-folderName="{{page.folderName}}" data-lang="{{page.lang}}"
+data-fileName="{{page.fileName}}" data-tool="{{page.tool}}" data-permalink="{{page.permalink}}"></script>
+{%- else -%}
 <script defer src="{% ministamp { source_path: '{{ asset_dir }}', destination_path: '{{ asset_dir }}' } %}" data-folderName="{{page.folderName}}" data-lang="{{page.lang}}"
    data-fileName="{{page.fileName}}" data-tool="{{page.tool}}" data-permalink="{{page.permalink}}"></script>
+{%- endif -%}
+
 {%- else -%}
 {%- assign asset_dir = path -%}
 <script defer src="{{path}}" data-folderName="{{page.folderName}}" data-lang="{{page.lang}}"

data/_includes/word-game/word-game-generator-online.html

@@ -10,8 +10,7 @@
                     <h3 class="font-weight-bolder mt-4">Make your own wordle</h3>
                     <input id="cstmword" autocomplete="off" type="text" class="form-control custom-word"
                         placeholder="Enter Up to 5 Letters?" name="custom-word" required maxlength="5">
-                    <button onclick="openModal()" id="generate_link" type="submit"
-                        class="btn generate-word-game-link">Generate Link</button>
+                    <input id="generate_link" value="Generate Link" type="submit" class="btn generate-word-game-link">
                     <!-- <span class="open-popup" data-toggle="modal" data-target="#exampleModal"></span> -->
                 </form>
             </div>

data/_layouts/default.html

@@ -27,6 +27,13 @@
 
     {% include adBlocker/adBlocker.html %}
     {%- include Rating/rating.html -%}
+
+    {%- if dataToShow.infographics.size > 0 -%}
+    {%- include infographics/infographics.html -%} 
+    {%- endif -%} 
+
+
+    
     {%- include share/socialshare.html -%}
 
     {%- assign langen = "en" -%}
@@ -46,6 +53,8 @@
     {%- include section/recent_posts.html -%}
     {% endif %}
 
+
+
     {%- include footer/index.html -%}
 
     {%- include script.html -%}

data/assets/css/resultWordleSolver.css

@@ -0,0 +1,466 @@
+/***************
+ Result page css 
+ ***************/
+
+ input:-webkit-autofill,
+ input:-webkit-autofill:hover,
+ input:-webkit-autofill:focus,
+ input:-webkit-autofill:active {
+   transition: background-color 5000s ease-in-out 0s;
+ }
+ 
+ .btn-info:not(:disabled):not(.disabled).active:focus,
+ .btn-info:not(:disabled):not(.disabled):active:focus,
+ .show>.btn-info.dropdown-toggle:focus {
+   box-shadow: unset;
+   border-color: rgba(0, 0, 0, 0.1);
+ }
+ 
+ /* navbar css for result page */
+ .result_navbar_section {
+   width: 100%;
+   padding: .8rem 9% !important;
+   position: sticky;
+   top: 0;
+   z-index: 99999;
+ }
+ 
+ .result_navbar_section .mobile_bars {
+   cursor: pointer;
+   position: absolute;
+   top: 0px;
+   margin: 0 40px
+ }
+ 
+ .mobile_bars .bars {
+   position: relative;
+   color: #000;
+   font-size: 35px;
+ }
+ 
+ .result_navbar_section #open_list_bar {
+   position: fixed;
+   top: 0px;
+   left: -100%;
+   z-index: 999;
+   height: 100vh;
+   transition: all .5s ease-in-out;
+   list-style: none;
+   box-shadow: 0 0 5px grey;
+   background: #f8f9fa;
+   overflow-y: scroll;
+ }
+ 
+ #open_list_bar .cat_bar_logo_link {
+   padding: 0 15px;
+ }
+ 
+ #open_list_bar .cat_bar_logo_link .cat_bar_img {
+   width: 30px;
+ }
+ 
+ #open_list_bar .cat_title {
+   color: #000;
+   font-weight: 900;
+   font-size: 14px;
+   position: relative;
+   left: 10px;
+   top: 3px;
+ }
+ 
+ #open_list_bar .close_bar_btn {
+   position: absolute;
+   right: 8px;
+   font-size: 28px;
+   top: 15px;
+   cursor: pointer;
+ }
+ 
+ .list-items-container .list_cat_heading {
+   padding: 8px 15px;
+   background-color: gray;
+   color: #fff;
+   font-size: 13px;
+ }
+ 
+ .list-items-container .list_cat_name {
+   padding: 8px 15px;
+   font-size: 12px;
+   border-bottom: 1px solid rgb(209, 213, 219)
+ }
+ 
+ .list-items-container .list_cat_name:active {
+   color: #000 !important
+ }
+ 
+ .list-items-container .list_cat_name:hover {
+   background-color: #e9ecef;
+ }
+ 
+ /* h1,h2 for result page , searchbox and length selector css*/
+ .pageHeading>.result_heading {
+   font-size: 22px;
+   font-weight: 600;
+   color: #000;
+ }
+ 
+ .serachSection {
+   height: auto;
+ }
+ 
+ .resultPageTxtBox,
+ .resultPageSearchBtn {
+   height: 50px !important;
+ }
+ 
+ .resultPageDropdown2 {
+   height: 49px !important;
+   padding: 0 !important;
+ }
+ 
+ .letter-close-button-commonPage {
+   position: absolute;
+   right: 220px;
+   top: 18px;
+   font-size: 15px;
+   cursor: pointer;
+   display: none;
+ }
+ 
+ .ltr-cls-btn-commonPage {
+   display: block;
+ }
+ 
+ .tab_link_wrapper {
+   display: flex;
+   width: 100%;
+   justify-content: center;
+   background: #f8f9fa;
+   border-radius: 40px;
+   margin: 10px 0px;
+ }
+ 
+ .tab_link_wrapper .flex-row {
+   -ms-flex-direction: row !important;
+   flex-direction: row !important;
+   display: flex;
+   overflow: hidden;
+   margin: 0 25px;
+ }
+ 
+ .tab_link_wrapper #next {
+   background: url('/assets/images/next.webp');
+   background-size: cover;
+   width: 21px;
+   height: 21px;
+   object-fit: cover;
+   padding: 3px;
+   border: none;
+   position: absolute;
+   top: 6px;
+   right: 10px;
+ }
+ 
+ .tab_link_wrapper #prev {
+   background: url('/assets/images/prev.webp');
+   background-size: cover;
+   width: 21px;
+   height: 21px;
+   object-fit: cover;
+   padding: 3px;
+   border: none;
+   position: absolute;
+   top: 6px;
+   left: 10px;
+ }
+ 
+ .active-tab {
+   border-bottom: solid 2px black !important;
+ }
+ 
+ .tab_link_wrapper .tab_link {
+   font-size: 15px;
+   font-weight: 900;
+   margin: 0 5px;
+   padding-top: 5px;
+   border: none;
+   outline: none;
+   background-color: inherit;
+ }
+ 
+ /* advanced filter and sorting css */
+ .Advancedbtn .filter_count {
+   width: 20px;
+   color: white;
+   height: 20px;
+   text-align: center;
+   background-color: #808080;
+   padding-top: 2px;
+   border-radius: 50%;
+   margin-right: 1px;
+   position: relative;
+   left: 150px;
+ }
+ 
+ .Advancedbtn .filterButton {
+   background: #f8f9fa;
+   box-shadow: 0 0 3px #343a4063;
+   width: 190px;
+   border-radius: 10px;
+   border: none;
+   outline: none;
+   font-weight: 900;
+   font-size: 13px;
+   padding: 8.5px;
+   text-align: left;
+ }
+ 
+ .Advancedbtn .angle-arrow {
+   background: url(../images/angle-arrow-down.svg) no-repeat;
+   background-size: contain;
+   width: 10px;
+   height: 20px;
+   font-weight: 900;
+   position: absolute;
+   top: 20px;
+   right: 5px;
+   margin: -3px 0;
+ }
+ 
+ .hide {
+   visibility: hidden;
+ }
+ 
+ .fillterWrapper {
+   display: block;
+   background: #fff;
+   position: absolute;
+   z-index: 999;
+   top: 100px;
+   right: 150px;
+   box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
+   padding: 30px 15px;
+   border-radius: 15px;
+   width: 240px;
+ }
+ 
+ .fillterWrapper .same {
+   margin-bottom: 10px;
+ }
+ 
+ .tick {
+   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAL7SURBVEhL7ZZdSBRRFMf/s+PWSrsUFGoUfi1ooWISFUQPvfRhH1hUL5agvogvaQ/hamBRbz0W2VNBQb2IgqJsGL2VVBK11UNpPkhGKmWK6wfu7kznzFxGx5lxZ+tN/MGdOefOzP3PnTn3noN11jySOLvnWamfniqGJGVovqpOQMVnHI9ENd8l7oTDe/zwSGfp7nPkHaPm0/qXWKD2kl7gERS1A+Uf5vVuZ1YXbg9KCAT2kWgjeaeoBbR+Z/gFupFQWhGNDuLCsKp3W3EW1kQ3HYRHfkhegd7pmkEoiVrMzPY7iXvE2YrfXyJEg3pHShTQsw9oDMcXthfuLfNDlq+RxQ/KWl/qFNIYN7WxbLAX9uIMhWu58P4D9TSNVSEcE06fmqM3WSAZ+DwbcCXnEk5sO7QyaNKpVeumGWtw9ZYE4E2bIGvlkrGFRZtyqxHKq8HQ3HfsfVOJmBIXVzUWEItn4OSnGeFrWGcspxXR0ZXolrQAmkgwlFeL4blRtAzdRVxJiKsGPhqzUNgGVmFJzRSWCVmSqZlvb8ipRCi3BtPxGYSG7qD3F+8hNqtHUncIy8DpH5tg0VvBeoTL7iHbl6XN9HqwDjfy6zCy8BPnI1edRXUsv9QqrEo/hGXAA+7fXIwjWw+gbXczmunTNmZX4uvcCFq/teHVVGQ1UR5zTFgGroMrJz0LbbtatMhlxhd/azNNKuoQXNbN4enEIqq2HyYrX+/QmY5H8XzyNYr8QSwqMVz+chsvJgeSiTI9KI88FraB/V7dV3aRjvepWdYyz3znxkz0T310I8qzrMfR9090dwn74Iqhk94pLDwTI/Njbj6vQOqhsbqEY8J+xky4lPZaTzdZqWYmhhfzMBSligqEt3qXGeflxPmUUxunuNQhUU6L0QHhW3DOPO1/gAr/KLzePioEuMzhYPNq15zhf9pJhUADorPv/q0QWA6XPrLEWYaTB2ctu9KHY6IDCbWLSp+k9Zc74eVwseehXAuJt0GJir1xirOUi7111jrAXwKK6K/PgrsYAAAAAElFTkSuQmCC) no-repeat;
+   background-position: 95% 50%;
+ }
+ 
+ .fillterWrapper input[type='text'] {
+   border-radius: 15px;
+   width: 100%;
+   outline: none;
+ }
+ 
+ .sort-select,
+ #select_dropDown {
+   background: #f8f9fa;
+   box-shadow: 0 0 2px #343a4063;
+   word-wrap: normal;
+   width: 190px;
+   border-radius: 10px;
+   border: none;
+   cursor: pointer;
+   padding: 10px;
+   text-align: left;
+   color: #1c1107;
+   font-size: 13px;
+   font-weight: 600;
+   font-stretch: normal;
+   font-style: normal;
+   outline: none;
+ }
+ 
+ /* result data css */
+ #home_page_search_result {
+   padding: 10px;
+   font-size: 12px;
+ }
+ 
+ #home_page_search_result:hover {
+   text-decoration: underline !important;
+ }
+ 
+ .wordCount {
+   text-indent: 10px;
+   font-size: 18px;
+ }
+ 
+ .filterSortedIcons {
+   flex-basis: 11%;
+   display: flex;
+   font-size: 20px;
+   gap: 20px;
+   cursor: pointer;
+   display: none
+ }
+ 
+ .allGroupWords {
+   background-color: white !important;
+   width: auto;
+   height: auto;
+   border-radius: 15px;
+   box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
+   margin: 10px 0;
+ }
+ 
+ .allGroupWords>.wordListHeading {
+   background: gray;
+   padding: 10px 0px 5px 25px;
+   border-top-right-radius: 15px;
+   border-top-left-radius: 15px;
+   color: #fff;
+ }
+ 
+ .wordListHeading>h3 {
+   font-size: 20px;
+   font-weight: 600;
+ }
+ 
+ .wordList {
+   padding: 15px;
+ }
+ 
+ .wordList>ul {
+   display: inline-flex;
+   width: 100%;
+   flex-wrap: wrap;
+ }
+ 
+ .wordList>ul li {
+   border: solid 2px rgba(226, 248, 198, .47);
+   padding: 8px 0;
+   background: #f8f9fa;
+   border-radius: 5px;
+   margin: 6px 6px;
+   width: auto;
+   min-width: 100px;
+   text-align: center;
+ }
+ 
+ .wordList .anchor__style {
+   color: #000 !important;
+   font-size: 15px;
+   text-decoration: none !important;
+   font-weight: 600;
+ }
+ 
+ .wordList .anchor__style .highlight {
+   color: #ff0000 !important;
+ }
+ 
+ .points {
+   color: #73716e;
+   font-weight: 600;
+ }
+ 
+ .errorMsg {
+   text-align: center;
+   font-size: 20px;
+   color: red;
+   font-weight: 800;
+ }
+ 
+ /* close */
+ 
+ 
+ @media (max-width: 768px) {
+ 
+   /* result page navbar, closebtn, heading css for mobile */
+   .result_navbar_section {
+     padding: 1.2rem 15px !important;
+   }
+ 
+   .nav_menu_bar {
+     display: none;
+   }
+ 
+   .result_navbar_section .mobile_bars {
+     display: block;
+     position: absolute;
+     top: 5px;
+     margin: 0;
+   }
+ 
+   .letter-close-button-commonPage {
+     right: 45%;
+     font-size: 15px;
+   }
+ 
+   .pageHeading>.result_heading {
+     font-size: 1.8rem;
+     padding-left: 25px;
+   }
+ 
+   /* length selector css for mobile */
+ 
+   .tab_link_wrapper .flex-row {
+     margin: 0 15px;
+   }
+ 
+   .tab_link_wrapper .tab_link {
+     font-size: 12px;
+   }
+ 
+   .tab_link_wrapper #prev {
+     top: 6px;
+     left: 5px;
+     width: 16px;
+     height: 16px;
+   }
+ 
+   .tab_link_wrapper #next {
+     top: 6px;
+     right: 5px;
+     width: 16px;
+     height: 16px;
+   }
+ 
+   /* advanced filter and sorting css for mobile */
+   .angle-arrow {
+     display: none;
+   }
+ 
+   .Advancedbtn .filterButton {
+     display: none;
+   }
+ 
+   .fillterWrapper {
+     right: auto;
+     position: fixed;
+     left: 0px;
+     top: 135px;
+     width: 100%;
+   }
+ 
+   .Advancedbtn .filter_count {
+     display: none !important;
+   }
+ 
+   .filterSortedIcons {
+     display: flex;
+     gap: 8px;
+   }
+ 
+   .sort-select,
+   #select_dropDown {
+     display: none;
+   }
+ 
+   /* result data css for mobile */
+   .pad {
+     padding-bottom: 50px;
+   }
+ 
+   .wordCount {
+     font-size: 1.3rem;
+   }
+ 
+ }

data/assets/css/style.css

@@ -939,6 +939,10 @@ header {
     text-align: center;
   }
 
+  /* youtube video how css */
+  .how-to-video-wrapper .youtubeVideoPlayer {
+    width: 100%;
+}
 
   /* footer css for mobile */
   .footer-section .language-drop-down-item {

data/assets/js/createWordle.js

@@ -24,6 +24,7 @@ async function getData() {
 getData()
 const createWordle = (e) => {
     e.preventDefault();
+    console.log(true);
   
     if (customWord.value.length < 5) {
         errorMsg.innerHTML = "Not enough letters"

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: word-games-theme
 version: !ruby/object:Gem::Version
-  version: 2.0.8
+  version: 2.1.0
 platform: ruby
 authors:
 - manpreet-appscms
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-06-03 00:00:00.000000000 Z
+date: 2023-06-24 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -137,6 +137,7 @@ files:
 - _includes/header/blogHeader.html
 - _includes/header/index.html
 - _includes/howto.html
+- _includes/infographics/infographics.html
 - _includes/languages/languages.html
 - _includes/multiple-word-anagram-solver/index.html
 - _includes/paginationBlogPage.html
@@ -196,10 +197,14 @@ files:
 - assets/css/fonts/bootstrap-icons.woff2
 - assets/css/game.css
 - assets/css/multiple-word-anagram-solver.css
+- assets/css/resultWordleSolver.css
 - assets/css/style.css
 - assets/css/wordGroup.css
 - assets/css/wordleSolver.css
 - assets/css/wordsInCertainPosition.css
+- assets/images/1.png
+- assets/images/2.png
+- assets/images/3.png
 - assets/images/404.svg
 - assets/images/Ankita.webp
 - assets/images/Anushka.webp
@@ -210,13 +215,17 @@ files:
 - assets/images/adblock.svg
 - assets/images/alka.webp
 - assets/images/angle-arrow-down.svg
+- assets/images/avatar.jpeg
+- assets/images/avatar.png
 - assets/images/balark.jpeg
+- assets/images/bandana.jpeg
 - assets/images/bg_elements.png
 - assets/images/bg_elements.svg
 - assets/images/board-game.png
 - assets/images/check.svg
 - assets/images/close.png
 - assets/images/copy.svg
+- assets/images/debosmita.jpeg
 - assets/images/facebook-square.svg
 - assets/images/facebook.svg
 - assets/images/facebooks.svg
@@ -228,6 +237,8 @@ files:
 - assets/images/howto.svg
 - assets/images/instagram-square.svg
 - assets/images/instagram.svg
+- assets/images/karuna.jpeg
+- assets/images/karuna.png
 - assets/images/keshav.webp
 - assets/images/krutika.jpeg
 - assets/images/left_obj_01 (1).svg
@@ -237,6 +248,7 @@ files:
 - assets/images/linkedin.svg
 - assets/images/linkedin2.svg
 - assets/images/loading.gif
+- assets/images/mahika.jpeg
 - assets/images/manpreet-spinner.gif
 - assets/images/next.webp
 - assets/images/paavan.webp
@@ -255,6 +267,10 @@ files:
 - assets/images/sona.jpeg
 - assets/images/star.png
 - assets/images/star.svg
+- assets/images/suchita.jpeg
+- assets/images/suchita.png
+- assets/images/taufik.jpeg
+- assets/images/taufik.png
 - assets/images/test.png
 - assets/images/timer.svg
 - assets/images/twitter-square.svg