From 12efeccdf74b61b61b8d784b55fa857eb409b8b9 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 21 Aug 2011 20:12:18 -0700 Subject: [PATCH] tweak pagination styles to include better border and box shadow --- bootstrap-1.0.0.css | 21 +++++++++++---------- bootstrap-1.0.0.min.css | 6 +++--- lib/patterns.less | 7 ++++--- 3 files changed, 18 insertions(+), 16 deletions(-) diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css index 27890cf205..a20a193252 100644 --- a/bootstrap-1.0.0.css +++ b/bootstrap-1.0.0.css @@ -6,7 +6,7 @@ * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Date: Sun Aug 21 20:06:59 PDT 2011 + * Date: Sun Aug 21 20:11:55 PDT 2011 */ /* Reset.less * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc). @@ -1546,9 +1546,9 @@ div.topbar ul li ul li span { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; - -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075); - -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075); - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075); + -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); + -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); } .pagination ul li { display: inline; @@ -1602,6 +1602,7 @@ div.topbar ul li ul li span { width: 560px; margin: -280px 0 0 -250px; background-color: #ffffff; + border: 1px solid #999; border: 1px solid rgba(0, 0, 0, 0.3); -webkit-border-radius: 6px; -moz-border-radius: 6px; @@ -1609,9 +1610,9 @@ div.topbar ul li ul li span { -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - -webkit-background-clip: padding; - -moz-background-clip: padding; - background-clip: padding; + -webkit-background-clip: padding-box; + -moz-background-clip: padding-box; + background-clip: padding-box; } .modal .modal-header { border-bottom: 1px solid #eee; @@ -1783,9 +1784,9 @@ div.topbar ul li ul li span { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; - -webkit-background-clip: padding; - -moz-background-clip: padding; - background-clip: padding; + -webkit-background-clip: padding-box; + -moz-background-clip: padding-box; + background-clip: padding-box; } .popover .content p, .popover .content ul, .popover .content ol { margin-bottom: 0; diff --git a/bootstrap-1.0.0.min.css b/bootstrap-1.0.0.min.css index 8dcabc6551..97a1aa7f68 100644 --- a/bootstrap-1.0.0.min.css +++ b/bootstrap-1.0.0.min.css @@ -194,13 +194,13 @@ div.topbar ul li ul li span{clear:both;display:block;background:rgba(0, 0, 0, 0. .tabs li.active a{background-color:#fff;padding:0 14px;border:1px solid #ccc;border-bottom:0;color:#808080;} .pills li a{margin:5px 3px 5px 0;padding:0 15px;text-shadow:0 1px 1px #fff;line-height:30px;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;}.pills li a:hover{background:#0050a3;color:#fff;text-decoration:none;text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);} .pills li.active a{background:#0069d6;color:#fff;text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);} -.pagination{height:36px;margin:18px 0;}.pagination ul{float:left;margin:0;border:1px solid #ddd;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.075);box-shadow:0 1px 2px rgba(0, 0, 0, 0.075);}.pagination ul li{display:inline;}.pagination ul li a{float:left;padding:0 14px;line-height:34px;border-right:1px solid #ddd;border-right:1px solid rgba(0, 0, 0, 0.15);text-decoration:none;} +.pagination{height:36px;margin:18px 0;}.pagination ul{float:left;margin:0;border:1px solid #ddd;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);}.pagination ul li{display:inline;}.pagination ul li a{float:left;padding:0 14px;line-height:34px;border-right:1px solid #ddd;border-right:1px solid rgba(0, 0, 0, 0.15);text-decoration:none;} .pagination ul li a:hover,.pagination ul li.active a{background-color:#c7eefe;} .pagination ul li.disabled a,.pagination ul li.disabled a:hover{background-color:none;color:#bfbfbf;} .pagination ul li.next a,.pagination ul li:last-child a{border:0;} .well{background-color:#f5f5f5;margin-bottom:20px;padding:19px;min-height:20px;border:1px solid #eee;border:1px solid rgba(0, 0, 0, 0.05);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);} .modal-backdrop{background-color:rgba(0, 0, 0, 0.5);position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;} -.modal{position:fixed;top:50%;left:50%;z-index:2000;width:560px;margin:-280px 0 0 -250px;background-color:#ffffff;border:1px solid rgba(0, 0, 0, 0.3);-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding;}.modal .modal-header{border-bottom:1px solid #eee;padding:5px 20px;}.modal .modal-header a.close{position:absolute;right:10px;top:10px;color:#999;line-height:10px;font-size:18px;} +.modal{position:fixed;top:50%;left:50%;z-index:2000;width:560px;margin:-280px 0 0 -250px;background-color:#ffffff;border:1px solid #999;border:1px solid rgba(0, 0, 0, 0.3);-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.modal .modal-header{border-bottom:1px solid #eee;padding:5px 20px;}.modal .modal-header a.close{position:absolute;right:10px;top:10px;color:#999;line-height:10px;font-size:18px;} .modal .modal-body{padding:20px;} .modal .modal-footer{background-color:#f5f5f5;padding:14px 20px 15px;border-top:1px solid #ddd;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:inset 0 1px 0 #ffffff;-moz-box-shadow:inset 0 1px 0 #ffffff;box-shadow:inset 0 1px 0 #ffffff;zoom:1;}.modal .modal-footer:before,.modal .modal-footer:after{display:table;content:"";} .modal .modal-footer:after{clear:both;} @@ -218,4 +218,4 @@ div.topbar ul li ul li span{clear:both;display:block;background:rgba(0, 0, 0, 0. .popover .arrow{position:absolute;width:0;height:0;} .popover .inner{background:rgba(0, 0, 0, 0.8);padding:3px;overflow:hidden;width:280px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);} .popover .title{background:#f5f5f5;padding:9px 15px;line-height:1;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;border-bottom:1px solid #eee;} -.popover .content{background-color:#ffffff;padding:14px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding;}.popover .content p,.popover .content ul,.popover .content ol{margin-bottom:0;} +.popover .content{background-color:#ffffff;padding:14px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.popover .content p,.popover .content ul,.popover .content ol{margin-bottom:0;} diff --git a/lib/patterns.less b/lib/patterns.less index 6506287a2f..fbe3df3eaf 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -441,7 +441,7 @@ div.topbar { border: 1px solid #ddd; border: 1px solid rgba(0,0,0,.15); .border-radius(3px); - .box-shadow(0 1px 2px rgba(0,0,0,.075); + .box-shadow(0 1px 2px rgba(0,0,0,.05); li { display: inline; a { @@ -505,10 +505,11 @@ div.topbar { width: 560px; margin: -280px 0 0 -250px; background-color: @white; + border: 1px solid #999; border: 1px solid rgba(0,0,0,.3); .border-radius(6px); .box-shadow(0 3px 7px rgba(0,0,0,0.3)); - .background-clip(padding); + .background-clip(padding-box); .modal-header { border-bottom: 1px solid #eee; padding: 5px 20px; @@ -647,7 +648,7 @@ div.topbar { background-color: @white; padding: 14px; .border-radius(0 0 3px 3px); - .background-clip(padding); + .background-clip(padding-box); p, ul, ol { margin-bottom: 0; }