Merge branch 'master' of https://github.com/familytree365/nuxt

assets/css/pedigree-chart.css

@@ -0,0 +1,113 @@
+/* Form */
+
+#webtrees-pedigree-chart-form .row {
+    margin-left: 0;
+    margin-right: 0;
+}
+
+/* SVG */
+#webtrees-pedigree-chart-container {
+    position: relative;
+    font-size: unset;
+    display: flex;
+    flex: auto;
+}
+
+#webtrees-pedigree-chart-container svg {
+    display: block;
+    margin: auto;
+    cursor: move;
+    /*cursor: -webkit-grab;*/
+    /*cursor: -moz-grab;*/
+    cursor: grab;
+    /*-webkit-filter: drop-shadow(3px 1px 3px rgba(0, 0, 0, 0.4));*/
+    /*filter: drop-shadow(3px 1px 3px rgba(0, 0, 0, 0.4));*/
+}
+
+#webtrees-pedigree-chart-container svg:active {
+    cursor: grabbing;
+    /*cursor: -webkit-grabbing;*/
+}
+
+/*#webtrees-pedigree-chart-container .person a.gallery img,*/
+/*#webtrees-pedigree-chart-container .person a.gallery {*/
+/*    float: left;*/
+/*    height: 50px;*/
+/*    margin: 0 2px 0 0;*/
+/*    max-width: 80px;*/
+/*    width: auto;*/
+/*}*/
+
+#webtrees-pedigree-chart-container .rtl {
+    direction: rtl !important;
+    unicode-bidi: bidi-override !important;
+}
+
+#webtrees-pedigree-chart-container svg text {
+    font-weight: bold;
+}
+
+/* Unset any style from our transition helper classes */
+/*#webtrees-pedigree-chart-container svg .new,*/
+/*#webtrees-pedigree-chart-container svg .remove,*/
+/*#webtrees-pedigree-chart-container svg .update,*/
+/*#webtrees-pedigree-chart-container svg .old {*/
+/*    all: unset;*/
+/*}*/
+
+#webtrees-pedigree-chart-container svg .person {
+    cursor: pointer;
+}
+
+#webtrees-pedigree-chart-container svg .label {
+    font-weight: normal;
+}
+
+#webtrees-pedigree-chart-container svg .label .alternativeName {
+    fill: #7f7f7f;
+    font-weight: normal;
+    direction: ltr;
+    unicode-bidi: normal;
+}
+
+#webtrees-pedigree-chart-container svg .label .date {
+    fill: #7f7f7f;
+    font-weight: normal;
+    direction: ltr;
+    unicode-bidi: plaintext;
+}
+
+#webtrees-pedigree-chart-container svg rect.background {
+    fill: none;
+    pointer-events: all;
+}
+
+#webtrees-pedigree-chart-container div.overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    text-align: center;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font: 10px sans-serif;
+    background: rgba(0, 0, 0, 0.5);
+    pointer-events: none;
+    transition: opacity ease-in-out;
+    transition-duration: 0s;
+}
+
+#webtrees-pedigree-chart-container div.overlay .tooltip {
+    font-size: 22px;
+    color: white;
+    position: relative;
+    margin: 0;
+    top: 50%;
+    /*-webkit-transform: translateY(-50%);*/
+    /*-ms-transform: translateY(-50%);*/
+    transform: translateY(-50%);
+    opacity: 1;
+    text-align: center;
+}

assets/css/svg.css

@@ -0,0 +1,51 @@
+/* SVG export styles */
+#webtrees-pedigree-chart-container svg {
+    /* Native font stack: see https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/ */
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+
+    min-height: 600px;
+}
+
+#webtrees-pedigree-chart-container svg text {
+    font-weight: bold;
+}
+
+#webtrees-pedigree-chart-container svg rect.female {
+    stroke: rgb(255, 32, 128);
+    stroke-dasharray: none;
+    stroke-width: 3px;
+}
+
+#webtrees-pedigree-chart-container svg rect.male {
+    stroke: rgb(129, 169, 203);
+    stroke-dasharray: none;
+    stroke-width: 3px;
+}
+
+#webtrees-pedigree-chart-container svg rect.unknown {
+    stroke: rgb(175, 175, 175);
+    stroke-dasharray: 5;
+    stroke-width: 3px;
+}
+
+#webtrees-pedigree-chart-container svg rect.image {
+    stroke: rgb(175, 175, 175);
+}
+
+#webtrees-pedigree-chart-container svg path.link {
+    fill: none;
+    stroke: rgb(175, 175, 175);
+    stroke-width: 1.5px;
+}
+
+#webtrees-pedigree-chart-container svg g.name tspan.preferred {
+    text-decoration: underline;
+}
+
+#webtrees-pedigree-chart-container svg text.date {
+    fill: rgb(127, 127, 127);
+    font-weight: normal;
+    direction: ltr;
+    unicode-bidi: plaintext;
+    font-size: 13px;
+}