diff options
1 files changed, 130 insertions, 114 deletions
| -rw-r--r-- | docs/css/spectre.css | 244 |
diff --git a/docs/css/spectre.css b/docs/css/spectre.css index 873c300..12f5331 100644 --- a/docs/css/spectre.css +++ b/docs/css/spectre.css @@ -402,7 +402,9 @@ a { text-decoration: none; } a:focus, -a:hover { +a:hover, +a:active, +a.active { color: #3b49af; text-decoration: underline; } @@ -465,7 +467,7 @@ h6 { } p { line-height: 2.4rem; - margin: 0 0 1em; + margin: 0 0 1rem; } a, ins, @@ -474,7 +476,7 @@ u { text-decoration-skip: ink edges; } blockquote { - border-left: .2rem solid #ddd; + border-left: .2rem solid #efefef; margin-left: 0; padding: 1rem 2rem; } @@ -482,7 +484,7 @@ blockquote p:last-child { margin-bottom: 0; } blockquote cite { - color: #b3b3b3; + color: #999; } ul, ol { @@ -522,7 +524,7 @@ mark { border-radius: .2rem; display: inline-block; line-height: 1; - padding: .3rem; + padding: .3rem .4rem; vertical-align: baseline; } kbd { @@ -531,7 +533,7 @@ kbd { color: #fff; display: inline-block; line-height: 1; - padding: .3rem; + padding: .3rem .4rem; vertical-align: baseline; } abbr[title] { @@ -596,13 +598,13 @@ abbr[title] { .table.table-striped tbody tr.active { background: #f0f0f0; } -.table th, .table td { border-bottom: .1rem solid #efefef; padding: 1.5rem 1rem; } .table th { - border-color: #e2e2e2; + border-bottom: .2rem solid #333; + padding: 1.5rem 1rem; } .btn { -webkit-appearance: none; @@ -648,19 +650,19 @@ abbr[title] { color: #fff; } .btn.btn-primary:focus { - background: #4856c1; + background: #4452c0; border-color: #3b49af; color: #fff; } .btn.btn-primary:hover { - background: #404fbe; - border-color: #35419c; + background: #3f4eba; + border-color: #3b49af; color: #fff; } .btn.btn-primary:active, .btn.btn-primary.active { - background: #3e4cb6; - border-color: #35419c; + background: #3d4ab3; + border-color: #3946a7; color: #fff; } .btn.btn-primary.loading::after { @@ -674,12 +676,10 @@ abbr[title] { color: #5764c6; } .btn.btn-link:focus, -.btn.btn-link:hover { - color: #35419c; -} +.btn.btn-link:hover, .btn.btn-link:active, .btn.btn-link.active { - color: #283176; + color: #3b49af; } .btn.btn-sm { font-size: 1.2rem; @@ -773,16 +773,16 @@ abbr[title] { appearance: none; background: #fff; background-image: none; - border: .1rem solid #c5c5c5; + border: .1rem solid #ccc; border-radius: .2rem; color: #333; display: block; font-size: 1.4rem; height: 3.2rem; - line-height: 1.8rem; + line-height: 2rem; max-width: 100%; outline: 0; - padding: .6rem .8rem; + padding: .5rem .8rem; position: relative; transition: all .2s ease; width: 100%; @@ -791,18 +791,17 @@ abbr[title] { border-color: #5764c6; } .form-input[disabled] { - background: #eeeff2; + background: #f8f8f8; } .form-input.input-sm { font-size: 1.2rem; height: 2.4rem; - padding: .3rem .6rem; + padding: .1rem .6rem; } .form-input.input-lg { font-size: 1.6rem; - height: 4.2rem; - line-height: 2rem; - padding: 1rem .8rem; + height: 4rem; + padding: .9rem .8rem; } .form-input.input-inline { display: inline-block; @@ -825,7 +824,7 @@ textarea.form-input { height: auto; } .form-input-hint { - color: #888; + color: #999; margin-top: .4rem; } .has-success .form-input-hint, @@ -845,10 +844,10 @@ textarea.form-input { -webkit-appearance: none; -moz-appearance: none; appearance: none; - border: .1rem solid #c5c5c5; + border: .1rem solid #ccc; border-radius: .2rem; font-size: 1.4rem; - line-height: 1.6rem; + line-height: 2rem; min-width: 18rem; outline: 0; padding: .5rem .8rem; @@ -871,13 +870,12 @@ textarea.form-input { .form-select.select-sm { font-size: 1.2rem; height: 2.4rem; - padding: .4rem 2rem .4rem .6rem; + padding: .1rem 2rem .1rem .6rem; } .form-select.select-lg { font-size: 1.6rem; - height: 4.2rem; - line-height: 2rem; - padding: 1rem 2.4rem 1rem .8rem; + height: 4rem; + padding: .9rem 2.4rem .9rem .8rem; } .has-success .form-select, .form-select.is-success { @@ -913,7 +911,7 @@ textarea.form-input { } .form-checkbox .form-icon, .form-radio .form-icon { - border: .1rem solid #c5c5c5; + border: .1rem solid #ccc; display: inline-block; font-size: 1.4rem; height: 1.4rem; @@ -927,10 +925,6 @@ textarea.form-input { vertical-align: top; width: 1.4rem; } -.form-checkbox:hover .form-icon, -.form-radio:hover .form-icon { - border-color: #929292; -} .form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon { background: #5764c6; @@ -998,9 +992,9 @@ textarea.form-input { position: relative; } .form-switch .form-icon { - background: #c5c5c5; + background: #ccc; background-clip: padding-box; - border: .1rem solid #c5c5c5; + border: .1rem solid #ccc; border-radius: .9rem; display: inline-block; height: 1.8rem; @@ -1041,20 +1035,20 @@ textarea.form-input { display: -webkit-flex; } .input-group .input-group-addon { - background: #f9f9f9; - border: .1rem solid #c5c5c5; + background: #f8f8f8; + border: .1rem solid #ccc; border-radius: .2rem; - line-height: 1.6rem; - padding: .7rem .8rem; + line-height: 2rem; + padding: .5rem .8rem; } .input-group .input-group-addon.addon-sm { font-size: 1.2rem; - padding: .3rem .6rem; + padding: .1rem .6rem; } .input-group .input-group-addon.addon-lg { font-size: 1.6rem; line-height: 2rem; - padding: 1rem .8rem; + padding: .9rem .8rem; } .input-group .input-group-addon, .input-group .input-group-btn { @@ -1111,10 +1105,10 @@ textarea.form-input { .label { background: #f8f8f8; border-radius: .2rem; - color: #888; + color: #666; display: inline-block; line-height: 1; - padding: .3rem; + padding: .3rem .4rem; vertical-align: baseline; } .label.label-primary { @@ -1125,6 +1119,10 @@ textarea.form-input { background: #32b643; color: #fff; } +.label.label-warning { + background: #ffb700; + color: #fff; +} .label.label-danger { background: #e85600; color: #fff; @@ -1135,7 +1133,7 @@ code { color: #e06870; display: inline-block; line-height: 1; - padding: .3rem; + padding: .3rem .4rem; vertical-align: baseline; } .code { @@ -1145,7 +1143,7 @@ code { position: relative; } .code::before { - color: #c5c5c5; + color: #ccc; content: attr(data-lang); font-size: 1.2rem; position: absolute; @@ -1206,7 +1204,7 @@ code { margin: 0 0 1rem 0; } .figure .figure-caption { - color: #888; + color: #666; margin-top: 1rem; } .container { @@ -1216,15 +1214,8 @@ code { padding-right: 1rem; width: 100%; } -@media screen and (min-width: 980px) { - .grid-960 { - width: 98rem; - } -} -@media screen and (min-width: 500px) { - .grid-480 { - width: 50rem; - } +.container.grid-960 { + max-width: 98rem; } .columns { display: flex; @@ -1578,30 +1569,52 @@ code { width: 8.33333333%; } } +.show-xs, +.show-sm, +.show-md, +.show-lg, +.show-xl { + display: none !important; +} @media screen and (max-width: 480px) { .hide-xs { display: none !important; } + .show-xs { + display: block !important; + } } @media screen and (max-width: 600px) { .hide-sm { display: none !important; } + .show-sm { + display: block !important; + } } @media screen and (max-width: 840px) { .hide-md { display: none !important; } + .show-md { + display: block !important; + } } @media screen and (max-width: 960px) { .hide-lg { display: none !important; } + .show-lg { + display: block !important; + } } @media screen and (max-width: 1280px) { .hide-xl { display: none !important; } + .show-xl { + display: block !important; + } } .navbar { -webkit-align-items: center; @@ -1636,15 +1649,16 @@ code { .empty { background: #f8f8f8; border-radius: .2rem; + color: #666; padding: 4rem; text-align: center; } -.empty .empty-title { - font-size: 1.8rem; - margin: 1.5rem 0 .5rem 0; +.empty .empty-title, +.empty .empty-meta { + margin: 1rem auto; } .empty .empty-meta { - color: #888; + color: #999; } .empty .empty-action { margin-top: 1.5rem; @@ -1655,21 +1669,16 @@ code { .form-autocomplete .form-autocomplete-input { -webkit-align-content: flex-start; align-content: flex-start; - background: #fff; - border: .1rem solid #c5c5c5; - border-radius: .2rem; - color: #333; - display: -ms-flexbox; display: flex; + display: -ms-flexbox; display: -webkit-flex; -ms-flex-line-pack: start; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; + height: auto; min-height: 3.6rem; - outline: 0; padding: .1rem 0 .1rem .2rem; - width: 100%; } .form-autocomplete .form-autocomplete-input.is-focused { border-color: #5764c6; @@ -1690,6 +1699,7 @@ code { padding: .1em 0; } .avatar { + background: #5764c6; border-radius: 50%; color: #fff; display: inline-block; @@ -1703,12 +1713,12 @@ code { width: 3.2rem; } .avatar.avatar-xs { - font-size: 1.2rem; + font-size: 1.4rem; height: 1.6rem; width: 1.6rem; } .avatar.avatar-sm { - font-size: 1.2rem; + font-size: 1rem; height: 2.4rem; width: 2.4rem; } @@ -1718,7 +1728,7 @@ code { width: 4.8rem; } .avatar.avatar-xl { - font-size: 2.8rem; + font-size: 2.6rem; height: 6.4rem; width: 6.4rem; } @@ -1747,12 +1757,13 @@ code { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); + vertical-align: middle; z-index: 1; } .avatar.avatar-xs[data-initial]::before { - -webkit-transform: translate(-50%, -50%) scale(.65); - -ms-transform: translate(-50%, -50%) scale(.65); - transform: translate(-50%, -50%) scale(.65); + -webkit-transform: translate(-50%, -50%) scale(.5); + -ms-transform: translate(-50%, -50%) scale(.5); + transform: translate(-50%, -50%) scale(.5); } .badge { display: inline-block; @@ -1870,10 +1881,10 @@ code { } .card .card-title { font-size: 2rem; - line-height: 1; + line-height: 1.4; } .card .card-meta { - color: #888; + color: #999; font-size: 1.3rem; } .chip { @@ -1926,7 +1937,7 @@ code { background: #fff; border-radius: .2rem; box-shadow: 0 .1rem .4rem rgba(0, 0, 0, .3); - display: block; + list-style: none; margin: 0; min-width: 18rem; padding: .8rem; @@ -1938,59 +1949,63 @@ code { } .menu .menu-item { border-radius: .2rem; - display: block; - line-height: 2.4rem; margin-top: 0; - padding: .3rem .8rem; + padding: 0 .8rem; text-decoration: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } -.menu .menu-item a { +.menu .menu-item > a { border-radius: .2rem; color: inherit; display: block; - margin: -.3rem -.8rem; - padding: .3rem .8rem; + line-height: 2.4rem; + margin: 0 -.8rem; + padding: .4rem .8rem; text-decoration: none; } -.menu .menu-item a:focus, -.menu .menu-item a:hover { +.menu .menu-item > a:focus, +.menu .menu-item > a:hover { color: #5764c6; } -.menu .menu-item a:active, -.menu .menu-item a.active { - background: #eff1fa; - color: #4452c0; +.menu .menu-item > a:active, +.menu .menu-item > a.active { + background: #f7f8fc; + color: #3b49af; } .menu .menu-header { color: #ccc; - display: block; font-size: 1.2rem; - line-height: 1.8rem; + line-height: 2rem; margin-top: 0; - padding: .2rem .8rem; + padding: .2rem 0; + position: relative; } .menu .menu-header::after { border-bottom: .1rem solid #efefef; content: ""; display: block; height: .1rem; - -webkit-transform: translateY(-1rem); - -ms-transform: translateY(-1rem); - transform: translateY(-1rem); + position: absolute; + top: 50%; width: 100%; } .menu .menu-header .menu-header-text { background: #fff; display: inline-block; - margin-left: -.6rem; - padding: 0 .6rem; + padding: 0 .8rem; position: relative; z-index: 99; } +.menu .menu-badge { + float: right; + padding: .4rem 0; +} +.menu .menu-badge .label { + margin: .2rem 0; +} .modal { -webkit-align-items: center; align-items: center; @@ -2077,10 +2092,10 @@ code { margin: 0; } .breadcrumb .breadcrumb-item:last-child { - color: #888; + color: #999; } .breadcrumb .breadcrumb-item:not(:first-child)::before { - color: #c5c5c5; + color: #ccc; content: "/"; padding: 0 .4rem; } @@ -2201,7 +2216,7 @@ code { color: #5764c6; } .nav .nav-item.active > a { - color: #333; + color: #666; font-weight: bold; } .nav .nav-item.active > a:focus, @@ -2213,7 +2228,7 @@ code { margin-left: 2rem; } .nav .nav a { - color: #808080; + color: #999; } .step { display: flex; @@ -2245,7 +2260,7 @@ code { width: 100%; } .step .step-item a { - color: #888; + color: #999; display: inline-block; padding: 2rem 1rem 0; text-decoration: none; @@ -2274,7 +2289,7 @@ code { background: #efefef; } .step .step-item.active ~ .step-item a::before { - background: #c5c5c5; + background: #ccc; } .tile { -webkit-align-content: space-between; @@ -2289,7 +2304,8 @@ code { margin: 0; padding: .5rem 0; } -.tile .tile-icon { +.tile .tile-icon, +.tile .tile-action { -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; @@ -2305,18 +2321,12 @@ code { .tile .tile-content:not(:last-child) { padding-right: 1rem; } -.tile .tile-action { - -webkit-flex: 0 0 auto; - -ms-flex: 0 0 auto; - flex: 0 0 auto; -} .tile .tile-title { font-size: 1.6rem; font-weight: 500; } .tile .tile-meta { - color: #888; - font-size: 1.3rem; + color: #999; } .tile.tile-centered { -webkit-align-items: center; @@ -2326,6 +2336,12 @@ code { .tile.tile-centered .tile-content { overflow: hidden; } +.tile.tile-centered .tile-title, +.tile.tile-centered .tile-meta { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} .toast { background: rgba(51, 51, 51, .9); border: .1rem solid #333; @@ -2484,7 +2500,7 @@ code { .divider { border-bottom: .1rem solid #efefef; display: block; - margin: .5rem 0; + margin: .8rem 0; } .loading { color: transparent !important; |