style(select): styling the select on showDropdowns

fetrarij · Jun 11, 2018 · 727f47f · 727f47f
1 parent e3edd35
commit 727f47f
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/demo/src/index.html b/demo/src/index.html
@@ -4,7 +4,6 @@
   <meta charset="utf-8">
   <title>ngx-daterangepicker-material demo</title>
   <base href="/">
-  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
 </head>

diff --git a/src/daterangepicker/daterangepicker.component.scss b/src/daterangepicker/daterangepicker.component.scss
@@ -55,6 +55,12 @@ $md-drppicker-control-active-border-color:  #08c !default;
 $md-drppicker-control-active-border-radius: $md-drppicker-control-border-radius !default;
 
 $md-drppicker-control-disabled-color:       #ccc !default;
+// Select
+$select-border: 1px solid #f2f2f2 !default;
+$select-background: rgba(255, 255, 255, 0.90) !default;
+$select-padding: 5px !default;
+$select-radius: 2px !default;
+$input-height: 3rem !default;
 /*
 * styles
 */
@@ -301,6 +307,12 @@ $md-drppicker-control-disabled-color:       #ccc !default;
 
   select {
     display: inline-block;
+    background-color: $select-background;
+    width: 100%;
+    padding: $select-padding;
+    border: $select-border;
+    border-radius: $select-radius;
+    height: $input-height;
     &.monthselect, &.yearselect {
       font-size: 12px;
       padding: 1px;