aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/PropertiesButtons.scss
diff options
context:
space:
mode:
authorLionel Han <47760119+IGoByJoe@users.noreply.github.com>2020-08-08 18:03:31 -0700
committerLionel Han <47760119+IGoByJoe@users.noreply.github.com>2020-08-08 18:03:31 -0700
commit09a7f3711ccc0089b20c1bf9b58679e18b600081 (patch)
treed8c16d95c2ec94c0f8eae24a9869361f8cf9eebb /src/client/views/PropertiesButtons.scss
parent1032f8b421402371be4e4d62171bc837fdcb4368 (diff)
parent301b10ba693dc76ebcd42d3fa4020410f2092bee (diff)
Merge branch 'new_audio' of https://github.com/browngraphicslab/Dash-Web into new_audio
Diffstat (limited to 'src/client/views/PropertiesButtons.scss')
-rw-r--r--src/client/views/PropertiesButtons.scss141
1 files changed, 141 insertions, 0 deletions
diff --git a/src/client/views/PropertiesButtons.scss b/src/client/views/PropertiesButtons.scss
new file mode 100644
index 000000000..6199d34d0
--- /dev/null
+++ b/src/client/views/PropertiesButtons.scss
@@ -0,0 +1,141 @@
+@import "globalCssVariables";
+
+$linkGap : 3px;
+
+.propertiesButtons-linkFlyout {
+ grid-column: 2/4;
+}
+
+.propertiesButtons-linkButton-empty:hover {
+ background: $main-accent;
+ transform: scale(1.05);
+ cursor: pointer;
+}
+
+.propertiesButtons-linkButton-nonempty:hover {
+ background: $main-accent;
+ transform: scale(1.05);
+ cursor: pointer;
+}
+
+.propertiesButtons-linkButton-empty,
+.propertiesButtons-linkButton-nonempty {
+ height: 30px;
+ width: 32px;
+ border-radius: 6px;
+ pointer-events: auto;
+ background-color: #121721;
+ color: #fcfbf7;
+ text-transform: uppercase;
+ letter-spacing: 2px;
+ font-size: 75%;
+ transition: transform 0.2s;
+ text-align: center;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-right: 10px;
+ margin-left: 3.5px;
+
+ &:hover {
+ background: $main-accent;
+ transform: scale(1.05);
+ cursor: pointer;
+ }
+}
+
+.propertiesButtons {
+ margin-top: 3px;
+ grid-column: 1/4;
+ width: 100%;
+ height: auto;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+}
+
+.onClickFlyout-editScript {
+ text-align: center;
+ border: 0.5px solid grey;
+ background-color: rgb(230, 230, 230);
+ border-radius: 9px;
+ padding: 4px;
+}
+
+
+.propertiesButtons-button {
+ pointer-events: auto;
+ padding-right: 5px;
+ width: 25px;
+ border-radius: 5px;
+ margin-right: 22px;
+ margin-bottom: 8px;
+}
+
+.propertiesButtons-title {
+ background: #121721;
+ color: white;
+ font-size: 6px;
+ width: 40px;
+ padding: 3px;
+ height: 13px;
+ border-radius: 7px;
+ text-transform: uppercase;
+ text-align: center;
+ margin-top: -4px;
+}
+
+.propertiesButtons-linker {
+ height: 30px;
+ width: 32px;
+ text-align: center;
+ border-radius: 6px;
+ pointer-events: auto;
+ background-color: #121721;
+ color: #fcfbf7;
+ transition: 0.2s ease all;
+ margin-right: 5px;
+ padding-top: 5px;
+ margin-left: 3.5px;
+
+ &:hover {
+ background: $main-accent;
+ transform: scale(1.05);
+ cursor: pointer;
+ }
+}
+
+.propertiesButtons-linker:hover {
+ cursor: pointer;
+ transform: scale(1.05);
+}
+
+
+@-moz-keyframes spin {
+ 100% {
+ -moz-transform: rotate(360deg);
+ }
+}
+
+@-webkit-keyframes spin {
+ 100% {
+ -webkit-transform: rotate(360deg);
+ }
+}
+
+@keyframes spin {
+ 100% {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes shadow-pulse {
+ 0% {
+ box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.8);
+ }
+
+ 100% {
+ box-shadow: 0 0 0 10px rgba(0, 255, 0, 0);
+ }
+} \ No newline at end of file