diff --git a/Cargo.lock b/Cargo.lock index e2b8de1..3a8f390 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -21,9 +21,9 @@ dependencies = [ [[package]] name = "actix-cors" -version = "0.6.5" +version = "0.7.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "0346d8c1f762b41b458ed3145eea914966bb9ad20b9be0d6d463b20d45586370" +checksum = "f9e772b3bcafe335042b5db010ab7c09013dad6eac4915c91d8d50902769f331" dependencies = [ "actix-utils", "actix-web", @@ -1028,9 +1028,9 @@ dependencies = [ [[package]] name = "dhat" -version = "0.3.2" +version = "0.3.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "4f2aaf837aaf456f6706cb46386ba8dffd4013a757e36f4ea05c20dd46b209a3" +checksum = "98cd11d84628e233de0ce467de10b8633f4ddaecafadefc86e13b84b8739b827" dependencies = [ "backtrace", "lazy_static", @@ -1848,9 +1848,9 @@ checksum = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646" [[package]] name = "libc" -version = "0.2.151" +version = "0.2.153" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "302d7ab3130588088d277783b1e2d2e10c9e9e4a16dd9050e6ec93fb3e7048f4" +checksum = "9c198f91728a82281a64e1f4f9eeb25d82cb32a5de251c6bd1b5154d63a8e7bd" [[package]] name = "libmimalloc-sys" @@ -1926,9 +1926,9 @@ dependencies = [ [[package]] name = "log" -version = "0.4.20" +version = "0.4.21" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b5e6163cb8c49088c2c36f57875e58ccd8c87c7427f7fbd50ea6710b2f3f2e8f" +checksum = "90ed8c1e510134f979dbc4f070f87d4313098b704861a105fe34231c70a3901c" [[package]] name = "lua-src" @@ -2968,9 +2968,9 @@ dependencies = [ [[package]] name = "reqwest" -version = "0.11.23" +version = "0.11.24" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "37b1ae8d9ac08420c66222fb9096fc5de435c3c48542bc5336c51892cffafb41" +checksum = "c6920094eb85afde5e4a138be3f2de8bbdf28000f0029e72c45025a56b042251" dependencies = [ "async-compression", "base64 0.21.5", @@ -2995,6 +2995,7 @@ dependencies = [ "serde", "serde_json", "serde_urlencoded 0.7.1", + "sync_wrapper", "system-configuration", "tokio 1.35.1", "tokio-rustls", @@ -3054,9 +3055,9 @@ dependencies = [ [[package]] name = "rustix" -version = "0.38.28" +version = "0.38.31" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "72e572a5e8ca657d7366229cdde4bd14c4eb5499a9573d4d366fe1b599daa316" +checksum = "6ea3e1a662af26cd7a3ba09c0297a31af215563ecf42817c98df621387f4e949" dependencies = [ "bitflags 2.4.1", "errno", @@ -3507,6 +3508,12 @@ dependencies = [ "unicode-ident", ] +[[package]] +name = "sync_wrapper" +version = "0.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "2047c6ded9c721764247e62cd3b03c09ffc529b2ba5b10ec482ae507a4a70160" + [[package]] name = "synstructure" version = "0.12.6" @@ -3558,13 +3565,12 @@ checksum = "7b2093cf4c8eb1e67749a6762251bc9cd836b6fc171623bd0a9d324d37af2417" [[package]] name = "tempfile" -version = "3.9.0" +version = "3.10.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "01ce4141aa927a6d1bd34a041795abd0db1cccba5d5f24b009f694bdf3a1f3fa" +checksum = "85b77fafb263dd9d05cbeac119526425676db3784113aa9295c88498cbf8bff1" dependencies = [ "cfg-if 1.0.0", "fastrand", - "redox_syscall 0.4.1", "rustix", "windows-sys 0.52.0", ] @@ -4185,7 +4191,7 @@ dependencies = [ "mlua", "redis", "regex", - "reqwest 0.11.23", + "reqwest 0.11.24", "rusty-hook", "scraper", "serde", diff --git a/Cargo.toml b/Cargo.toml index fbb173c..76d0059 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -13,7 +13,7 @@ bench = false path = "src/bin/websurfx.rs" [dependencies] -reqwest = {version="0.11.22", default-features=false, features=["rustls-tls","brotli", "gzip"]} +reqwest = {version="0.11.24", default-features=false, features=["rustls-tls","brotli", "gzip"]} tokio = {version="1.32.0",features=["rt-multi-thread","macros"], default-features = false} serde = {version="1.0.196", default-features=false, features=["derive"]} serde_json = {version="1.0.109", default-features=false} @@ -21,10 +21,10 @@ maud = {version="0.25.0", default-features=false, features=["actix-web"]} scraper = {version="0.18.1", default-features = false} actix-web = {version="4.4.0", features = ["cookies", "macros", "compress-brotli"], default-features=false} actix-files = {version="0.6.5", default-features=false} -actix-cors = {version="0.6.4", default-features=false} +actix-cors = {version="0.7.0", default-features=false} fake-useragent = {version="0.1.3", default-features=false} env_logger = {version="0.11.1", default-features=false} -log = {version="0.4.20", default-features=false} +log = {version="0.4.21", default-features=false} mlua = {version="0.9.1", features=["luajit", "vendored"], default-features=false} redis = {version="0.24.0", features=["tokio-comp","connection-manager"], default-features = false, optional = true} blake3 = {version="1.5.0", default-features=false} @@ -33,7 +33,7 @@ async-trait = {version="0.1.76", default-features=false} regex = {version="1.9.4", features=["perf"], default-features = false} smallvec = {version="1.13.1", features=["union", "serde"], default-features=false} futures = {version="0.3.28", default-features=false} -dhat = {version="0.3.2", optional = true, default-features=false} +dhat = {version="0.3.3", optional = true, default-features=false} mimalloc = { version = "0.1.38", default-features = false } async-once-cell = {version="0.5.3", default-features=false} actix-governor = {version="0.5.0", default-features=false} @@ -47,7 +47,7 @@ cfg-if = {version="1.0.0", default-features=false,optional=true} [dev-dependencies] rusty-hook = {version="^0.11.2", default-features=false} criterion = {version="0.5.1", default-features=false} -tempfile = {version="3.8.0", default-features=false} +tempfile = {version="3.10.1", default-features=false} [build-dependencies] lightningcss = {version="1.0.0-alpha.52", default-features=false, features=["grid"]} diff --git a/public/static/themes/simple.css b/public/static/themes/simple.css index 3990799..bfc8602 100644 --- a/public/static/themes/simple.css +++ b/public/static/themes/simple.css @@ -1,8 +1,11 @@ /* @import url('./catppuccin-mocha.css'); */ @font-face { font-family: Rubik; - src: url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700;800&display=swap'); - fallback: sans-serif; + font-style: normal; + font-weight: 200 600; + font-stretch: 0% 200%; + font-display: swap; + src: url("https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nErXyi0A.woff2") format('woff2'); } * { @@ -20,7 +23,7 @@ body { flex-direction: column; justify-content: space-between; align-items: center; - height: 100vh; + min-height: 100vh; font-family: Rubik, sans-serif; background-color: var(--background-color); } @@ -459,39 +462,121 @@ footer div { font-size: 1.5rem; color: var(--foreground-color); padding-bottom: 10px; + max-width: 1100px; + margin: 14rem auto; + display: flex; + flex-direction: column; + row-gap: 100px; } .about-container article h1 { color: var(--color-two); - font-size: 2.8rem; + font-size: 4.5rem; } -.about-container article div { - padding-bottom: 15px; +.about-container article .logo-container { + display: flex; + align-items: center; + justify-content: center; +} + +.about-container article .logo-container svg { + width: clamp(200px, 530px, 815px); +} + +.about-container article .text-block { + box-shadow: 0 0 0 100vmax var(--foreground-color); + background-color: var(--foreground-color); + clip-path: inset(0 -100vmax); + padding: 90px 0; + display: flex; + gap: 40px; + align-items: center; + justify-content: center; + flex-direction: column; + text-align: center; + color: var(--background-color); +} + +.about-container article .text-block .text-block-title { + font-size: 64px; + font-weight: 500; +} + +.hero-text-container { + width: 860px; +} + +.hero-text { + font-size: 45px; + font-weight: 200; } .about-container a { color: var(--color-three); } -.about-container article h2 { - color: var(--color-three); - font-size: 1.8rem; - padding-bottom: 10px; -} - -.about-container p { - color: var(--foreground-color); - font-size: 1.6rem; - padding-bottom: 10px; -} - -.about-container h3 { - font-size: 1.5rem; -} - .about-container { width: 80%; + margin-bottom: 140px; +} + +.feature-list { + padding: 35px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + row-gap: 60px; +} + +.feature-list-title { + text-align: center; + font-size: 64px; + font-weight: 500; +} + +.features { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 40px; +} + +.feature-card { + background-color: var(--foreground-color); + color: var(--background-color); + text-align: center; + display: flex; + padding: 30px; + border-radius: 24px; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 15px; +} + +.feature-card-header { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + row-gap: 15px; +} + +.feature-card-header h4 { + font-size: 33px; + font-weight: 500; +} + +.feature-card-body p { + font-size: 20px; + font-weight: 200; +} + +.about-footnote { + font-size: 24px; + text-align: center; + color: var(--foreground-color); } /* Styles for the settings page */ @@ -730,3 +815,47 @@ input:checked + .slider::before { .slider.round::before { border-radius: 50%; } + +@media screen and (width <= 1136px) { + .hero-text-container { + width: unset; + } + + .features { + grid-template-columns: repeat(2, 1fr); + } +} + +@media screen and (width <= 706px) { + .about-container article .logo-container svg { + width: clamp(200px, 290px, 815px); + } + + .about-container article .text-block .text-block-title { + font-size: 33px; + } + + .hero-text { + font-size: 22px; + } + + .about-container { + width: unset; + } + + .feature-list-title { + font-size: 33px; + } + + .features { + grid-template-columns: 1fr; + } + + .feature-list { + padding: 35px 0; + } + + .feature-card { + border-radius: 0; + } +} \ No newline at end of file diff --git a/src/templates/views/about.rs b/src/templates/views/about.rs index 3f34819..2b4de53 100644 --- a/src/templates/views/about.rs +++ b/src/templates/views/about.rs @@ -1,6 +1,6 @@ //! A module that handles the view for the about page in the `websurfx` frontend. -use maud::{html, Markup}; +use maud::{html, Markup, PreEscaped}; use crate::templates::partials::{footer::footer, header::header}; @@ -15,33 +15,141 @@ use crate::templates::partials::{footer::footer, header::header}; /// /// It returns the compiled html markup code as a result. pub fn about(colorscheme: &str, theme: &str, animation: &Option) -> Markup { + let logo_svg = r#" + + + + + + + + "#; + let feature_lightning = r#" + + "#; + let feature_secure = r#" + + "#; + let feature_clean = r#" + + "#; + let feature_privacy = r#" + + "#; + let feature_foss = r#" + + "#; + let feature_customizable = r#" + + "#; html!( (header(colorscheme, theme, animation)) main class="about-container"{ article { - div{ - h1{"Websurfx"} - hr size="4" width="100%" color="#a6e3a1"{} - } - p{"A modern-looking, lightning-fast, privacy-respecting, secure meta search engine written in Rust. It provides a fast and secure search experience while respecting user privacy."br{}" It aggregates results from multiple search engines and presents them in an unbiased manner, filtering out trackers and ads." + div class="logo-container" { + (PreEscaped(logo_svg)) } - h2{"Some of the Top Features:"} + div class="text-block" { + h3 class="text-block-title" {"Why Websurfx?"} + div class="hero-text-container" { + p class="hero-text" {"Websurfx aggregates results from multiple search engines and presents them in an unbiased manner, filtering out trackers and ads."} + } + } - ul{strong{"Lightning fast "}"- Results load within milliseconds for an instant search experience."} + div class="feature-list" { + h3 class="feature-list-title" {"Features"} + div class="features" { - ul{strong{"Secure search"}" - All searches are performed over an encrypted connection to prevent snooping."} + div class="feature-card" { + div class="feature-card-header" { + div class="feature-card-icon" { (PreEscaped(feature_lightning)) } + h4 { + "Lightning-fast" + } + } + div class="feature-card-body" { + p { + "Results load within milliseconds for an instant search experience." + } + } + } - ul{strong{"Ad free results"}" - All search results are ad free and clutter free for a clean search experience."} + div class="feature-card" { + div class="feature-card-header" { + div class="feature-card-icon" { (PreEscaped(feature_secure)) } + h4 { + "Secure Search" + } + } + div class="feature-card-body" { + p { + "All searches are performed over an encrypted connection to prevent snooping." + } + } + } - ul{strong{"Privacy focused"}" - Websurfx does not track, store or sell your search data. Your privacy is our priority."} + div class="feature-card" { + div class="feature-card-header" { + div class="feature-card-icon" { (PreEscaped(feature_clean)) } + h4 { + "Ad-free Results" + } + } + div class="feature-card-body" { + p { + "All search results are ad free and clutter free for a clean search experience." + } + } + } - ul{strong{"Free and Open source"}" - The entire project's code is open source and available for free on "{a href="https://github.com/neon-mmd/websurfx"{"GitHub"}}" under an GNU Affero General Public License."} + div class="feature-card" { + div class="feature-card-header" { + div class="feature-card-icon" { (PreEscaped(feature_privacy)) } + h4 { + "Privacy-focused" + } + } + div class="feature-card-body" { + p { + "Websurfx does not track, store or sell your search data. Your privacy is our priority." + } + } + } + + div class="feature-card" { + div class="feature-card-header" { + div class="feature-card-icon" { (PreEscaped(feature_foss)) } + h4 { + "Free and Open-source" + } + } + div class="feature-card-body" { + p { + "The entire project's code is open source and available for free on "{a href="https://github.com/neon-mmd/websurfx"{"GitHub"}}"." + } + } + } + + div class="feature-card" { + div class="feature-card-header" { + div class="feature-card-icon" { (PreEscaped(feature_customizable)) } + h4 { + "Highly Customizable" + } + } + div class="feature-card-body" { + p { + "Websurfx comes with 9 built-in color themes and supports creating custom themes effortlessly." + } + } + } + } + } - ul{strong{"Highly customizable"}" - Websurfx comes with 9 built-in color themes and supports creating custom themes effortlessly."} } - h3{"Devoloped by: "{a href="https://github.com/neon-mmd/websurfx"{"Websurfx team"}}} + h3 class="about-footnote" {"Developed by the "{a href="https://github.com/neon-mmd/websurfx"{"Websurfx team"}}} } (footer()) )