breadcrumbs, small fixes

1 files changed, 100 insertions, 2 deletions

diff --git a/weblog/static/weblog/css/weblog.css b/weblog/static/weblog/css/weblog.css
index 0b7c4e6..000549f 100755
--- a/weblog/static/weblog/css/weblog.css
+++ b/weblog/static/weblog/css/weblog.css
@@ -53,6 +53,7 @@ hr{
     border: none;
     height: 1px;
     background: linear-gradient(to right, rgba(0, 0, 0, 0), #3e3e3e, rgba(0, 0, 0, 0));
+    margin: 2em 0;
 }
 
 .navbar{
@@ -60,7 +61,7 @@ hr{
 }
 
 .nav-container{
-    padding: 0.5em 3em;
+    padding: 1.5em 4em;
 }
 
 .navbar-brand, .navbar-brand:visited{
@@ -69,6 +70,103 @@ hr{
     font-size: 1.5em;
 }
 
+.weblog-categories,
+.archive-list{
+    display: block;
+}
+
+.weblog-categories{
+    list-style: none;
+}
+
+.weblog-categories li a{
+    padding: 1em;
+}
+
+.weblog-categories li a.active{
+    background-color: #0055a0;
+}
+
+.breadcrumb{
+    padding: 0;
+    margin: 0;
+    list-style: none;
+    overflow: hidden;
+    background-color: #2e2e2e;
+}
+
+.breadcrumb li{
+    float: left;
+    background-color: #2e2e2e;
+}
+
+.breadcrumb li a{
+    position: relative;
+    display: block;
+    float: left;
+    padding: 0.5em 55px;
+    background: #0080a0;
+    color: #dedede;
+}
+
+.breadcrumb li a::after{
+    content: " ";
+    position: absolute;
+    display: block;
+    width: 0;
+    height: 0;
+    border-top: 50px solid transparent;
+    border-bottom: 50px solid transparent;
+    border-left: 30px solid #0080a0;
+    top: 50%;
+    margin-top: -50px;
+    left: 100%;
+    z-index: 2;
+    transition: 0.3s;
+}
+
+.breadcrumb li a::before{
+    content: " ";
+    position: absolute;
+    display: block;
+    width: 0;
+    height: 0;
+    border-top: 50px solid transparent;
+    border-bottom: 50px solid transparent;
+    border-left: 30px solid #dedede;
+    top: 50%;
+    margin-top: -50px;
+    margin-left: 1px;
+    left: 100%;
+    z-index: 1;
+}
+
+.breadcrumb li a:hover{
+    background-color: #0055a0;
+}
+
+.breadcrumb li a:hover::after{
+    border-left-color: #0055a0;
+}
+
+.breadcrumb li:first-child a{
+    padding-left: 1em;
+}
+
+.breadcrumb li:last-child a{
+    background-color: transparent;
+}
+
+.breadcrumb li:last-child a::after{
+    border-left: 30px solid #2e2e2e;
+}
+
+.form-group input,
+.form-group textarea,
+.form-group select{
+    width: 100%;
+}
+
 .blog-container{
     position: relative;
 }
@@ -83,7 +181,7 @@ hr{
 }
 
 .weblog-sidebar{
-    padding: 1em;
+    padding: 1em 2em;
 }
 
 .blog-content{