assets/css/wordgames-result.css in word-games-theme-2.7.1 vs assets/css/wordgames-result.css in word-games-theme-2.7.2

- old
+ new

@@ -1,9 +1,24 @@ /*************** Result page css ***************/ + +/* show more button */ +.showmore_btn { + background: black; + padding: 1rem 2rem; + border-radius: 50px; + color: #fff; + font-size: 15px; + border: none; +} +.points{ + position:relative; top:4px; font-size:12px +} + + /* common loader css */ .loader { width: 100%; text-align: center; } @@ -11,497 +26,509 @@ .loader img { height: 100px; } - 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; - } - /* .header_bars{ +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; +} + +/* .header_bars{ background-color: var(--black-color); } */ - - - .result_navbar_section .mobile_bars { + + +.result_navbar_section .mobile_bars { cursor: pointer; - position: absolute; - top: 13px; - /* margin: 0 40px; */ - left: 110px; - } - - .mobile_bars .bars { - position: relative; - color: #000; - font-size: 35px; - } - - .fillterWrapper .filter-tooltip{ + position: absolute; + top: 13px; + /* margin: 0 40px; */ + left: 110px; +} + +.mobile_bars .bars { + position: relative; + color: #000; + font-size: 35px; +} + +.fillterWrapper .filter-tooltip { top: 8px !important - } - .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: var(--primary-color); - 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; - } - - - .letter-close-button-commonPage { - position: absolute; - right: 300px; - top: 24px; - font-size: 15px; - cursor: pointer; - display: none; - } - - .ltr-cls-btn-commonPage { - display: block; - } - - .tab_link_wrapper { - display: flex; - width: 100%; - justify-content: center; - background: var(--black-color); - border-radius: 40px; - margin: 10px 0px;; - padding: 10px; - /* border: 2px solid var(--black-color); */ - } - - .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 3px var(--primary-color) !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; - color: white - } - - /* 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; - } +} - - /* .fillterWrapper .same { +.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: var(--primary-color); + 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; +} + + +.letter-close-button-commonPage { + position: absolute; + right: 300px; + top: 24px; + font-size: 15px; + cursor: pointer; + display: none; +} + +.ltr-cls-btn-commonPage { + display: block; +} + +.tab_link_wrapper { + display: flex; + width: 100%; + justify-content: center; + background: var(--black-color); + border-radius: 40px; + margin: 10px 0px; + ; + padding: 10px; + /* border: 2px solid var(--black-color); */ +} + +.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 3px var(--primary-color) !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; + color: white +} + +/* 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; +} + + +/* .fillterWrapper .same { margin-bottom: 10px; } */ /* .tick { background: url("/assets/images/close-btn.svg") no-repeat; background-position: 95% 50%; } */ - - - .sort-select, - #select_dropDown { - background: #f8f9fa; - border: solid 1px var(--black-color); - box-shadow: 2px 2px 1px 0px var(--black-color); - word-wrap: normal; - width: 190px; - border-radius: 10px; - cursor: pointer; - padding: 10px; - text-align: left; - color: #1c1107; - font-size: 13px; - font-weight: 600; - font-stretch: normal; - font-style: normal; - outline: none; - } - .length-select{ + + +.sort-select, +#select_dropDown { background: #f8f9fa; - border: solid 1px var(--black-color); - box-shadow: 2px 2px 1px 0px var(--black-color); - word-wrap: normal; - width: 190px; - border-radius: 10px; - 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; - border:2px solid var(--black-color) - } - - .allGroupWords>.wordListHeading { - background: var(--black-color); - padding: 10px 0px 5px 25px; - border-top-right-radius: 13px; - border-top-left-radius: 13px; - color: #fff; - } - - .wordListHeading>h3 { - font-size: 20px; - font-weight: 600; - } - - .wordList { - padding: 15px; - } - - .wordList>ul { - display: inline-flex; - width: 100%; - flex-wrap: wrap; - } - .fillterWrapper input{ + border: solid 1px var(--black-color); + box-shadow: 2px 2px 1px 0px var(--black-color); + word-wrap: normal; + width: 190px; + border-radius: 10px; + cursor: pointer; + padding: 10px; + text-align: left; + color: #1c1107; + font-size: 13px; + font-weight: 600; + font-stretch: normal; + font-style: normal; + outline: none; +} + +.length-select { + background: #f8f9fa; + border: solid 1px var(--black-color); + box-shadow: 2px 2px 1px 0px var(--black-color); + word-wrap: normal; + width: 190px; + border-radius: 10px; + 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; + border: 2px solid var(--black-color) +} + +.allGroupWords>.wordListHeading { + background: var(--black-color); + padding: 10px 0px 5px 25px; + border-top-right-radius: 13px; + border-top-left-radius: 13px; + color: #fff; +} + +.wordListHeading>h3 { + font-size: 20px; + font-weight: 600; +} + +.wordList { + padding: 15px; +} + +.wordList>ul { + display: inline-flex; + width: 100%; + flex-wrap: wrap; +} + +.fillterWrapper input { padding: 10px !important; font-size: 14px; width: 140px; - } - .fillterWrapper .filter-tooltip img{ +} + +.fillterWrapper .filter-tooltip img { width: 22px; - } - - .wordList>ul li { - - padding: 8px 0; - background: #f8f9fa; - border-radius: 5px; - margin: 6px 6px; - width: auto; - min-width: 100px; - text-align: center; - border: solid 1px var(--black-color); - box-shadow: 2px 2px 1px 0px var(--black-color); - } - - .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 */ - .allGroupWords,.allGroupWords>.wordListHeading{ +} + +.wordList>ul li { + + padding: 8px 0; + background: #f8f9fa; + border-radius: 5px; + margin: 6px 6px; + width: auto; + min-width: 100px; + text-align: center; + border: solid 1px var(--black-color); + box-shadow: 2px 2px 1px 0px var(--black-color); +} + +.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 */ + .allGroupWords, + .allGroupWords>.wordListHeading { border-radius: 0px; border: none; - } - .result_navbar_section { - padding: 1.2rem 15px !important; - } - - .nav_menu_bar { - display: none; - } - - .result_navbar_section .mobile_bars { - display: block; - position: absolute; - top: 0px; - margin: 0; - left: 30px; - z-index: 99; - } - - .letter-close-button-commonPage { + } + + .result_navbar_section { + padding: 1.2rem 15px !important; + } + + .nav_menu_bar { + display: none; + } + + .result_navbar_section .mobile_bars { + display: block; + position: absolute; + top: 0px; + margin: 0; + left: 30px; + z-index: 99; + } + + .letter-close-button-commonPage { right: 45%; top: 17px; font-size: 15px; - } - .letter-close-button-commonPage svg{ + } + + .letter-close-button-commonPage svg { width: 30px; - } - - .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; - } - .fillterWrapper{ + } + + .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; + } + + .fillterWrapper { position: static; - } - .filters{ + } + + .filters { flex-direction: column; - } - #sort-select{ + } + + #sort-select { margin-top: 1rem; - } - - /* result data css for mobile */ - .pad { - padding-bottom: 50px; - } - - .wordCount { - font-size: 1.3rem; - } - - } + } - .tbl { + /* result data css for mobile */ + .pad { + padding-bottom: 50px; + } + + .wordCount { + font-size: 1.3rem; + } + +} + +.tbl { margin-bottom: 50px; width: 80%; margin-left: 100px; } @@ -513,9 +540,9 @@ background-color: white !important; } @media (max-width:992px) { .tbl { - margin-left: 0 !important; - width: 100% !important; + margin-left: 0 !important; + width: 100% !important; } } \ No newline at end of file