mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Add select specs
This commit is contained in:
Jeremy Thomas
parent
356a572327
commit
3c413174e4
28
docs/bulma.scss
vendored
28
docs/bulma.scss
vendored
@ -1,30 +1,2 @@
|
||||
@charset "utf-8";
|
||||
@import "../bulma";
|
||||
|
||||
.yolo {
|
||||
content: "default";
|
||||
}
|
||||
|
||||
@include tablet {
|
||||
.yolo {
|
||||
content: "tablet";
|
||||
}
|
||||
}
|
||||
|
||||
@include desktop {
|
||||
.yolo {
|
||||
content: "desktop";
|
||||
}
|
||||
}
|
||||
|
||||
@include widescreen {
|
||||
.yolo {
|
||||
content: "widescreen";
|
||||
}
|
||||
}
|
||||
|
||||
@include fullhd {
|
||||
.yolo {
|
||||
content: "fullhd";
|
||||
}
|
||||
}
|
||||
|
||||
@ -76,7 +76,7 @@ fieldset[disabled] .bulma-control-extend {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.select:not(.is-multiple):not(.is-loading)::after, .navbar-link:not(.is-arrowless)::after {
|
||||
.select:not(.is-multiple):not(.is-loading):not(.is-disabled)::after, .navbar-link:not(.is-arrowless)::after {
|
||||
border: 3px solid transparent;
|
||||
border-radius: 2px;
|
||||
border-right: 0;
|
||||
@ -184,8 +184,7 @@ fieldset[disabled] .bulma-control-extend {
|
||||
}
|
||||
|
||||
.button.is-loading::after, .loader, .select.is-loading::after, .control.is-loading::after {
|
||||
-webkit-animation: spinAround 500ms infinite linear;
|
||||
animation: spinAround 500ms infinite linear;
|
||||
animation: spinAround 500ms infinite linear;
|
||||
border: 2px solid #dbdbdb;
|
||||
border-radius: 9999px;
|
||||
border-right-color: transparent;
|
||||
@ -326,9 +325,7 @@ html {
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-moz-text-size-adjust: 100%;
|
||||
text-size-adjust: 100%;
|
||||
text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
article,
|
||||
@ -454,15 +451,6 @@ table th {
|
||||
color: #363636;
|
||||
}
|
||||
|
||||
@-webkit-keyframes spinAround {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spinAround {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
@ -4427,14 +4415,10 @@ div.icon-text {
|
||||
}
|
||||
|
||||
.progress:indeterminate {
|
||||
-webkit-animation-duration: 1.5s;
|
||||
animation-duration: 1.5s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-animation-name: moveIndeterminate;
|
||||
animation-name: moveIndeterminate;
|
||||
-webkit-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
animation-duration: 1.5s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-name: moveIndeterminate;
|
||||
animation-timing-function: linear;
|
||||
background-color: #ededed;
|
||||
background-image: linear-gradient(to right, #4a4a4a 30%, #ededed 30%);
|
||||
background-position: top left;
|
||||
@ -4466,15 +4450,6 @@ div.icon-text {
|
||||
height: 1.5rem;
|
||||
}
|
||||
|
||||
@-webkit-keyframes moveIndeterminate {
|
||||
from {
|
||||
background-position: 200% 0;
|
||||
}
|
||||
to {
|
||||
background-position: -200% 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes moveIndeterminate {
|
||||
from {
|
||||
background-position: 200% 0;
|
||||
@ -5625,7 +5600,7 @@ fieldset[disabled] .radio,
|
||||
height: 2.5em;
|
||||
}
|
||||
|
||||
.select:not(.is-multiple):not(.is-loading)::after {
|
||||
.select:not(.is-multiple):not(.is-loading):not(.is-disabled)::after {
|
||||
border-color: #485fc7;
|
||||
right: 1.125em;
|
||||
z-index: 4;
|
||||
@ -10060,9 +10035,11 @@ a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-i
|
||||
box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
|
||||
}
|
||||
|
||||
.pagination-previous[disabled],
|
||||
.pagination-previous[disabled], .pagination-previous.is-disabled,
|
||||
.pagination-next[disabled],
|
||||
.pagination-link[disabled] {
|
||||
.pagination-next.is-disabled,
|
||||
.pagination-link[disabled],
|
||||
.pagination-link.is-disabled {
|
||||
background-color: #dbdbdb;
|
||||
border-color: #dbdbdb;
|
||||
box-shadow: none;
|
||||
@ -12530,8 +12507,6 @@ label.panel-block:hover {
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
min-height: -webkit-min-content;
|
||||
min-height: -moz-min-content;
|
||||
min-height: min-content;
|
||||
}
|
||||
|
||||
@ -17164,7 +17139,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
|
||||
.bd-anchors {
|
||||
padding: var(--docs-side-padding);
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
}
|
||||
@ -17599,8 +17573,9 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
|
||||
.bd-categories {
|
||||
--height: 1.25;
|
||||
overflow-y: auto;
|
||||
max-height: 100vh;
|
||||
padding: var(--docs-side-padding);
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
}
|
||||
@ -21027,8 +21002,7 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
--device-md-width: 24px;
|
||||
--device-lg-height: 40px;
|
||||
--device-lg-width: 48px;
|
||||
-webkit-animation: bdDeviceBounce 3.5s infinite;
|
||||
animation: bdDeviceBounce 3.5s infinite;
|
||||
animation: bdDeviceBounce 3.5s infinite;
|
||||
border: 0 solid hsl(var(--device-deg), 100%, 53%);
|
||||
border-width: var(--device-y) var(--device-x);
|
||||
border-radius: 0.375em;
|
||||
@ -21073,44 +21047,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdDeviceBounce {
|
||||
0% {
|
||||
--device-deg: var(--device-sm-deg);
|
||||
height: var(--device-sm-height);
|
||||
width: var(--device-sm-width);
|
||||
}
|
||||
28% {
|
||||
--device-deg: var(--device-sm-deg);
|
||||
height: var(--device-sm-height);
|
||||
width: var(--device-sm-width);
|
||||
}
|
||||
33% {
|
||||
--device-deg: var(--device-md-deg);
|
||||
height: var(--device-md-height);
|
||||
width: var(--device-md-width);
|
||||
}
|
||||
62% {
|
||||
--device-deg: var(--device-md-deg);
|
||||
height: var(--device-md-height);
|
||||
width: var(--device-md-width);
|
||||
}
|
||||
67% {
|
||||
--device-deg: var(--device-lg-deg);
|
||||
height: var(--device-lg-height);
|
||||
width: var(--device-lg-width);
|
||||
}
|
||||
95% {
|
||||
--device-deg: var(--device-lg-deg);
|
||||
height: var(--device-lg-height);
|
||||
width: var(--device-lg-width);
|
||||
}
|
||||
100% {
|
||||
--device-deg: var(--device-sm-deg);
|
||||
height: var(--device-sm-height);
|
||||
width: var(--device-sm-width);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdDeviceBounce {
|
||||
0% {
|
||||
--device-deg: var(--device-sm-deg);
|
||||
@ -21149,15 +21085,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdGrow {
|
||||
from {
|
||||
transform: scale(0);
|
||||
}
|
||||
to {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdGrow {
|
||||
from {
|
||||
transform: scale(0);
|
||||
@ -21167,17 +21094,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdSlideDown {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(-1rem);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdSlideDown {
|
||||
from {
|
||||
opacity: 0;
|
||||
@ -21189,17 +21105,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdSlideUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(1rem);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdSlideUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
@ -21212,96 +21117,67 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
|
||||
.bd-focus-item .title, .bd-focus-item .subtitle, .bd-focus-mobile, .bd-focus-tablet, .bd-focus-desktop, .bd-focus-cube-1, .bd-focus-cube-2, .bd-focus-cube-3, .bd-focus-css3, .bd-focus-github {
|
||||
-webkit-animation-duration: 500ms;
|
||||
animation-duration: 500ms;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
-webkit-animation-timing-function: cubic-bezier(0.14, 0.71, 0.29, 0.86);
|
||||
animation-timing-function: cubic-bezier(0.14, 0.71, 0.29, 0.86);
|
||||
animation-duration: 500ms;
|
||||
animation-fill-mode: both;
|
||||
animation-timing-function: cubic-bezier(0.14, 0.71, 0.29, 0.86);
|
||||
transform-origin: center center;
|
||||
}
|
||||
|
||||
.bd-focus-item .title {
|
||||
-webkit-animation-name: bdSlideDown;
|
||||
animation-name: bdSlideDown;
|
||||
animation-name: bdSlideDown;
|
||||
}
|
||||
|
||||
.bd-focus-item .subtitle {
|
||||
-webkit-animation-name: bdSlideUp;
|
||||
animation-name: bdSlideUp;
|
||||
animation-name: bdSlideUp;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(1) .title {
|
||||
-webkit-animation-delay: 0;
|
||||
animation-delay: 0;
|
||||
animation-delay: 0;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(1) .subtitle {
|
||||
-webkit-animation-delay: 125ms;
|
||||
animation-delay: 125ms;
|
||||
animation-delay: 125ms;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(2) .title {
|
||||
-webkit-animation-delay: 500ms;
|
||||
animation-delay: 500ms;
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(2) .subtitle {
|
||||
-webkit-animation-delay: 625ms;
|
||||
animation-delay: 625ms;
|
||||
animation-delay: 625ms;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(3) .title {
|
||||
-webkit-animation-delay: 1000ms;
|
||||
animation-delay: 1000ms;
|
||||
animation-delay: 1000ms;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(3) .subtitle {
|
||||
-webkit-animation-delay: 1125ms;
|
||||
animation-delay: 1125ms;
|
||||
animation-delay: 1125ms;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(4) .title {
|
||||
-webkit-animation-delay: 1500ms;
|
||||
animation-delay: 1500ms;
|
||||
animation-delay: 1500ms;
|
||||
}
|
||||
|
||||
.bd-focus-item:nth-child(4) .subtitle {
|
||||
-webkit-animation-delay: 1625ms;
|
||||
animation-delay: 1625ms;
|
||||
animation-delay: 1625ms;
|
||||
}
|
||||
|
||||
.bd-focus-mobile, .bd-focus-tablet, .bd-focus-desktop {
|
||||
-webkit-animation-name: bdGrow;
|
||||
animation-name: bdGrow;
|
||||
animation-name: bdGrow;
|
||||
transform-origin: bottom center;
|
||||
}
|
||||
|
||||
.bd-focus-mobile {
|
||||
-webkit-animation-delay: 0;
|
||||
animation-delay: 0;
|
||||
animation-delay: 0;
|
||||
}
|
||||
|
||||
.bd-focus-tablet {
|
||||
-webkit-animation-delay: 250ms;
|
||||
animation-delay: 250ms;
|
||||
animation-delay: 250ms;
|
||||
}
|
||||
|
||||
.bd-focus-desktop {
|
||||
-webkit-animation-delay: 500ms;
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdCube1 {
|
||||
0% {
|
||||
transform: translate3d(0, -50px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
25%,
|
||||
100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
|
||||
@keyframes bdCube1 {
|
||||
@ -21316,18 +21192,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdCube2 {
|
||||
0% {
|
||||
transform: translate3d(-40px, 30px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
25%,
|
||||
100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdCube2 {
|
||||
0% {
|
||||
transform: translate3d(-40px, 30px, 0);
|
||||
@ -21340,18 +21204,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdCube3 {
|
||||
0% {
|
||||
transform: translate3d(40px, 30px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
25%,
|
||||
100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdCube3 {
|
||||
0% {
|
||||
transform: translate3d(40px, 30px, 0);
|
||||
@ -21365,42 +21217,24 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
|
||||
.bd-focus-cube-1, .bd-focus-cube-2, .bd-focus-cube-3 {
|
||||
-webkit-animation-direction: alternate;
|
||||
animation-direction: alternate;
|
||||
-webkit-animation-duration: 2000ms;
|
||||
animation-duration: 2000ms;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
animation-duration: 2000ms;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.bd-focus-cube-1 {
|
||||
-webkit-animation-delay: 500ms;
|
||||
animation-delay: 500ms;
|
||||
-webkit-animation-name: bdCube1;
|
||||
animation-name: bdCube1;
|
||||
animation-delay: 500ms;
|
||||
animation-name: bdCube1;
|
||||
}
|
||||
|
||||
.bd-focus-cube-2 {
|
||||
-webkit-animation-name: bdCube2;
|
||||
animation-name: bdCube2;
|
||||
-webkit-animation-delay: 750ms;
|
||||
animation-delay: 750ms;
|
||||
animation-name: bdCube2;
|
||||
animation-delay: 750ms;
|
||||
}
|
||||
|
||||
.bd-focus-cube-3 {
|
||||
-webkit-animation-name: bdCube3;
|
||||
animation-name: bdCube3;
|
||||
-webkit-animation-delay: 1000ms;
|
||||
animation-delay: 1000ms;
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdFadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
animation-name: bdCube3;
|
||||
animation-delay: 1000ms;
|
||||
}
|
||||
|
||||
@keyframes bdFadeIn {
|
||||
@ -21412,17 +21246,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdSlowIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scale(0.9);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdSlowIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
@ -21434,17 +21257,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdScaleIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scale(0);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdScaleIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
@ -21457,103 +21269,14 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
|
||||
.bd-focus-css3 {
|
||||
-webkit-animation-delay: 1000ms;
|
||||
animation-delay: 1000ms;
|
||||
-webkit-animation-name: bdScaleIn;
|
||||
animation-name: bdScaleIn;
|
||||
animation-delay: 1000ms;
|
||||
animation-name: bdScaleIn;
|
||||
}
|
||||
|
||||
.bd-focus-github {
|
||||
-webkit-animation-delay: 1500ms;
|
||||
animation-delay: 1500ms;
|
||||
-webkit-animation-duration: 1500ms;
|
||||
animation-duration: 1500ms;
|
||||
-webkit-animation-name: bdJellyPop;
|
||||
animation-name: bdJellyPop;
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdJellyPop {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: matrix3d(0.1, 0, 0, 0, 0, 0.1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
3.4% {
|
||||
opacity: 1;
|
||||
transform: matrix3d(0.384, 0, 0, 0, 0, 0.466, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
4.7% {
|
||||
transform: matrix3d(0.505, 0, 0, 0, 0, 0.639, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
6.81% {
|
||||
transform: matrix3d(0.693, 0, 0, 0, 0, 0.904, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
9.41% {
|
||||
transform: matrix3d(0.895, 0, 0, 0, 0, 1.151, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
10.21% {
|
||||
transform: matrix3d(0.947, 0, 0, 0, 0, 1.204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
13.61% {
|
||||
transform: matrix3d(1.111, 0, 0, 0, 0, 1.299, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
14.11% {
|
||||
transform: matrix3d(1.127, 0, 0, 0, 0, 1.298, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
17.52% {
|
||||
transform: matrix3d(1.187, 0, 0, 0, 0, 1.216, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
18.72% {
|
||||
transform: matrix3d(1.191, 0, 0, 0, 0, 1.169, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
21.32% {
|
||||
transform: matrix3d(1.177, 0, 0, 0, 0, 1.062, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
24.32% {
|
||||
transform: matrix3d(1.135, 0, 0, 0, 0, 0.964, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
25.23% {
|
||||
transform: matrix3d(1.121, 0, 0, 0, 0, 0.944, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
29.03% {
|
||||
transform: matrix3d(1.057, 0, 0, 0, 0, 0.907, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
29.93% {
|
||||
transform: matrix3d(1.043, 0, 0, 0, 0, 0.909, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
35.54% {
|
||||
transform: matrix3d(0.981, 0, 0, 0, 0, 0.966, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
36.74% {
|
||||
transform: matrix3d(0.974, 0, 0, 0, 0, 0.981, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
41.04% {
|
||||
transform: matrix3d(0.965, 0, 0, 0, 0, 1.02, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
44.44% {
|
||||
transform: matrix3d(0.969, 0, 0, 0, 0, 1.029, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
52.15% {
|
||||
transform: matrix3d(0.992, 0, 0, 0, 0, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
59.86% {
|
||||
transform: matrix3d(1.005, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
63.26% {
|
||||
transform: matrix3d(1.007, 0, 0, 0, 0, 0.993, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
75.28% {
|
||||
transform: matrix3d(1.001, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
85.49% {
|
||||
transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
90.69% {
|
||||
transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
|
||||
}
|
||||
animation-delay: 1500ms;
|
||||
animation-duration: 1500ms;
|
||||
animation-name: bdJellyPop;
|
||||
}
|
||||
|
||||
@keyframes bdJellyPop {
|
||||
@ -21649,23 +21372,18 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
|
||||
.bd-best-list {
|
||||
align-items: stretch;
|
||||
-webkit-animation-duration: 93.6s;
|
||||
animation-duration: 93.6s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
animation-duration: 93.6s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
display: flex;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 1.5rem;
|
||||
-webkit-animation-name: bdBestCarousel;
|
||||
animation-name: bdBestCarousel;
|
||||
animation-name: bdBestCarousel;
|
||||
}
|
||||
|
||||
.bd-best-list:hover {
|
||||
-webkit-animation-play-state: paused;
|
||||
animation-play-state: paused;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
.bd-best-item {
|
||||
@ -21713,12 +21431,6 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
@-webkit-keyframes bdBestCarousel {
|
||||
100% {
|
||||
transform: translateX(calc(-100% + 3120px));
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bdBestCarousel {
|
||||
100% {
|
||||
transform: translateX(calc(-100% + 3120px));
|
||||
@ -22692,8 +22404,7 @@ a.has-text-bootstrap-dark:hover, a.has-text-bootstrap-dark:focus {
|
||||
}
|
||||
|
||||
.bulma-loader-mixin {
|
||||
-webkit-animation: spinAround 500ms infinite linear;
|
||||
animation: spinAround 500ms infinite linear;
|
||||
animation: spinAround 500ms infinite linear;
|
||||
border: 2px solid #dbdbdb;
|
||||
border-radius: 9999px;
|
||||
border-right-color: transparent;
|
||||
@ -22934,5 +22645,3 @@ fieldset[disabled] .bulma-control-mixin {
|
||||
background: blue;
|
||||
}
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=bulma-docs.css.map */
|
||||
2
docs/css/bulma-docs.min.css
vendored
2
docs/css/bulma-docs.min.css
vendored
File diff suppressed because one or more lines are too long
30
docs/css/bulma.css
vendored
30
docs/css/bulma.css
vendored
@ -3728,7 +3728,7 @@ fieldset[disabled] .select select:hover {
|
||||
}
|
||||
|
||||
.select.is-disabled::after {
|
||||
border-color: #7a7a7a;
|
||||
border-color: #7a7a7a !important;
|
||||
}
|
||||
|
||||
.select.is-fullwidth {
|
||||
@ -11788,31 +11788,3 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
|
||||
background-color: #fafafa;
|
||||
padding: 3rem 1.5rem 6rem;
|
||||
}
|
||||
|
||||
.yolo {
|
||||
content: "default";
|
||||
}
|
||||
|
||||
@media screen and (min-width: 769px), print {
|
||||
.yolo {
|
||||
content: "tablet";
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
.yolo {
|
||||
content: "desktop";
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1216px) {
|
||||
.yolo {
|
||||
content: "widescreen";
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1408px) {
|
||||
.yolo {
|
||||
content: "fullhd";
|
||||
}
|
||||
}
|
||||
|
||||
53
docs/cyp/form/select.html
Normal file
53
docs/cyp/form/select.html
Normal file
@ -0,0 +1,53 @@
|
||||
---
|
||||
layout: cypress
|
||||
title: Form/Select
|
||||
---
|
||||
|
||||
{% capture options %}
|
||||
<option value="Argentina">Argentina</option>
|
||||
<option value="Bolivia">Bolivia</option>
|
||||
<option value="Brazil">Brazil</option>
|
||||
<option value="Chile">Chile</option>
|
||||
<option value="Colombia">Colombia</option>
|
||||
<option value="Ecuador">Ecuador</option>
|
||||
<option value="Guyana">Guyana</option>
|
||||
<option value="Paraguay">Paraguay</option>
|
||||
<option value="Peru">Peru</option>
|
||||
<option value="Suriname">Suriname</option>
|
||||
<option value="Uruguay">Uruguay</option>
|
||||
<option value="Venezuela">Venezuela</option>
|
||||
{% endcapture %}
|
||||
|
||||
<div id="select" class="select">
|
||||
<select>
|
||||
{{ options }}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{% for color in site.data.colors.justColors %}
|
||||
<div id="select-{{ color }}" class="select is-{{ color }}">
|
||||
<select>
|
||||
{{ options }}
|
||||
</select>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
{% for size in site.data.sizes %}
|
||||
<div id="select-{{ size }}" class="select is-{{ size }}">
|
||||
<select>
|
||||
{{ options }}
|
||||
</select>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<div id="select-multiple" class="select is-multiple">
|
||||
<select multiple>
|
||||
{{ options }}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div id="select-disabled" class="select is-disabled">
|
||||
<select disabled>
|
||||
{{ options }}
|
||||
</select>
|
||||
</div>
|
||||
@ -35,7 +35,7 @@ describe("Form/Input", () => {
|
||||
});
|
||||
});
|
||||
|
||||
it(`has correct color File`, () => {
|
||||
it(`has correct color Input`, () => {
|
||||
for (let i = 0; i < Cypress.env("color-names").length; i++) {
|
||||
const name = Cypress.env("color-names")[i];
|
||||
const baseColor = Cypress.env(name);
|
||||
@ -50,7 +50,7 @@ describe("Form/Input", () => {
|
||||
}
|
||||
});
|
||||
|
||||
it("has correct File sizes", () => {
|
||||
it("has correct Input sizes", () => {
|
||||
for (let i = 0; i < Cypress.env("just-sizes").length; i++) {
|
||||
const size = Cypress.env("just-sizes")[i];
|
||||
|
||||
|
||||
86
docs/cypress/integration/form/select.spec.js
Normal file
86
docs/cypress/integration/form/select.spec.js
Normal file
@ -0,0 +1,86 @@
|
||||
describe("Form/select", () => {
|
||||
beforeEach(() => {
|
||||
cy.visit("http://127.0.0.1:4000/cyp/form/select/");
|
||||
});
|
||||
|
||||
it("has a Select", () => {
|
||||
cy.get(".select").should("exist");
|
||||
});
|
||||
|
||||
it("has a correct Select", () => {
|
||||
cy.get("#select").then(($) => {
|
||||
const cs = window.getComputedStyle($[0]);
|
||||
expect(cs.display).to.equal("inline-block");
|
||||
expect(cs.height).to.equal(Cypress.env("control-height"));
|
||||
expect(cs.maxWidth).to.equal("100%");
|
||||
expect(cs.position).to.equal("relative");
|
||||
expect(cs.verticalAlign).to.equal("top");
|
||||
|
||||
const after = window.getComputedStyle($[0], "after");
|
||||
expect(after.borderColor).to.equal(Cypress.env("link"));
|
||||
});
|
||||
|
||||
cy.get("#select select").then(($) => {
|
||||
const cs = window.getComputedStyle($[0]);
|
||||
expect(cs.cursor).to.equal("pointer");
|
||||
expect(cs.display).to.equal("block");
|
||||
expect(cs.fontSize).to.equal("16px");
|
||||
expect(cs.height).to.equal(Cypress.env("control-height"));
|
||||
expect(cs.maxWidth).to.equal("100%");
|
||||
});
|
||||
});
|
||||
|
||||
it(`has correct color Select`, () => {
|
||||
for (let i = 0; i < Cypress.env("color-names").length; i++) {
|
||||
const name = Cypress.env("color-names")[i];
|
||||
const baseColor = Cypress.env(name);
|
||||
const invertColor = Cypress.env(`${name}-invert`);
|
||||
const lightColor = Cypress.env(`${name}-light`);
|
||||
const darkColor = Cypress.env(`${name}-dark`);
|
||||
|
||||
cy.get(`#select-${name}`).then(($) => {
|
||||
const after = window.getComputedStyle($[0], "after");
|
||||
expect(after.borderColor).to.equal(baseColor);
|
||||
});
|
||||
|
||||
cy.get(`#select-${name} select`).then(($) => {
|
||||
const cs = window.getComputedStyle($[0]);
|
||||
expect(cs.borderColor).to.equal(baseColor);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
it("has correct Select sizes", () => {
|
||||
for (let i = 0; i < Cypress.env("just-sizes").length; i++) {
|
||||
const size = Cypress.env("just-sizes")[i];
|
||||
|
||||
cy.get(`#select-${size}`).then(($) => {
|
||||
const cs = window.getComputedStyle($[0]);
|
||||
expect(cs.fontSize).to.equal(`${Cypress.env("sizes")[size]}px`);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
it("has a correct Select multiple", () => {
|
||||
cy.get("#select-multiple").then(($) => {
|
||||
const cs = window.getComputedStyle($[0]);
|
||||
expect(cs.height).to.not.equal(Cypress.env("control-height"));
|
||||
});
|
||||
|
||||
cy.get("#select-multiple select").then(($) => {
|
||||
const cs = window.getComputedStyle($[0]);
|
||||
expect(cs.cursor).to.equal("pointer");
|
||||
expect(cs.display).to.equal("block");
|
||||
expect(cs.fontSize).to.equal("16px");
|
||||
expect(cs.height).to.not.equal(Cypress.env("control-height"));
|
||||
expect(cs.maxWidth).to.equal("100%");
|
||||
});
|
||||
});
|
||||
|
||||
it("has a correct Select disabled", () => {
|
||||
cy.get("#select-disabled").then(($) => {
|
||||
const after = window.getComputedStyle($[0], "after");
|
||||
expect(after.borderColor).to.equal(Cypress.env("text-light"));
|
||||
});
|
||||
});
|
||||
});
|
||||
@ -66,7 +66,7 @@ $select-colors: $form-colors !default
|
||||
// Modifiers
|
||||
&.is-disabled
|
||||
&::after
|
||||
border-color: $input-disabled-color
|
||||
border-color: $input-disabled-color !important
|
||||
&.is-fullwidth
|
||||
width: 100%
|
||||
select
|
||||
|
||||
Loading…
Reference in New Issue
Block a user