mirror of
https://github.com/oceanprotocol/commons.git
synced 2023-03-15 18:03:00 +01:00
style date picker
This commit is contained in:
parent
f45bebea8b
commit
78873ac4bf
8
client/package-lock.json
generated
8
client/package-lock.json
generated
@ -1381,7 +1381,8 @@
|
||||
"@types/prop-types": {
|
||||
"version": "15.7.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.0.tgz",
|
||||
"integrity": "sha512-eItQyV43bj4rR3JPV0Skpl1SncRCdziTEK9/v8VwXmV6d/qOUO8/EuWeHBbCZcsfSHfzI5UyMJLCSXtxxznyZg=="
|
||||
"integrity": "sha512-eItQyV43bj4rR3JPV0Skpl1SncRCdziTEK9/v8VwXmV6d/qOUO8/EuWeHBbCZcsfSHfzI5UyMJLCSXtxxznyZg==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/q": {
|
||||
"version": "1.5.2",
|
||||
@ -1402,6 +1403,7 @@
|
||||
"version": "16.8.8",
|
||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.8.8.tgz",
|
||||
"integrity": "sha512-xwEvyet96u7WnB96kqY0yY7qxx/pEpU51QeACkKFtrgjjXITQn0oO1iwPEraXVgh10ZFPix7gs1R4OJXF7P5sg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/prop-types": "*",
|
||||
"csstype": "^2.2.0"
|
||||
@ -1411,6 +1413,7 @@
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-datepicker/-/react-datepicker-2.2.0.tgz",
|
||||
"integrity": "sha512-zVAeDqkQgSdARElFXwXXpaaADyoRMo1SPsBzw6WV2iciJqS3ysSvYjqEKyTZfGbGkgw5sExEI2QKXam/KlCtyg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/react": "*",
|
||||
"popper.js": "^1.14.1"
|
||||
@ -5443,7 +5446,8 @@
|
||||
"csstype": {
|
||||
"version": "2.6.3",
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.3.tgz",
|
||||
"integrity": "sha512-rINUZXOkcBmoHWEyu7JdHu5JMzkGRoMX4ov9830WNgxf5UYxcBUO0QTKAqeJ5EZfSdlrcJYkC8WwfVW7JYi4yg=="
|
||||
"integrity": "sha512-rINUZXOkcBmoHWEyu7JdHu5JMzkGRoMX4ov9830WNgxf5UYxcBUO0QTKAqeJ5EZfSdlrcJYkC8WwfVW7JYi4yg==",
|
||||
"dev": true
|
||||
},
|
||||
"currently-unhandled": {
|
||||
"version": "0.4.1",
|
||||
|
@ -165,15 +165,33 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
//
|
||||
// Date picker
|
||||
//
|
||||
:global .react-datepicker {
|
||||
font-family: inherit;
|
||||
color: inherit;
|
||||
border-color: $brand-grey-lighter;
|
||||
border-color: $brand-black;
|
||||
}
|
||||
|
||||
:global .react-datepicker__header {
|
||||
background: $brand-black;
|
||||
border-radius: 0;
|
||||
|
||||
.react-datepicker__day-name,
|
||||
.react-datepicker__day,
|
||||
.react-datepicker__time-name,
|
||||
.react-datepicker__current-month,
|
||||
.react-datepicker-time__header,
|
||||
.react-datepicker-year-header {
|
||||
color: $brand-white;
|
||||
}
|
||||
}
|
||||
|
||||
:global .react-datepicker__current-month,
|
||||
:global .react-datepicker-time__header,
|
||||
:global .react-datepicker-year-header {
|
||||
:global .react-datepicker-year-header,
|
||||
:global .react-datepicker__day-name {
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
|
||||
@ -185,6 +203,36 @@
|
||||
max-width: 16rem;
|
||||
}
|
||||
|
||||
:global .react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle:before,
|
||||
:global .react-datepicker__year-read-view--down-arrow:before,
|
||||
:global .react-datepicker__month-read-view--down-arrow:before,
|
||||
:global .react-datepicker__month-year-read-view--down-arrow:before {
|
||||
border-top-color: $brand-black;
|
||||
}
|
||||
|
||||
:global .react-datepicker__day--selected,
|
||||
:global .react-datepicker__day--in-selecting-range,
|
||||
:global .react-datepicker__day--in-range,
|
||||
:global .react-datepicker__month-text--selected,
|
||||
:global .react-datepicker__month-text--in-selecting-range,
|
||||
:global .react-datepicker__month-text--in-range {
|
||||
background-color: $brand-black;
|
||||
border-radius: 50%;
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
|
||||
:global .react-datepicker__day:hover,
|
||||
:global .react-datepicker__month-text:hover {
|
||||
background-color: $brand-pink;
|
||||
border-radius: 50%;
|
||||
font-weight: $font-weight-bold;
|
||||
color: $brand-white;
|
||||
}
|
||||
|
||||
:global .react-datepicker__day--outside-month {
|
||||
color: $brand-grey-light;
|
||||
}
|
||||
|
||||
// Size modifiers
|
||||
|
||||
.inputSmall {
|
||||
|
Loading…
Reference in New Issue
Block a user