Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- // ----
- // libsass (v3.2.5)
- // ----
- $site-font-family: "Open Sans";
- $site-font-size-default: 1.4rem;
- $site-font-size-small: 1.1rem;
- $site-font-weight-light: 300;
- $site-font-weight-bold: 900;
- $btn-default-bg-color: #EEE;
- $btn-cta-bg-color: #5396CF;
- $btn-danger-bg-color: #C13000;
- $site-bg-color: #E4DDCF;
- $site-nav-bg-color: #555;
- $site-control-bg-color: #5396CF;
- @function btn-hover($n) {
- @return darken($n, 5%);
- }
- @function shadow($n) {
- $shadow-dims: 0px 2px 0px;
- @return $shadow-dims darken($n, 10%);
- }
- html {
- font-size: 62.5%;
- }
- body {
- font: $site-font-size-default $site-font-family;
- }
- .btn {
- border: 0;
- font-size: $site-font-size-small;
- font-weight: $site-font-weight-bold !important;
- text-transform: uppercase;
- }
- .btn-default {
- background-color: $btn-default-bg-color;
- box-shadow: shadow($btn-default-bg-color);
- color: #444;
- &:hover {
- background-color: btn-hover($btn-default-bg-color);
- }
- }
- /***
- *FILTER
- *** */
- .filter-container {
- background-color: #555;
- color: #FFF;
- }
- .filter {
- background-color: #555;
- color: #FFF;
- top: 50px;
- bottom: 0;
- left: 0;
- }
- .filter.open {
- overflow-y: auto;
- }
- .filter-content {
- display: none;
- }
- .closed {
- width: 40px;
- z-index: 1000;
- /*apparently, this is needed */
- }
- .open {
- padding: 15px;
- padding-top: 0;
- }
- .filter-btn {
- cursor: pointer;
- background: #888;
- text-align: center;
- padding: 10px 0 5px 0;
- }
- .open .filter-btn {
- width: 40px;
- float: left;
- margin-left: -15px;
- }
- .filter-btn:hover {
- background: #777;
- }
- .closed label, .open label {
- cursor: pointer;
- text-transform: uppercase;
- font-family: "Open Sans";
- font-weight: 700;
- }
- .closed label {
- padding: 10px;
- padding-bottom: 4px;
- }
- .closed .filter-label {
- /*this is a better and more efficient way of displaying the label rotated
- *but needs to be tested cross-browser and for back compatability */
- /* Safari, Chrome */
- -webkit-transform: rotate(-90deg);
- /* Firefox */
- -moz-transform: rotate(-90deg);
- /* IE */
- -ms-transform: rotate(-90deg);
- position: absolute;
- top: 52px;
- left: -17px;
- }
- .closed .filter-label:hover {
- background: #444;
- }
- .open .filter-label {
- display: block;
- margin-bottom: 10px;
- padding-left: 45px;
- padding-top: 10px;
- border-bottom: 1px solid #888;
- padding-bottom: 0px;
- margin-left: -15px;
- margin-right: -15px;
- }
- /*main content */
- .main {
- padding-top: 15px;
- padding-left: 55px;
- /*offset for closed filter */
- }
- /***
- *RIBBON STYLE
- *** */
- .ribbon {
- background-color: $site-control-bg-color;
- border-radius: 0px;
- margin: -15px;
- margin-bottom: 15px;
- padding: 20px 10px;
- box-shadow: shadow($site-control-bg-color);
- }
- .ribbon div {
- color: #FFF;
- text-align: center;
- border-left: 1px solid #FFF;
- }
- /*date container */
- .ribbon div:first-child {
- text-align: left !important;
- border-left: 0px !important;
- }
- .ribbon-label {
- font-size: 1.8rem;
- font-weight: 300;
- }
- .ribbon-value {
- display: block;
- font-size: 2.5rem;
- font-weight: 300;
- }
- .ribbon .date {
- padding-top: 25px;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement