diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..2c687a1 Binary files /dev/null and b/.DS_Store differ diff --git a/index.html b/index.html deleted file mode 100644 index f534aa1..0000000 --- a/index.html +++ /dev/null @@ -1,22 +0,0 @@ - - - - - - RHassett Plumbing - - - -
-

RHassett Plumbing

-

(415) 599-9320

-

San Francisco's Plumber

-
- -

Ronan Hassett Plumbing is the best in the area.

-

Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci eveniet inventore doloribus magni repellat nam iure repellendus doloremque ad odio voluptatum officia, perspiciatis, maiores vero facilis dignissimos quibusdam quae reiciendis.

- Rhasset Plumbing Logo - - - - \ No newline at end of file diff --git a/static/.DS_Store b/static/.DS_Store new file mode 100644 index 0000000..6db111f Binary files /dev/null and b/static/.DS_Store differ diff --git a/static/PaymentMethodInspo.png b/static/PaymentMethodInspo.png new file mode 100644 index 0000000..b464989 Binary files /dev/null and b/static/PaymentMethodInspo.png differ diff --git a/static/TeamPageInspo.png b/static/TeamPageInspo.png new file mode 100644 index 0000000..795ce34 Binary files /dev/null and b/static/TeamPageInspo.png differ diff --git a/static/aboutUsPageInspo.png b/static/aboutUsPageInspo.png new file mode 100644 index 0000000..236ab4e Binary files /dev/null and b/static/aboutUsPageInspo.png differ diff --git a/static/describingTeamInspo.png b/static/describingTeamInspo.png new file mode 100644 index 0000000..ca30c49 Binary files /dev/null and b/static/describingTeamInspo.png differ diff --git a/static/hours:conatactInspo.png b/static/hours:conatactInspo.png new file mode 100644 index 0000000..f3f8213 Binary files /dev/null and b/static/hours:conatactInspo.png differ diff --git a/static/index.html b/static/index.html new file mode 100644 index 0000000..bb55d82 --- /dev/null +++ b/static/index.html @@ -0,0 +1,155 @@ + + + + + + RHassett Plumbing + + + + +
+ + + +
+

RHassett Plumbing

+
+ San Francisco's Trusted Plumber +
+
+ + +
+ San Francisco, CA +
+ (415) 599-9320 +
+
+ +  Call Us Now!  +
+ + +
+ + + + +
+
+
+
+ + Services +
+
+ +
+
+ Testimonials +
+
+ +
+
+ About +
+
+ +
+
+ Contact +
+ +
+ +
+ + + +
+
+

Services Offered

+
+ + Drain repair, Plumbing inspection, Toilet repair, Electric inspection, Plumbing repair. + +
+
+ + + +
+ + + +
+
+

Testimonials

+
+
+
+ Read Jeanne D.'s review of R. Hassett Plumbing on Yelp +
+ +
+ Read Jenny M.'s review of R. Hassett Plumbing on Yelp +
+ +
+ Read Madeleine R.'s review of R. Hassett Plumbing on Yelp +
+
+
+ + + + +
+
+

About Us

+
+ + Your Trusted Plumbing Expert with 20 Years of Experience +
+ With over two decades of experience and countless glowing reviews, RHassett Plumbing is the trusted choice for all your plumbing needs. + Fully licensed and certified, we deliver reliable, friendly, and high-quality solutions. + Whether it's a leaky faucet or a complex pipe repair, we pride ourselves on delivering expert craftsmanship and trustworthy service you can count on. + Choose a plumber who values your home, time, and peace of mind—because great plumbing starts with someone you can trust. + +
+
+ + + +
+ + +
+
+

Contact Us

+
+ +  Call Us Now!  + + + +
+
+ + + +
+ + +
+ Back To Home +
+ + + + + \ No newline at end of file diff --git a/static/pipebackground.jpg b/static/pipebackground.jpg new file mode 100644 index 0000000..ef6883f Binary files /dev/null and b/static/pipebackground.jpg differ diff --git a/static/style.css b/static/style.css index 0ca54c7..0acb630 100644 --- a/static/style.css +++ b/static/style.css @@ -1,51 +1,180 @@ -body{ - /* background: linear-gradient(#00438a,skyblue); - background-repeat: no-repeat; */ - /* background-attachment: fixed; */ - background: linear-gradient(#00438a,skyblue); background-repeat: no-repeat; - background-attachment: fixed; - /* background-position: center; */ - background-size: cover; -} -#top{ - background-image: url("https://media.istockphoto.com/id/1225791966/vector/industrial-seamless-pattern-piping-for-water-gas-oil.jpg?s=612x612&w=0&k=20&c=lcLkr0KEoiiItu9DCdlboFTKdaSW4zFHzSerKNgFQRM="); - background-repeat: repeat-x; - background-size:contain; - border-radius: 5px; - -webkit-text-stroke: 1px rgb(0, 0, 0); - border-style: double; - border-color: aliceblue; -} - -.header{ - text-align: center; - color: whitesmoke; - font-family: arial; - padding-bottom: 5px; -} - -#motto{ - /* border-bottom-style:double; - padding-bottom: 10px; */ -} - -#logo1{ - width:165px; - height:90px; -} - -p{ - background-color: rgb(26, 26, 26); - font-family: "consolas",sans-serif; - color: #ffffffc2; - font-weight: bold; - border-style:outset; - border-width: 2px; - border-color: #ffffffc2; - border-radius: 7px; - padding: 5px; -} -/* this is using the id of p3, to specifically style that element */ -/* #p1{ - color: #d1ae00; -} */ \ No newline at end of file +body{ + /* background: linear-gradient(#00438a,skyblue); + background-repeat: no-repeat; */ + background-attachment: fixed; + background:rgb(245, 239, 231); + background-repeat: no-repeat; + background-attachment: fixed; + background-size: cover; +} +#top{ + /* background-image: url("https://media.istockphoto.com/id/1225791966/vector/industrial-seamless-pattern-piping-for-water-gas-oil.jpg?s=612x612&w=0&k=20&c=lcLkr0KEoiiItu9DCdlboFTKdaSW4zFHzSerKNgFQRM="); */ + background-color: rgb(33, 53, 85) ; + background-repeat: repeat-x; + background-size:contain; + border-radius: 5px; + -webkit-text-stroke: 1px rgb(0, 0, 0); + border-style: double; + border-color: aliceblue; + display: flex; + align-items: center; + justify-content: center; + padding: 10px; + + + +} + +.header{ + text-align: center; + color: whitesmoke; + font-family: arial; + padding-bottom: 5px; + +} + +.logo img{ + max-width:200px; + height: auto; +} + +.header-center-content { + font-size: 2.5rem; + text-align: center; + flex-grow: 1; + } + + .motto{ + font-size: 20px; + margin-top: -55px; + color: whitesmoke; + font-family: arial; + margin-bottom: 20px; + +} + +.header-right-content { + text-align: right; + color: whitesmoke; + font-family: arial; + font-size: 18px; + margin-right: 10px; +} + + + +p{ + background-color:rgb(62, 88, 121) ; + font-family: "consolas",sans-serif; + color: #ffffffc2; + font-weight: bold; + border-style:outset; + border-width: 2px; + border-color: #ffffffc2; + border-radius: 7px; + padding: 5px; +} + +.yelp-review { + display: flex; + justify-content: space-between; + gap: 10px; + + +} + .review { + flex: 1; + + } + + .call-button { + display: inline-block; + padding: 5px; + background-color:rgb(62, 88, 121); + color: #ffffffc2; + font-weight: bold; + text-decoration: none; + font-size: 16px; + border-width: 2px; + border-style:outset; + border-radius: 7px; + border-color: #ffffffc2; + cursor: pointer; + } + + .navigation-bar { + background-color: rgb(216, 196, 182) ; + background-repeat: repeat-x; + background-size:contain; + border-radius: 5px; + -webkit-text-stroke: 1px rgb(0, 0, 0); + border-style: double; + border-color: aliceblue; + display: flex; + align-items: center; + justify-content: center; + + } + + .navigation-buttons { + font-family: arial; + color: rgb(33, 53, 85); + -webkit-text-stroke: 0px; + font-size: 1.2rem; + font-weight: bold; + padding: 25px; + cursor: pointer; + + + } + + + .underline-on-hover:hover { + text-decoration: underline; +} + + +/* remove default changes that come with HTML links */ +a { + text-decoration: none; + color: inherit; +} + +.section { + height: 100vh; /* Each section takes up the full viewport height */ + padding: 20px; +} + +.back-home-button { + display: inline-block; + padding: 5px; + background-color:rgb(62, 88, 121); + color: #ffffffc2; + font-weight: bold; + text-decoration: none; + font-size: 16px; + border-width: 2px; + border-style:outset; + border-radius: 7px; + border-color: #ffffffc2; + cursor: pointer; + position: fixed; + right: 10px; + bottom: 10px; + margin: 10px; + + + + +} + + + + +/* this is the website i used for the color theme (refer to this when needed to choose coloring to stick w/ theme) */ +/* https://colorhunt.co/palette/2135553e5879d8c4b6f5efe7 */ + +/* this is using the id of p3, to specifically style that element */ +/* #p1{ + color: #d1ae00; +} */