Anonymous avatar Anonymous committed 2d9d39d

Provides bootstrap style for datepicker, fixes #222. Code provided by matevzb, I only added the browser prefixes for bg-image gradients where required.

Comments (0)

Files changed (1)

bhtheme/htdocs/bloodhound.css

 
 /* @end */
 
+/* @group jQuery UI extensions (fix for Bootstrap) */
+.ui-datepicker {
+  background-color: #FBFBFB;
+  background-image: -webkit-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -moz-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -o-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -ms-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-repeat: repeat-x;
+  border: 1px solid #DDDDDD;
+  border-radius: 3px 3px 3px 3px;
+  box-shadow: 0 1px 0 #FFFFFF inset;
+  list-style: none outside none;
+  margin: 0 0 18px;
+  padding: 7px 14px;
+}
+
+.ui-datepicker a.ui-datepicker-prev,
+.ui-datepicker a.ui-datepicker-next {
+  background-color: #FBFBFB;
+  background-image: -webkit-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -moz-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -o-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -ms-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-repeat: repeat-x;
+  border: 1px solid #DDDDDD;
+  border-radius: 3px 3px 3px 3px;
+  box-shadow: 0 1px 0 #FFFFFF inset;
+  padding: 2px 10px;
+  margin: 2px 0 10px 0;
+  cursor: pointer;
+  text-decoration: none;
+}
+
+.ui-datepicker a.ui-datepicker-prev:before {
+  content: "\ab\a0";
+}
+
+.ui-datepicker a.ui-datepicker-next:after {
+  content: "\a0\bb";
+}
+
+.ui-datepicker a.ui-datepicker-prev {
+  float: left;
+}
+
+.ui-datepicker a.ui-datepicker-next {
+  float: right;
+}
+
+.ui-datepicker-title {
+  clear: both;
+}
+
+.ui-datepicker-calendar td {
+  background-color: #FBFBFB;
+  background-image: -webkit-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -moz-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -o-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: -ms-linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-image: linear-gradient(center top , #FFFFFF, #F5F5F5);
+  background-repeat: repeat-x;
+  border: 1px solid #DDDDDD;
+  border-radius: 3px 3px 3px 3px;
+  box-shadow: 0 1px 0 #FFFFFF inset;
+  text-align: center;
+}
+
+.ui-datepicker-calendar td a {
+  display: block;
+  padding: 2px 4px;
+  text-decoration: none;
+}
+
+.ui-datepicker-calendar td a.ui-state-hover,
+.ui-datepicker-calendar td a.ui-state-active {
+  color: #FBFBFB;
+  background-color: #08c;
+}
+
+/* stuff below was copied from bootstrap's default button rules */
+.ui-datepicker button {
+  display: inline-block;
+  *display: inline;
+  padding: 4px 12px;
+  margin-bottom: 0;
+  *margin-left: .3em;
+  font-size: 14px;
+  line-height: 20px;
+  *line-height: 20px;
+  color: #333333;
+  text-align: center;
+  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
+  vertical-align: middle;
+  cursor: pointer;
+  background-color: #f5f5f5;
+  *background-color: #e6e6e6;
+  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%,
+from(#ffffff), to(#e6e6e6));
+  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
+  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
+  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
+  background-repeat: repeat-x;
+  border: 1px solid #bbbbbb;
+  *border: 0;
+  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  border-bottom-color: #a2a2a2;
+  -webkit-border-radius: 4px;
+     -moz-border-radius: 4px;
+          border-radius: 4px;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',
+endColorstr='#ffe6e6e6', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  *zoom: 1;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px
+2px rgba(0, 0, 0, 0.05);
+     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px
+2px rgba(0, 0, 0, 0.05);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px
+2px rgba(0, 0, 0, 0.05);
+  border-color: #c5c5c5;
+  border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25);
+
+  margin-right: .3em;
+}
+
+.ui-datepicker button:hover,
+.ui-datepicker button:active {
+  color: #333333;
+  background-color: #e6e6e6;
+  *background-color: #d9d9d9;
+}
+
+.ui-datepicker button:active {
+  background-color: #cccccc;
+}
+
+.ui-datepicker button:hover {
+  color: #333333;
+  text-decoration: none;
+  background-color: #e6e6e6;
+  *background-color: #d9d9d9;
+  /* Buttons in IE7 don't get borders, so darken on hover */
+
+  background-position: 0 -15px;
+  -webkit-transition: background-position 0.1s linear;
+     -moz-transition: background-position 0.1s linear;
+       -o-transition: background-position 0.1s linear;
+          transition: background-position 0.1s linear;
+}
+
+/* @end */
+
 /* @group Sticky Status */
 
 [class*="span"].stickyStatus {
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.