From 59182c54f4aab4f01cc03c6c43283f73d95a07c9 Mon Sep 17 00:00:00 2001 From: Aarni Date: Wed, 8 Jun 2016 19:44:14 +0300 Subject: [PATCH] Example sidebar CSS --- members/static/css/simple-sidebar.css | 125 ++++++++++++++++++++++++++ 1 file changed, 125 insertions(+) create mode 100644 members/static/css/simple-sidebar.css diff --git a/members/static/css/simple-sidebar.css b/members/static/css/simple-sidebar.css new file mode 100644 index 0000000..2ea845d --- /dev/null +++ b/members/static/css/simple-sidebar.css @@ -0,0 +1,125 @@ +/*! + * Start Bootstrap - Simple Sidebar (http://startbootstrap.com/) + * Copyright 2013-2016 Start Bootstrap + * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE) + */ + +/* Toggle Styles */ + +#wrapper { + padding-left: 0; + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + transition: all 0.5s ease; +} + +#wrapper.toggled { + padding-left: 250px; +} + +#sidebar-wrapper { + z-index: 1000; + position: fixed; + left: 250px; + width: 0; + height: 100%; + margin-left: -250px; + overflow-y: auto; + background: #000; + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + transition: all 0.5s ease; +} + +#wrapper.toggled #sidebar-wrapper { + width: 250px; +} + +#page-content-wrapper { + width: 100%; + position: absolute; + padding: 15px; +} + +#wrapper.toggled #page-content-wrapper { + position: absolute; + margin-right: -250px; +} + +/* Sidebar Styles */ + +.sidebar-nav { + position: absolute; + top: 0; + width: 250px; + margin: 0; + padding: 0; + list-style: none; +} + +.sidebar-nav li { + text-indent: 20px; + line-height: 40px; +} + +.sidebar-nav li a { + display: block; + text-decoration: none; + color: #999999; +} + +.sidebar-nav li a:hover { + text-decoration: none; + color: #fff; + background: rgba(255,255,255,0.2); +} + +.sidebar-nav li a:active, +.sidebar-nav li a:focus { + text-decoration: none; +} + +.sidebar-nav > .sidebar-brand { + height: 65px; + font-size: 18px; + line-height: 60px; +} + +.sidebar-nav > .sidebar-brand a { + color: #999999; +} + +.sidebar-nav > .sidebar-brand a:hover { + color: #fff; + background: none; +} + +@media(min-width:768px) { + #wrapper { + padding-left: 250px; + } + + #wrapper.toggled { + padding-left: 0; + } + + #sidebar-wrapper { + width: 250px; + } + + #wrapper.toggled #sidebar-wrapper { + width: 0; + } + + #page-content-wrapper { + padding: 20px; + position: relative; + } + + #wrapper.toggled #page-content-wrapper { + position: relative; + margin-right: 0; + } +} \ No newline at end of file