From 3a33a75c166bf608a88c6ac54de8b636cb5e2f2e Mon Sep 17 00:00:00 2001 From: alfasf Date: Sat, 26 Aug 2017 21:46:43 -0700 Subject: [PATCH 01/13] initializing files and dir --- assets/style.css | 0 index.html | 0 2 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 assets/style.css create mode 100644 index.html diff --git a/assets/style.css b/assets/style.css new file mode 100644 index 00000000..e69de29b diff --git a/index.html b/index.html new file mode 100644 index 00000000..e69de29b From 7d89316b4bc42ed58fb6f1618c109a73b0ef3838 Mon Sep 17 00:00:00 2001 From: alfasf Date: Sun, 27 Aug 2017 00:04:19 -0700 Subject: [PATCH 02/13] adding html content --- index.html | 77 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) diff --git a/index.html b/index.html index e69de29b..94431bee 100644 --- a/index.html +++ b/index.html @@ -0,0 +1,77 @@ + + + + + + + The Lorem Ipsum Blog Page + + + + + +
+
+
+

The Lorem Micro Blog

+

By Alfredo D

+
+
+
+

A Most Posty Post

+

Written

+
+
+

First Thoughts...

+

+ Praesent tempus euismod metus, vel volutpat eros pulvinar ac. Nunc sit amet pellentesque mi, sed ultricies lacus. Nulla facilisi. Duis pellentesque condimentum metus. Phasellus lobortis justo tincidunt urna faucibus, in congue augue semper. Etiam id ante eget dui imperdiet finibus. Curabitur nec ligula neque. Donec in neque eleifend nisl scelerisque hendrerit. Aliquam lacus odio, vehicula quis diam eget, auctor aliquet est. Sed placerat ornare iaculis. Quisque tristique sed ante at ornare. Praesent in efficitur libero. Integer at sagittis felis. Duis pharetra nisi ac tincidunt consectetur. Nullam aliquet volutpat fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. +

+

Additional Thoughts...

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse hendrerit, purus nec malesuada tristique, magna mi semper justo, quis venenatis lectus mi eget risus. Pellentesque sed odio porttitor, aliquet diam sit amet, varius augue. In hac habitasse platea dictumst. Donec risus felis, convallis in mollis varius, porttitor ut turpis. In consequat, libero vel luctus egestas, eros ex fermentum sem, quis vulputate mi neque sed eros. Nam nulla dolor, placerat at efficitur eu, gravida eu nunc. +

+
+
+
+
+

Another Posty Post

+

Written

+
+
+

Only Thoughts...

+

+ Praesent tempus euismod metus, vel volutpat eros pulvinar ac. Nunc sit amet pellentesque mi, sed ultricies lacus. Nulla facilisi. Duis pellentesque condimentum metus. Phasellus lobortis justo tincidunt urna faucibus, in congue augue semper. Etiam id ante eget dui imperdiet finibus. Curabitur nec ligula neque. Donec in neque eleifend nisl scelerisque hendrerit. Aliquam lacus odio, vehicula quis diam eget, auctor aliquet est. Sed placerat ornare iaculis. Quisque tristique sed ante at ornare. Praesent in efficitur libero. Integer at sagittis felis. Duis pharetra nisi ac tincidunt consectetur. Nullam aliquet volutpat fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. +

+
+
+
+
+

A Posty Post

+

Written

+
+
+

Be it Resolved

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam cursus dui in nunc auctor dignissim. Nullam non nunc nulla. Sed id tortor eu metus convallis hendrerit quis sit amet lectus. Cras lacus orci, elementum at enim at, interdum placerat enim. Mauris nec augue nec urna iaculis varius. Nunc dictum, eros at venenatis feugiat, diam quam ullamcorper lectus, nec vulputate nulla nisl sed massa. Ut vitae hendrerit lacus. Fusce commodo aliquam quam, id pharetra purus aliquam id. Aliquam in cursus massa. Cras suscipit nibh quis ante elementum tempus. Aliquam erat volutpat. +

+

+ Cras convallis rutrum quam. Aliquam erat volutpat. Etiam convallis dolor ac nibh convallis volutpat. Curabitur ullamcorper efficitur pharetra. Mauris luctus, dui ut convallis maximus, erat tellus cursus orci, ut varius sapien metus ac velit. Nullam gravida condimentum lacus, sit amet malesuada erat hendrerit eu. Maecenas eleifend lorem vel est euismod sodales. Nam quis tortor scelerisque, porttitor arcu ac, ultricies justo. Nullam egestas tincidunt ipsum eget sollicitudin. +

+
+
+ +
+ + +
+
+ This copyrighted telecast is presented by authority of the Office of the Commisioner of Blogging. It may not be reproduced or retransmitted in any form, and the accounts and description of this game may not be disseminated, without express written consent. +
+ + + + \ No newline at end of file From 68e62e79542f00b6319e325a05d0a07712a11824 Mon Sep 17 00:00:00 2001 From: alfasf Date: Sun, 27 Aug 2017 00:08:29 -0700 Subject: [PATCH 03/13] changing to span on date paragraphs --- index.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 94431bee..3ebdedf9 100644 --- a/index.html +++ b/index.html @@ -10,7 +10,7 @@
@@ -21,7 +21,7 @@

By Alfredo D

A Most Posty Post

-

Written

+ Written

First Thoughts...

@@ -37,7 +37,7 @@

Additional Thoughts...

Another Posty Post

-

Written

+ Written

Only Thoughts...

@@ -49,7 +49,7 @@

Only Thoughts...

A Posty Post

-

Written

+ Written

Be it Resolved

From 1581d01ca72418b165e0f22039f218666ab3f88b Mon Sep 17 00:00:00 2001 From: alfasf Date: Sun, 27 Aug 2017 01:11:14 -0700 Subject: [PATCH 04/13] adding more style, defining flex --- assets/style.css | 42 +++++++++++++++++++ index.html | 105 ++++++++++++++++++++++++----------------------- 2 files changed, 96 insertions(+), 51 deletions(-) diff --git a/assets/style.css b/assets/style.css index e69de29b..bd59c651 100644 --- a/assets/style.css +++ b/assets/style.css @@ -0,0 +1,42 @@ +*{ + font-family: 'Baloo Tammudu', cursive; + font-size: 16px; + box-sizing: border-box; + margin: 0; +} + +nav{ + position: fixed; + background: #f7f71d; + width: 100%; + top: 0; + left: 0; +} + +main{ + max-width: 990px; + margin: 50px auto; +} + +#headertitle{ + border: 2px solid; + border-radius: 20px; + background: rgba(33, 208, 39, 0.6); + text-align: center; + padding: 5px 0; +} + +#headertitle h1{ + font-size: 1.35rem; +} + +#headertitle h2{ + font-size: 1.05rem; + font-style: italic; + font-weight: normal; + line-height: 1; +} + +.flexsection{ + display: flex; +} \ No newline at end of file diff --git a/index.html b/index.html index 3ebdedf9..bd39e945 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,8 @@ - The Lorem Ipsum Blog Page + The Lorem Ipsum Blog Page + @@ -14,64 +15,66 @@
-
+

The Lorem Micro Blog

By Alfredo D

-
-
-

A Most Posty Post

- Written -
-
-

First Thoughts...

-

- Praesent tempus euismod metus, vel volutpat eros pulvinar ac. Nunc sit amet pellentesque mi, sed ultricies lacus. Nulla facilisi. Duis pellentesque condimentum metus. Phasellus lobortis justo tincidunt urna faucibus, in congue augue semper. Etiam id ante eget dui imperdiet finibus. Curabitur nec ligula neque. Donec in neque eleifend nisl scelerisque hendrerit. Aliquam lacus odio, vehicula quis diam eget, auctor aliquet est. Sed placerat ornare iaculis. Quisque tristique sed ante at ornare. Praesent in efficitur libero. Integer at sagittis felis. Duis pharetra nisi ac tincidunt consectetur. Nullam aliquet volutpat fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. -

-

Additional Thoughts...

-

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse hendrerit, purus nec malesuada tristique, magna mi semper justo, quis venenatis lectus mi eget risus. Pellentesque sed odio porttitor, aliquet diam sit amet, varius augue. In hac habitasse platea dictumst. Donec risus felis, convallis in mollis varius, porttitor ut turpis. In consequat, libero vel luctus egestas, eros ex fermentum sem, quis vulputate mi neque sed eros. Nam nulla dolor, placerat at efficitur eu, gravida eu nunc. -

-
-
-
-
-

Another Posty Post

- Written -
-
-

Only Thoughts...

-

- Praesent tempus euismod metus, vel volutpat eros pulvinar ac. Nunc sit amet pellentesque mi, sed ultricies lacus. Nulla facilisi. Duis pellentesque condimentum metus. Phasellus lobortis justo tincidunt urna faucibus, in congue augue semper. Etiam id ante eget dui imperdiet finibus. Curabitur nec ligula neque. Donec in neque eleifend nisl scelerisque hendrerit. Aliquam lacus odio, vehicula quis diam eget, auctor aliquet est. Sed placerat ornare iaculis. Quisque tristique sed ante at ornare. Praesent in efficitur libero. Integer at sagittis felis. Duis pharetra nisi ac tincidunt consectetur. Nullam aliquet volutpat fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. -

-
-
-
-
-

A Posty Post

- Written -
-
-

Be it Resolved

-

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam cursus dui in nunc auctor dignissim. Nullam non nunc nulla. Sed id tortor eu metus convallis hendrerit quis sit amet lectus. Cras lacus orci, elementum at enim at, interdum placerat enim. Mauris nec augue nec urna iaculis varius. Nunc dictum, eros at venenatis feugiat, diam quam ullamcorper lectus, nec vulputate nulla nisl sed massa. Ut vitae hendrerit lacus. Fusce commodo aliquam quam, id pharetra purus aliquam id. Aliquam in cursus massa. Cras suscipit nibh quis ante elementum tempus. Aliquam erat volutpat. -

-

- Cras convallis rutrum quam. Aliquam erat volutpat. Etiam convallis dolor ac nibh convallis volutpat. Curabitur ullamcorper efficitur pharetra. Mauris luctus, dui ut convallis maximus, erat tellus cursus orci, ut varius sapien metus ac velit. Nullam gravida condimentum lacus, sit amet malesuada erat hendrerit eu. Maecenas eleifend lorem vel est euismod sodales. Nam quis tortor scelerisque, porttitor arcu ac, ultricies justo. Nullam egestas tincidunt ipsum eget sollicitudin. -

-
-
+
+
+
+

A Most Posty Post

+ Written +
+
+

First Thoughts...

+

+ Praesent tempus euismod metus, vel volutpat eros pulvinar ac. Nunc sit amet pellentesque mi, sed ultricies lacus. Nulla facilisi. Duis pellentesque condimentum metus. Phasellus lobortis justo tincidunt urna faucibus, in congue augue semper. Etiam id ante eget dui imperdiet finibus. Curabitur nec ligula neque. Donec in neque eleifend nisl scelerisque hendrerit. Aliquam lacus odio, vehicula quis diam eget, auctor aliquet est. Sed placerat ornare iaculis. Quisque tristique sed ante at ornare. Praesent in efficitur libero. Integer at sagittis felis. Duis pharetra nisi ac tincidunt consectetur. Nullam aliquet volutpat fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. +

+

Additional Thoughts...

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse hendrerit, purus nec malesuada tristique, magna mi semper justo, quis venenatis lectus mi eget risus. Pellentesque sed odio porttitor, aliquet diam sit amet, varius augue. In hac habitasse platea dictumst. Donec risus felis, convallis in mollis varius, porttitor ut turpis. In consequat, libero vel luctus egestas, eros ex fermentum sem, quis vulputate mi neque sed eros. Nam nulla dolor, placerat at efficitur eu, gravida eu nunc. +

+
+
+
+
+

Another Posty Post

+ Written +
+
+

Only Thoughts...

+

+ Praesent tempus euismod metus, vel volutpat eros pulvinar ac. Nunc sit amet pellentesque mi, sed ultricies lacus. Nulla facilisi. Duis pellentesque condimentum metus. Phasellus lobortis justo tincidunt urna faucibus, in congue augue semper. Etiam id ante eget dui imperdiet finibus. Curabitur nec ligula neque. Donec in neque eleifend nisl scelerisque hendrerit. Aliquam lacus odio, vehicula quis diam eget, auctor aliquet est. Sed placerat ornare iaculis. Quisque tristique sed ante at ornare. Praesent in efficitur libero. Integer at sagittis felis. Duis pharetra nisi ac tincidunt consectetur. Nullam aliquet volutpat fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. +

+
+
+
+
+

A Posty Post

+ Written +
+
+

Be it Resolved

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam cursus dui in nunc auctor dignissim. Nullam non nunc nulla. Sed id tortor eu metus convallis hendrerit quis sit amet lectus. Cras lacus orci, elementum at enim at, interdum placerat enim. Mauris nec augue nec urna iaculis varius. Nunc dictum, eros at venenatis feugiat, diam quam ullamcorper lectus, nec vulputate nulla nisl sed massa. Ut vitae hendrerit lacus. Fusce commodo aliquam quam, id pharetra purus aliquam id. Aliquam in cursus massa. Cras suscipit nibh quis ante elementum tempus. Aliquam erat volutpat. +

+

+ Cras convallis rutrum quam. Aliquam erat volutpat. Etiam convallis dolor ac nibh convallis volutpat. Curabitur ullamcorper efficitur pharetra. Mauris luctus, dui ut convallis maximus, erat tellus cursus orci, ut varius sapien metus ac velit. Nullam gravida condimentum lacus, sit amet malesuada erat hendrerit eu. Maecenas eleifend lorem vel est euismod sodales. Nam quis tortor scelerisque, porttitor arcu ac, ultricies justo. Nullam egestas tincidunt ipsum eget sollicitudin. +

+
+
+ This copyrighted telecast is presented by authority of the Office of the Commisioner of Blogging. It may not be reproduced or retransmitted in any form, and the accounts and description of this game may not be disseminated, without express written consent. +
+ +
+ +
- -
-
- This copyrighted telecast is presented by authority of the Office of the Commisioner of Blogging. It may not be reproduced or retransmitted in any form, and the accounts and description of this game may not be disseminated, without express written consent. -
- +
\ No newline at end of file From 66ccd3bf0ec3d885cd4cd669e206a7c7048e53a5 Mon Sep 17 00:00:00 2001 From: alfasf Date: Sun, 27 Aug 2017 01:36:21 -0700 Subject: [PATCH 05/13] some style --- assets/style.css | 1 + 1 file changed, 1 insertion(+) diff --git a/assets/style.css b/assets/style.css index bd59c651..109ff225 100644 --- a/assets/style.css +++ b/assets/style.css @@ -39,4 +39,5 @@ main{ .flexsection{ display: flex; + flex-direction: row; } \ No newline at end of file From e999c15acb5f22289a4f798bee124044e3b71684 Mon Sep 17 00:00:00 2001 From: alfasf Date: Sun, 27 Aug 2017 11:20:49 -0700 Subject: [PATCH 06/13] continue styling background inside columns --- assets/style.css | 22 ++++++++++++++++++++++ index.html | 18 ++++++++---------- 2 files changed, 30 insertions(+), 10 deletions(-) diff --git a/assets/style.css b/assets/style.css index 109ff225..2cf6590c 100644 --- a/assets/style.css +++ b/assets/style.css @@ -40,4 +40,26 @@ main{ .flexsection{ display: flex; flex-direction: row; + align-items: flex-start; +} + +.flexsection .inside-article{ + border: 4px solid; + padding: 10px; + margin: 10px 5px; + background: rgba(149, 167, 246, 0.76); +} + +.inside-article .body-article p{ + line-height: 1.05; +} + +/*Footer*/ + +footer{ + border: 3px solid; + border-radius: 20px; + padding: 7px; + line-height: 1; + background: rgba(149, 167, 246, 0.87); } \ No newline at end of file diff --git a/index.html b/index.html index bd39e945..d283ed32 100644 --- a/index.html +++ b/index.html @@ -20,7 +20,7 @@

The Lorem Micro Blog

By Alfredo D

-
+

A Most Posty Post

Written @@ -36,7 +36,7 @@

Additional Thoughts...

-
+

Another Posty Post

Written @@ -48,7 +48,7 @@

Only Thoughts...

-
+

A Posty Post

Written @@ -59,17 +59,15 @@

Be it Resolved

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam cursus dui in nunc auctor dignissim. Nullam non nunc nulla. Sed id tortor eu metus convallis hendrerit quis sit amet lectus. Cras lacus orci, elementum at enim at, interdum placerat enim. Mauris nec augue nec urna iaculis varius. Nunc dictum, eros at venenatis feugiat, diam quam ullamcorper lectus, nec vulputate nulla nisl sed massa. Ut vitae hendrerit lacus. Fusce commodo aliquam quam, id pharetra purus aliquam id. Aliquam in cursus massa. Cras suscipit nibh quis ante elementum tempus. Aliquam erat volutpat.

- Cras convallis rutrum quam. Aliquam erat volutpat. Etiam convallis dolor ac nibh convallis volutpat. Curabitur ullamcorper efficitur pharetra. Mauris luctus, dui ut convallis maximus, erat tellus cursus orci, ut varius sapien metus ac velit. Nullam gravida condimentum lacus, sit amet malesuada erat hendrerit eu. Maecenas eleifend lorem vel est euismod sodales. Nam quis tortor scelerisque, porttitor arcu ac, ultricies justo. Nullam egestas tincidunt ipsum eget sollicitudin. + Cras convallis rutrum quam. Aliquam erat volutpat. Etiam convallis dolor ac nibh convallis volutpat. Curabitur ullamcorper efficitur pharetra. Mauris luctus, dui ut convallis maximus, erat tellus cursus orci, ut varius sapien metus ac velit.

- -
- This copyrighted telecast is presented by authority of the Office of the Commisioner of Blogging. It may not be reproduced or retransmitted in any form, and the accounts and description of this game may not be disseminated, without express written consent. -
- +
- +
+ This copyrighted telecast is presented by authority of the Office of the Commisioner of Blogging. It may not be reproduced or retransmitted in any form, and the accounts and description of this game may not be disseminated, without express written consent. +