Upstream sync

src/components/Shared/draggable-dialog/css/index.css

@@ -0,0 +1,167 @@
+body {
+    width: 100%;
+    min-height: 700px;
+}
+
+a {
+    cursor: pointer;
+    text-decoration: underline;
+}
+
+.ui-dialog-overlay {
+    background: #aaaaaa;
+    opacity: .3;
+    filter: Alpha(Opacity=30);
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 100;
+}
+
+.ui-dialog {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    outline: 0 none;
+    padding: 0 !important;;
+    z-index: 101;
+    background-color: white;
+    border: 1px solid #f6f6f6;
+}
+
+.ui-dialog.maximized{
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100% !important;
+    height: 100% !important;
+}
+
+.ui-dialog.minimized{
+    position: fixed;
+    bottom: 0;
+    right: 0;
+}
+
+.ui-dialog .ui-dialog-titlebar {
+    position: relative;
+    font-size: 1em;
+    border-radius: 3px;
+    padding: 0.5em;
+    height: 35px;
+    /*border-bottom: 1px solid #f6f6f6;*/
+}
+ 
+.ui-dialog.react-draggable .ui-dialog-titlebar{
+    cursor: move;
+}
+
+.ui-dialog.react-draggable .ui-dialog-content{
+    cursor: move;
+}
+
+.ui-dialog.react-draggable .ui-dialog-buttonpane {
+    cursor: move;
+}
+
+
+.ui-dialog .ui-dialog-titlebar .action-items {
+    float: right;
+    position: relative;
+}
+
+.ui-dialog .ui-dialog-titlebar .title {
+    float: left;
+    margin-right: .5em;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 1.3125em;
+    font-weight: 500;
+    line-height: 0.2em;
+    padding : 24px 0px 0px 19px;
+}
+
+.icon {
+    width: 24px;
+    height: 24px;
+    display: block;
+    float: left;
+    margin: 5px;
+    cursor: pointer;
+    background-size: cover;
+}
+
+.icon.icon-close {
+    width: 20px;
+    height: 20px;
+    background-image: url("./img/close.png");
+}
+
+.icon.icon-minimize {
+    background-image: url("./img/minimize.png");
+}
+
+.icon.icon-maximize {
+    background-image: url("./img/maximize.png");
+}
+
+.icon.icon-restore {
+    background-image: url("./img/restore.png");
+}
+
+.ui-dialog .ui-dialog-content {
+    background: none repeat scroll 0 0 transparent;
+    border: 0 none;
+    overflow: auto;
+    position: relative;
+    font-size: 1rem;
+    font-weight: 400;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    line-height: 1.5em;
+    color:rgba(0, 0, 0, 0.54);
+    padding : 24px 24px 24px 24px;
+}
+
+.ui-dialog .ui-dialog-buttonpane {
+    position: absolute;
+    width: 100%;
+    bottom: 0;
+    text-align: right;
+    border-width: 1px 0 0 0;
+    /*border-top: 1px solid #f6f6f6;*/
+}
+
+.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset{
+    padding: 0.5em;
+}
+
+.ui-dialog .ui-dialog-buttonpane button {
+	margin: 0 .5em 0 .5em;
+    cursor: pointer;
+    background-color: #f6f6f6;
+    padding: 0.5em 1em;
+    outline: none;
+    border: 1px solid #CCCCCC;
+    border-radius: 3px;
+}
+
+.ui-dialog .ui-dialog-buttonpane button:hover{
+    background-color: #CCCCCC;
+    border: 1px solid #BBBBBB;
+}
+
+.ui-dialog .react-resizable-handle {
+    position: absolute;
+    width: 20px;
+    height: 20px;
+    bottom: 0;
+    right: 0;
+    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+');
+    background-position: bottom right;
+    padding: 0 3px 3px 0;
+    background-repeat: no-repeat;
+    background-origin: content-box;
+    box-sizing: border-box;
+    cursor: se-resize;
+}