diff --git a/css/style.css b/css/style.css index 75e9841e..8ac6b032 100644 --- a/css/style.css +++ b/css/style.css @@ -6,3 +6,64 @@ * for example: General styles, Navigation styles, Hero styles, Footer etc. * */ +/* body */ +body { + display: flex; + flex-direction: column; + align-items: center; + background-color: bisque; + margin-top: 0; +} + +/* header */ +header { + background-color: goldenrod; + width: 100%; + padding-left: 13rem; +} + +header h1 { + font-size: 3rem; +} + +/* main */ +main { + padding-top: 0.5rem; +} + +article:first-child { + font-size: 1.3rem; +} + +article { + padding: 1rem 0 2rem 0; +} + +article h2, +article p { + padding: 0 10rem 0 10rem; +} + +img { + padding-left: 10rem; +} + +a { + padding-left: 10rem; +} + +/* footer */ +footer { + padding-bottom: 2rem; + text-align: center; +} + +hr { + display: block; + width: 50rem; + height: 1px; + border: 1px; + border-top: 1px solid rgb(140, 140, 141); + margin: 1em; + padding: 0.5rem; +} \ No newline at end of file diff --git a/index.html b/index.html index 67dfc7f5..488e540e 100644 --- a/index.html +++ b/index.html @@ -18,5 +18,41 @@ +
+

Web3 News Blog.

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora repellendus vero facilis iure maiores modi at dolor inventore.

+
+
+
+

+ Lorem ipsum dolor sit amet consectetur adipisicing +

+ picsum +

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt quos, odio vel repudiandae neque magni a in. Odit, ex?

+ Read More +
+ +
+

+ Lorem ipsum dolor sit amet consectetur. +

+ picsum +

Lorem ipsum dolor sit amet consectetur, adipisicing elit. Rerum in, necessitatibus labore totam facere, consequuntur natus inventore quaerat molestias laborum distinctio esse provident quia alias, tempore maiores incidunt temporibus obcaecati non eaque dicta voluptatem. Consectetur possimus provident molestias, quis aperiam obcaecati voluptatum in officiis voluptatem.

+ Read More +
+ +
+

+ Lorem ipsum dolor sit amet consectetur. +

+ picsum +

Lorem ipsum dolor sit, amet consectetur adipisicing elit. Nostrum aperiam corrupti minima.

+ Read More +
+
+ - + \ No newline at end of file