From 438d763b06910eed1b54a41d0340ae881d2daf0d Mon Sep 17 00:00:00 2001 From: Jonathan Wilkes <jon.w.wilkes@gmail.com> Date: Thu, 23 Jul 2015 23:12:38 -0400 Subject: [PATCH] added missing css files got a rudimentary hack for showing msg box while editing use outline instead of border for object box border --- pd/nw/css/default.css | 306 +++++++++++++++++++++++++++++++++++++++++ pd/nw/css/inverted.css | 3 + pd/nw/msg-box.svg | 12 ++ 3 files changed, 321 insertions(+) create mode 100644 pd/nw/css/default.css create mode 100644 pd/nw/css/inverted.css create mode 100644 pd/nw/msg-box.svg diff --git a/pd/nw/css/default.css b/pd/nw/css/default.css new file mode 100644 index 000000000..4fb585ac3 --- /dev/null +++ b/pd/nw/css/default.css @@ -0,0 +1,306 @@ +/* Global CSS */ + +@font-face { + font-family: "DejaVu Sans Mono"; + src: url("../DejaVuSansMono.ttf"); +} + +.noselect { + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +/* The main Pd Window */ + +#console_body { + margin: 0px; +} + +#console_controls { + background-color: LightGray; + height: 50px; +} + +#control_frame { + padding: 12px; +} + +#printout { + margin: 8px; +} + +#console_bottom { + position: absolute; + top: 50px; + left: 0px; + right: 0px; + bottom: 0px; + overflow-y: scroll; +} + +/* Pure Data Patch Window (aka canvas) */ + +#patch_body { + margin: 0px; + font-family: "DejaVu Sans Mono"; +} + +.cord.signal { + stroke-width: 2 +} + +.cord.control { + stroke-width: 1 +} + +#new_object_textentry { +/* left: 65px; */ +/* top: 4px; */ +/* max-width: 10ch; */ + min-width: 3ch; + position: absolute; + display: table-cell; + padding: 3px 2px 3px 2px; +/* outline: 0px solid transparent; */ +/* border: 1px solid red; */ +/* box-shadow: inset 1px 0px 0px 1px #000; */ + background-color: white; +/* opacity: 0.5; */ +/* font-family: Verdana; */ +/* font-size: 20px; */ + white-space: normal; + word-wrap: break-word; + -webkit-margin-before: 0px; +} + +#new_object_textentry.obj { + outline: 1px solid #000; +} + +#new_object_textentry.msg { + outline: 0px solid transparent; + box-shadow: inset 1px 0px 0px 1px #000; +} + +p.msg::after { + content: ""; + height: 100%; + width: 5px; + background-image: url(../msg-box.svg); + position: absolute; + top: 0%; + left: 100%; +} + +/* not sure what this is doing here... */ +text { + // fill: red; + cursor: default; +} + +/* not sure if this is still needed */ +.selected_border { + stroke: blue; + stroke-dasharray: none; + stroke-width: 1; +} + +/* a message when it flashes on a mouse-click */ +.msg.flashed .border { + stroke-width: 4; +} + +/* border color for selected objects + * an element with the class 'border' + * the element is contained within a parent element of class 'selected' + * that parent element is not in class 'gop' + in plain English: + This lets us highlight an objects border, unless it is inside a gop + canvas. +*/ +:not(.gop).selected .border { + stroke: blue; + display: inline; +} + +/* selected connection between objects */ +.selected_line { + stroke: blue; +} + +/* for an object that didn't create */ +.broken_border { + fill: #f7f7f7; + stroke: red; + stroke-dasharray: 3 2; +} + +/* control inlet */ +.xlet_control { + stroke: red; + fill: gray; +// stroke-width: 1; +} + +/* signal inlet */ +.xlet_signal { + stroke: green; + fill: green; + stroke-width: 1; +} + +/* iemgui inlet or outlet */ +.xlet_iemgui { + stroke: black; + fill: black; + stroke-width: 1; +} + +/* text label for an iemgui */ +.iemgui_label_selected { + fill: blue; +} + +/* test of xlet hover animation... this should + probably use the web animation API instead. That + way the animation won't get cut off when you + move off the object */ +@-webkit-keyframes fizzle { + 0% { + stroke-width: 1; + stroke-opacity: 1; + x: 0; + rx: 1; + ry: 1; + } + 100% { + stroke-width: 20; + stroke-opacity: 0.2; + x: 100; + rx: 50; + ry: 50; + } +} + +/* can't remember why this was tagged !important */ +.xlet_selected { + stroke: purple !important; + -webkit-animation: fizzle 0.5s linear 1; +} + +/* Common to all dialogs */ + +.submit_buttons { + text-align: center; + padding: 8px; +} + +fieldset { + font-family:Georgia; + background-color:#eeeeee; + border-radius:3px; + border:2px solid black; + margin-left:auto; + margin-right:auto; + padding: 10px; +} + +.hidden { + display: none; +} + +.container{ + display: none; +} + +/* Iemgui dialog */ + +#iemgui_dialog_body { + font-family:Verdana; + margin: 0px; +} + +input[type="text"]{ + width:3em; +} + +input[type="number"]{ + width:3em; +} + + +label { + text-align: right; +} + +/* Pair of properties that are related */ +.pair { + width: 75%; + text-align: left; + align: left; +} + +.item1 { + width: 50%; +} + +.item2 { + width: 50%; +} + +input[name="x-offset"] { + width: 2em; +} + +input[name="y-offset"] { + width: 2em; +} + +input[name="send-symbol"] { + width: 8em; +} + +input[name="receive-symbol"] { + width: 8em; +} + +input[name="label"] { + width: 8em; +} + +input[name="font-size"] { + width: 3em; +} + +/* Canvas dialog */ + +div.x-scale { + padding: 3px; + text-align: center; +} + +div.gop-range { +} + +div.y1 { + text-align: center; + padding: 3px; +} + +div.x1 { + text-align: center; + padding: 3px; +} + +div.y2 { + text-align: center; + padding: 3px; +} + +.disabled { + color: #aaa; +} diff --git a/pd/nw/css/inverted.css b/pd/nw/css/inverted.css new file mode 100644 index 000000000..7db3df1d7 --- /dev/null +++ b/pd/nw/css/inverted.css @@ -0,0 +1,3 @@ +body { + background-color: black; +} diff --git a/pd/nw/msg-box.svg b/pd/nw/msg-box.svg new file mode 100644 index 000000000..50c4d17ed --- /dev/null +++ b/pd/nw/msg-box.svg @@ -0,0 +1,12 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<svg + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + version="1.0" + viewBox="0 0 10 10" + preserveAspectRatio="none" +> + +<polyline vector-effect="non-scaling-stroke" fill="none" stroke="black" stroke-width="1" points="0 0 10 0 0 2 0 8 10 10 0 10"></polyline> +</svg> -- GitLab