diff --git a/adventure.jpg b/adventure.jpg new file mode 100644 index 0000000000..ca279918b3 Binary files /dev/null and b/adventure.jpg differ diff --git a/css/index.css b/css/index.css index e764f2b01f..6ead7e19fc 100644 --- a/css/index.css +++ b/css/index.css @@ -1 +1,239 @@ -/* LESS needs to be processed */ \ No newline at end of file +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ +html, +body, +div, +span, +applet, +object, +iframe, +h1, +h2, +h3, +h4, +h5, +h6, +p, +blockquote, +pre, +a, +abbr, +acronym, +address, +big, +cite, +code, +del, +dfn, +em, +img, +ins, +kbd, +q, +s, +samp, +small, +strike, +strong, +sub, +sup, +tt, +var, +b, +u, +i, +center, +dl, +dt, +dd, +ol, +ul, +li, +fieldset, +form, +label, +legend, +table, +caption, +tbody, +tfoot, +thead, +tr, +th, +td, +article, +aside, +canvas, +details, +embed, +figure, +figcaption, +footer, +header, +hgroup, +menu, +nav, +output, +ruby, +section, +summary, +time, +mark, +audio, +video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; +} +body { + line-height: 1; +} +ol, +ul { + list-style: none; +} +blockquote, +q { + quotes: none; +} +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} +* { + box-sizing: border-box; +} +html { + font-size: 62.5%; +} +html, +body { + font-family: 'Roboto', sans-serif; +} +h1, +h2, +h3, +h4, +h5 { + font-family: 'Indie Flower', cursive; +} +h1 { + font-size: 4rem; +} +h2 { + font-size: 3.2rem; + padding-bottom: 10px; +} +h4 { + font-size: 2.5rem; + padding-bottom: 10px; +} +p { + line-height: 1.5; + font-size: 1.6rem; + padding-bottom: 10px; +} +img { + max-width: 100%; + height: auto; +} +.container { + max-width: 800px; + width: 100%; + margin: 0 auto; +} +nav { + display: flex; + justify-content: space-between; +} +nav a { + text-decoration: none; + color: black; +} +.footer { + width: 100%; + border-top: 2px dashed #C0C0C0; + background: #FFEBCD; +} +.footer p { + text-align: center; + color: #212529; + font-size: 1.6rem; + padding: 20px; +} +.top { + display: flex; + justify-content: space-between; +} +.home .content-section { + margin: 30px 0; + display: flex; + flex-wrap: wrap; + justify-content: space-between; +} +.home .content-section .text-content { + width: 48%; + padding-right: 1%; +} +.home .content-section .img-content { + width: 48%; + padding-left: 1%; +} +.home .content-section .img-content img { + border-radius: 10px; +} +.home .inverse-content { + padding-bottom: 30px; + border-bottom: 2px dashed #C0C0C0; +} +.home .inverse-content .text-content { + padding-left: 1%; + padding-right: 0; +} +.home .inverse-content .img-content { + padding-right: 1%; + padding-left: 0; +} +.home .content-destination { + width: 75%; + margin: 0 auto 30px; +} +.home .content-destination img { + border-radius: 10px; +} +.home .content-pick { + padding-top: 30px; + border-top: 2px dashed #C0C0C0; + display: flex; + justify-content: space-between; +} +.home .content-pick .destination { + width: 30%; + margin-bottom: 30px; +} diff --git a/destination.jpg b/destination.jpg new file mode 100644 index 0000000000..691f029c28 Binary files /dev/null and b/destination.jpg differ diff --git a/fun-bus.jpg b/fun-bus.jpg new file mode 100644 index 0000000000..781fd3ad91 Binary files /dev/null and b/fun-bus.jpg differ diff --git a/fun.jpg b/fun.jpg new file mode 100644 index 0000000000..abeff206bd Binary files /dev/null and b/fun.jpg differ diff --git a/index.html b/index.html index bb8663b768..490fac7581 100644 --- a/index.html +++ b/index.html @@ -15,11 +15,25 @@ - - - +
+
+

Fun Bus

+ +
+
+ fun bus +
+
+

Welcome To Fun Bus!

+

Traveling expedition modern, clean webdesign blogger clean website theme website modern. Design pretty design, travelblogger adventure WordPress wanderlust theme blogger website expedition theme travelblogger. Adventure fun traveler pretty design website expedition.

+
+
-

Let's Go!

@@ -51,17 +65,17 @@

Pick Your Destination

Fun In The Sun

Expedition excursion design excursion fun, clean simple organized WordPress Travel colorful webdesign. Traveler blogger website design expedition clean excursion traveling.

-
Sign Me Up!
+

Mountain Excursion

Expedition excursion design excursion fun, clean simple organized WordPress Travel colorful webdesign. Traveler blogger website design expedition clean excursion traveling.

-
Sign Me Up!
+

Island Getaway

Expedition excursion design excursion fun, clean simple organized WordPress Travel colorful webdesign. Traveler blogger website design expedition clean excursion traveling.

-
Sign Me Up!
+
diff --git a/less/footer.less b/less/footer.less index 71cff032e9..1b3ebe1ba8 100644 --- a/less/footer.less +++ b/less/footer.less @@ -1,6 +1,6 @@ .footer { width: 100%; - border-top: 2px dashed silver; + border-top: 2px dashed @silver; background: @sandy-beach; p { diff --git a/less/home-page.less b/less/home-page.less index 5528d8a7a5..50fbc564e6 100644 --- a/less/home-page.less +++ b/less/home-page.less @@ -1,12 +1,13 @@ -.home { - + .top { + display: flex; + justify-content: space-between; + } + .home { .content-section { margin: 30px 0; display: flex; flex-wrap: wrap; justify-content: space-between; - - .text-content { width: 48%; @@ -52,10 +53,10 @@ border-top: 2px dashed @navigation-border; display: flex; justify-content: space-between; - - .destination { + + .destination { width: 30%; margin-bottom: 30px; } } -}// home \ No newline at end of file +} \ No newline at end of file diff --git a/less/index.less b/less/index.less index c113ca2c46..fa6ce433d7 100644 --- a/less/index.less +++ b/less/index.less @@ -1 +1,8 @@ // Follow the order in the readme +@import "variables"; +@import "mixins"; +@import "reset"; +@import "global"; +@import "navigation"; +@import "footer"; +@import "home-page"; \ No newline at end of file diff --git a/less/navigation.less b/less/navigation.less index f89120a0f1..e33bdf36dc 100644 --- a/less/navigation.less +++ b/less/navigation.less @@ -1 +1,10 @@ -// Navigation Styles here \ No newline at end of file +// Navigation Styles here + + nav { + display: flex; + justify-content: space-between; + a { + text-decoration: none; + color: black; + } +} \ No newline at end of file diff --git a/less/variables.less b/less/variables.less index 916eb0b7e0..42a83ca176 100644 --- a/less/variables.less +++ b/less/variables.less @@ -11,4 +11,6 @@ @silver: #C0C0C0; @shark: #212529; @eastern-blue: #17A2B8; -@sandy-beach: #FFEBCD; \ No newline at end of file +@sandy-beach: #FFEBCD; + +@tablet: ~"(min-width: 500px)"; \ No newline at end of file