From a4ec2586aaadd7a53cfc65fafe81a2688effb950 Mon Sep 17 00:00:00 2001 From: Chris Bell Date: Tue, 24 Jun 2025 22:45:04 -0500 Subject: [PATCH] About section, and other changes --- index.html | 47 +++++++++++++---- res/css/main.css | 114 ++++++++++++++++++++++++++++++++++++++-- res/svg/header-logo.svg | 67 ++++++++++++++++++++++- 3 files changed, 211 insertions(+), 17 deletions(-) diff --git a/index.html b/index.html index 0090a63..c5fadec 100644 --- a/index.html +++ b/index.html @@ -4,14 +4,13 @@ - + Bellsworne - Home
- - +

WELCOME TO BELLSWORNE

Rooted in technology, sworn to nature

@@ -19,12 +18,38 @@
-
+ +
+

About Us

+

Hi! We're Bellsworne. We officially founded the company in 2025 with a strange idea: to create something that suits both our love for games and technology and our passion for farming and sustainability.

+

The name Bellsworne is the heart and core of what we do. It merges our last name, 'Bell,' with 'Sworne'—an old spelling of 'Sworn'—to represent the vows we made to each other.

+ +

OUR VALUES

+
    +
  • Integrity: Doing the right thing, especially when no one’s looking. No shortcuts, no nonsense.
  • +
  • Sustainability: Leaving things a little better than we found them, from our code to our soil.
  • +
  • Community: Looking out for our neighbors, both near and far. We’re all in this together, y’all.
  • +
  • Creativity: Making things with soul and a little bit of sass.
  • +
+ +

Socials

+ +
+ +
+

PAGES

+
+ +

Technologies

-

Developing software solutions that aren't corporate garbage.

+

Developing software that isn't soulless corporate garbage.

@@ -35,12 +60,12 @@ - - - - - - + +
+ +

Games

+

Creating games with a passion for storytelling and a whole lotta heart.

+
diff --git a/res/css/main.css b/res/css/main.css index 9cbea3a..693cae9 100644 --- a/res/css/main.css +++ b/res/css/main.css @@ -31,12 +31,12 @@ header { #logo { width: 100%; - max-width: 450px; /* Adjusted for the wider logo */ + max-width: 750px; height: auto; } .company-title h1 { - font-size: 3rem; + font-size: 4rem; margin: 0.5rem 0 0 0; color: #ffffff; } @@ -58,7 +58,7 @@ main { flex-wrap: wrap; justify-content: center; gap: 2rem; - max-width: 1200px; + max-width: 1800px; margin: 0 auto; } @@ -67,7 +67,7 @@ main { border-radius: 12px; padding: 2.5rem; text-align: center; - flex: 1 1 300px; /* Flex properties for responsive columns */ + flex: 1 1 300px; max-width: 350px; transition: transform 0.3s ease, box-shadow 0.3s ease; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); @@ -111,6 +111,110 @@ footer { color: #777; } +/* About Section Styling */ +.content-container { + background-color: #333333; + border-radius: 12px; + padding: 2.5rem; + margin: 2rem auto; + max-width: 1200px; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); + border: 1px solid #444; +} + +.content-container h2 { + text-align: center; + font-size: 2.5rem; + color: #ffffff; + margin-bottom: 1.5rem; +} + +.content-container h3 { + font-size: 1.8rem; + color: #ffffff; + margin-top: 2rem; + margin-bottom: 1rem; + padding-bottom: 0.5rem; + border-bottom: 1px solid #555; +} + +.content-container p { + color: #c0c0c0; + font-size: 1rem; + line-height: 1.7; +} + +.content-container ul { + list-style: none; + padding-left: 0; + margin-top: 1rem; +} + +.content-container li { + color: #c0c0c0; + padding-left: 1.8rem; + position: relative; + margin-bottom: 0.8rem; +} + +.content-container .checklist li::before { + content: '✔'; + position: absolute; + left: 0; + top: 2px; + color: #ffffff; + font-size: 1.2rem; +} + +/* Social Media Icons Styling */ +.social-icons { + list-style: none; + padding: 0; + display: flex; + justify-content: center; + gap: 1.5rem; +} + +.social-icons li { + display: inline-block; +} + +.social-icons a { + color: #a0a0a0; + font-size: 2rem; + transition: color 0.3s ease, transform 0.3s ease; +} + +.social-icons a:hover { + color: #ffffff; + transform: scale(1.1); +} + +/* Divider Styling */ +.divider { + text-align: center; + margin: 4rem 0; + display: flex; + align-items: center; + justify-content: center; +} + +.divider h1 { + font-size: 2.2rem; + color: #ffffff; + margin: 0 2rem; + position: relative; + display: inline-block; +} + +.divider::before, +.divider::after { + content: ''; + flex-grow: 1; + height: 1px; + background-color: #555; +} + /* Responsive Design */ @media (max-width: 768px) { .company-title h1 { @@ -118,7 +222,7 @@ footer { } .section-card { - flex-basis: 100%; /* Full width on smaller screens */ + flex-basis: 100%; max-width: none; } } \ No newline at end of file diff --git a/res/svg/header-logo.svg b/res/svg/header-logo.svg index 6b8ea8f..d5d4c5b 100644 --- a/res/svg/header-logo.svg +++ b/res/svg/header-logo.svg @@ -1 +1,66 @@ -big-gear \ No newline at end of file + + + + + big-gear + \ No newline at end of file