123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105 |
- html{
- background: url('../img/bg.jpg');
- background-attachment: fixed;
- background-size: cover;
- }
- .app.container{
- padding-left: 0;
- padding-right: 0;
- }
- @media (min-width: 768px) {
- .app.container{
- width: 750px;
- .box-shadow(0 0 30px rgba(0,0,0,0.3));
- .app-aside{
- overflow-x: hidden;
- }
-
- &.app-aside-folded{
- .app-aside{
- overflow-x: visible;
- }
- }
- &.app-aside-fixed{
- .aside-wrap{
- left: inherit;
- }
- &.app-aside-folded{
- .app-aside{
- > ul.nav{
- position: absolute;
- }
- }
- }
- }
- .app-header,
- .app-aside{
- max-width: 750px;
- }
- .app-footer-fixed{
- left: auto;
- right: auto;
- width: 100%;
- max-width: 750 - @app-aside-width;
- }
- &.app-aside-folded{
- .app-footer-fixed{
- max-width: 750 - @app-aside-folded-width;
- }
- }
- &.app-aside-dock{
- .app-footer-fixed{
- max-width: 750px;
- }
- }
- }
- }
- @media (min-width: 992px) {
- .app.container{
- width: 970px;
- .app-header,
- .app-aside{
- max-width: 970px;
- }
- .app-footer-fixed{
- max-width: 970 - @app-aside-width;
- }
- &.app-aside-folded{
- .app-footer-fixed{
- max-width: 970 - @app-aside-folded-width;
- }
- }
- &.app-aside-dock{
- .app-footer-fixed{
- max-width: 970px;
- }
- }
- }
- }
- @media (min-width: 1200px) {
- .app.container{
- width: 1170px;
- .app-header,
- .app-aside{
- max-width: 1170px;
- }
- .app-footer-fixed{
- max-width: 1170 - @app-aside-width;
- }
- &.app-aside-folded{
- .app-footer-fixed{
- max-width: 1170 - @app-aside-folded-width;
- }
- }
- &.app-aside-dock{
- .app-footer-fixed{
- max-width: 1170px;
- }
- }
- }
- }
|