@textbus/device-toggle-plugin
Advanced tools
| @import "~@tanbo/css-themes/themes/scss/default"; | ||
| .textbus-device { | ||
| float: left; | ||
| position: relative; | ||
| &-expand { | ||
| .textbus-device-menus { | ||
| transform: scaleY(1); | ||
| } | ||
| } | ||
| &-menus { | ||
| position: absolute; | ||
| bottom: 100%; | ||
| left: 0; | ||
| padding-top: 5px; | ||
| padding-bottom: 5px; | ||
| background-color: #fff; | ||
| transform-origin: 0 100%; | ||
| transition: transform .1s; | ||
| transform: scaleY(0); | ||
| background-color: rgba(252, 252, 251, .96); | ||
| box-shadow: 1px 1px 3px rgba(0, 0, 0, .2); | ||
| border-radius: 4px; | ||
| min-width: 100%; | ||
| font-size: 13px; | ||
| overflow: hidden; | ||
| z-index: 2; | ||
| } | ||
| &-option { | ||
| display: flex; | ||
| justify-content: space-between; | ||
| width: 100%; | ||
| text-align: left; | ||
| padding: 3px 20px; | ||
| background: none; | ||
| border: none; | ||
| outline: none; | ||
| cursor: pointer; | ||
| white-space: nowrap; | ||
| line-height: inherit; | ||
| min-height: 25px; | ||
| small { | ||
| margin-left: 20px; | ||
| opacity: .8; | ||
| } | ||
| &-active { | ||
| background-color: $color-light; | ||
| } | ||
| &:hover { | ||
| color: #fff; | ||
| background-color: $color-primary; | ||
| } | ||
| } | ||
| } |
+4
-4
| { | ||
| "name": "@textbus/device-toggle-plugin", | ||
| "version": "1.0.0", | ||
| "version": "1.1.0", | ||
| "description": "TextBus device toggle extensions.", | ||
@@ -12,3 +12,3 @@ "main": "./bundles/public-api.js", | ||
| "test-c": "cross-env env=test jest --coverage", | ||
| "build:lib": "rimraf bundles && gulp && webpack --config webpack-sass.config.js && tsc -p tsconfig-build.json", | ||
| "build:lib": "rimraf bundles && webpack --config webpack-sass.config.js && tsc -p tsconfig-build.json", | ||
| "publish:lib": "npm run build:lib && npm publish --access=public" | ||
@@ -30,3 +30,3 @@ }, | ||
| "@tanbo/css-themes": "^0.0.1", | ||
| "@textbus/core": "^1.0.0", | ||
| "@textbus/core": "^1.1.0", | ||
| "rxjs": "^6.0.0" | ||
@@ -45,3 +45,3 @@ }, | ||
| }, | ||
| "gitHead": "07356b30570734028be6d984259fd1e915d9d392" | ||
| "gitHead": "9fbf998c48b37ab01238d2bef41f9d0f949ca620" | ||
| } |
| module.exports = { | ||
| presets: [ | ||
| [ | ||
| "@babel/preset-env", | ||
| { | ||
| targets: { | ||
| node: "current" | ||
| } | ||
| } | ||
| ] | ||
| ], | ||
| plugins: ["transform-es2015-modules-commonjs"] | ||
| }; |
| @import "~@tanbo/css-themes/themes/scss/default"; | ||
| .textbus-device { | ||
| float: left; | ||
| position: relative; | ||
| &-expand { | ||
| .textbus-device-menus { | ||
| transform: scaleY(1); | ||
| } | ||
| } | ||
| &-menus { | ||
| position: absolute; | ||
| bottom: 100%; | ||
| left: 0; | ||
| padding-top: 5px; | ||
| padding-bottom: 5px; | ||
| background-color: #fff; | ||
| transform-origin: 0 100%; | ||
| transition: transform .1s; | ||
| transform: scaleY(0); | ||
| background-color: rgba(252, 252, 251, .96); | ||
| box-shadow: 1px 1px 3px rgba(0, 0, 0, .2); | ||
| border-radius: 4px; | ||
| min-width: 100%; | ||
| font-size: 13px; | ||
| overflow: hidden; | ||
| z-index: 2; | ||
| } | ||
| &-option { | ||
| display: flex; | ||
| justify-content: space-between; | ||
| width: 100%; | ||
| text-align: left; | ||
| padding: 3px 20px; | ||
| background: none; | ||
| border: none; | ||
| outline: none; | ||
| cursor: pointer; | ||
| white-space: nowrap; | ||
| line-height: inherit; | ||
| min-height: 25px; | ||
| small { | ||
| margin-left: 20px; | ||
| opacity: .8; | ||
| } | ||
| &-active { | ||
| background-color: $color-light; | ||
| } | ||
| &:hover { | ||
| color: #fff; | ||
| background-color: $color-primary; | ||
| } | ||
| } | ||
| } |
49824
-0.44%11
-8.33%156
-7.69%Updated