diff options
Diffstat (limited to 'app/javascript')
61 files changed, 4323 insertions, 46 deletions
diff --git a/app/javascript/fonts/premillenium/MSSansSerif.ttf b/app/javascript/fonts/premillenium/MSSansSerif.ttf new file mode 100644 index 000000000..3afd76ff2 --- /dev/null +++ b/app/javascript/fonts/premillenium/MSSansSerif.ttf Binary files differdiff --git a/app/javascript/images/alert_badge.png b/app/javascript/images/alert_badge.png new file mode 100644 index 000000000..681f6e651 --- /dev/null +++ b/app/javascript/images/alert_badge.png Binary files differdiff --git a/app/javascript/images/background-cybre-light.png b/app/javascript/images/background-cybre-light.png new file mode 100644 index 000000000..44d76c24c --- /dev/null +++ b/app/javascript/images/background-cybre-light.png Binary files differdiff --git a/app/javascript/images/background-cybre.png b/app/javascript/images/background-cybre.png new file mode 100644 index 000000000..151fd5584 --- /dev/null +++ b/app/javascript/images/background-cybre.png Binary files differdiff --git a/app/javascript/images/clippy_frame.png b/app/javascript/images/clippy_frame.png new file mode 100644 index 000000000..7f2cd6a59 --- /dev/null +++ b/app/javascript/images/clippy_frame.png Binary files differdiff --git a/app/javascript/images/clippy_wave.gif b/app/javascript/images/clippy_wave.gif new file mode 100644 index 000000000..4d2e38a3d --- /dev/null +++ b/app/javascript/images/clippy_wave.gif Binary files differdiff --git a/app/javascript/images/elephant-fren.png b/app/javascript/images/elephant-fren.png index 38b1e3cba..3b64edf08 100644 --- a/app/javascript/images/elephant-fren.png +++ b/app/javascript/images/elephant-fren.png Binary files differdiff --git a/app/javascript/images/floppy-1.svg b/app/javascript/images/floppy-1.svg new file mode 100644 index 000000000..08c1e4a6c --- /dev/null +++ b/app/javascript/images/floppy-1.svg @@ -0,0 +1,64 @@ +<svg xmlns="http://www.w3.org/2000/svg" width="384" version="1.1" height="384"> + <g transform="translate(-282.71845,-76)" id="RenderLayer_LineSet"> + <g id="strokes"> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path2" d="m 405.991,306.829 v 10 10 10 10 10 10 10 10 6.581 5.978 9.656 3.057" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path4" d="m 405.991,409.044 v 0 -9.656 -5.978 -10 -10 -10 -10 -10 -10 -10 -10 -6.581" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path6" d="m 370.692,127.899 v 1.329 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path8" d="m 439.906,283.073 v 0 h -10 -10 -10.303 -3.612 -10 -10 -10 -2.337 l -2.962,-2.901 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path10" d="m 373.654,283.073 -2.962,-2.901 v -10 -10 -10 -10 -10 -10 -1.283 -10 -10 -10 -10 -10 -9.658" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path12" d="m 370.692,127.899 h -7.383 -10 -2.899 -5.311 v 0 l -0.45,0.28 -0.37,0.387 -0.268,0.47 v 0.192 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 2.901 10 4.487 5.906 3.363 10 10 10 10 10 10 10 10 6.581 l 6.235,6.039 7.183,6.957 2.643,2.56 3.237,3.135 v 0 h 7.383 2.962 10 10 10 2.337 v 0 0 -3.057" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path14" d="m 584.095,303.466 3.074,3.363 v 10 10 10 10 10 10 10 10 6.581 6.183 9.988 10e-4 0.001 2.518 h 6.497 10 2.976 7.534 v 0 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path16" d="m 615.989,393.41 v -10 -10 -10 -10 -10 -10 -10 -10 -6.581 -3.363 -5.906 -10 -4.487 -2.901 -10 -10 -10 -10 -10 -10 -1.283 -10 -10 -10 -10 -10 -9.658 -2.701 -4.955 -10 -0.947 -10 -1.4 -0.061 l -0.299,-0.524 -0.394,-0.413 -0.019,-0.019 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path18" d="m 584.093,129.228 h -10 -10 -10 -10 l -10,-0.001 h -10 -5.476 -10 -10 -10 -10 -10 -10 l -10,-0.001 h -8.828 -10 -10 -10 -0.326 -3.615 l -10,0.001 h -10 l -10,0.001 h -2.205 -2.951 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path20" d="m 615.277,128.211 v 0 l -0.501,-0.312 v 0 0 h -8.134 -10 -2.976 -6.497 v 1.329" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path22" d="m 615.69,128.643 0.299,0.524 v 0.061 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 2.901 10 4.487 5.906 3.363 10 10 10 10 10 10 10 10 6.581 6.183 9.987 0.626 l -0.447,0.784 -0.617,0.644 -0.749,0.467" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path24" d="m 587.169,156.53 v 0 0 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 l -3.074,2.901 h -10 -10 -10 -10 -10 -10 -5.424" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path26" d="m 370.692,129.228 v -1.329 0 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path28" d="m 584.093,129.228 h 3.076" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path30" d="m 350.41,140.628 h 10 2.899 v 10 0.947 h -3.555 -9.344 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path32" d="m 587.169,129.228 v 10 1.4 10 0.947 4.955" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path34" d="m 350.41,151.575 v -10 -0.947" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path36" d="m 593.666,151.575 v -10 -0.947 0 h 10 2.976" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path38" d="m 606.642,140.628 v 10 0.947 h -10 -2.976 v 0 -10 -0.947" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path40" d="m 615.69,128.643 -0.394,-0.413 -0.019,-0.019 v 0 l -0.501,-0.312" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path42" d="m 615.989,393.41 v 6.183 9.987 0.626 l -0.447,0.783 -0.576,0.603 -0.041,0.042 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path44" d="m 614.925,411.634 v 0 l -0.749,0.467" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path46" d="m 615.69,128.643 -0.009,-0.01 -0.404,-0.422 -0.501,-0.312" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path48" d="m 614.176,412.101 0.749,-0.467 v 0 l 0.041,-0.042 0.576,-0.603 0.447,-0.783 v -0.626 -9.987 -6.183" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path50" d="m 406.223,306.613 -0.232,0.216 v 0 l 0.232,-0.216 3.38,-3.147 h 10 10 10.303 10 10 10 10 10 10 10 8.765 10 10 1.007" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path52" d="m 518.671,283.073 v 0 h -10 -2.247" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path54" d="m 615.277,128.211 0.404,0.422" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path56" d="m 383.445,273.927 h 10 10 10 10 10 6.461" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path58" d="m 576.555,273.927 2.03,-0.051 1.978,-0.302 1.707,-0.727" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path60" d="m 582.27,272.847 1.099,-1.131 0.456,-1.309 0.077,-1.342" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path62" d="m 583.902,269.065 v -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -9.834 0 -10 -7.959" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path64" d="m 583.902,141.272 -0.077,-1.344 -0.457,-1.309 -1.098,-1.13" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path66" d="m 582.27,137.489 -1.709,-0.727 -1.977,-0.301 -2.029,-0.051" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path68" d="m 576.555,136.41 h -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -3.11 l -2.03,0.051 -1.978,0.302 -1.707,0.726" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path70" d="m 377.73,137.489 -1.099,1.131 -0.456,1.309 -0.077,1.343" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path72" d="m 376.098,269.065 0.077,1.343 0.457,1.309 1.098,1.13" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path74" d="m 377.73,272.847 1.709,0.727 1.977,0.302 2.029,0.051" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path76" d="m 457.882,318.176 v 10 10 10 10 10 10 10 8.996 l -0.375,1.491 -0.542,1.03" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path78" d="m 456.965,399.693 h -10 -10 -8.726 l -0.542,-1.03 -0.375,-1.491" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path80" d="m 539.678,303.466 -0.064,-0.035 h -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10.198 l -1.889,1.029 -1.304,1.491" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path82" d="m 543.74,411.917 v -2.465 -0.024 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -2.742 l -1.686,-1.925 -2.376,-1.295" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path84" d="m 427.612,316.452 0.42,-0.797 h 10 10 8.933 l 0.542,1.03 0.375,1.491" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path86" d="m 427.322,317.607 0.29,-1.155" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path88" d="m 350.41,151.575 v -10 -0.947" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path90" d="m 370.692,127.899 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path92" d="m 376.098,141.272 v 10 7.954 0.005 10 10 10 10 10 10 10 10 10 10 9.834" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path94" d="m 405.991,409.044 v 3.057" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path96" d="m 406.223,305.951 v 0.662 0 0 0 10 10 10 10 10 10 10 10 10 10 2.333 0.098 2.873" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path98" d="m 427.322,397.172 v -10 -10 -10 -10 -10 -10 -10 -9.565" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path100" d="m 405.991,409.044 h 0.232" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path102" d="m 506.424,283.073 h -3.436 -10 -10 -10 -10 -6.548 -3.543 -10e-4 -10 -2.99" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path104" d="m 406.223,411.917 h 10 10 10 10 10 10 10 10 10 10 10 10 10 7.517" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path106" d="m 518.671,273.927 h 10 10 10 10 10 7.884" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path108" d="m 439.906,273.927 h 6.803 v 0 h 2.704 10 10 10 10 10 10.551 2.65 10e-4 6.056" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path110" d="m 539.678,303.466 h 10 10 10 10 4.417" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path112" d="m 587.169,156.53 v 0" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path114" d="m 543.74,409.452 10,0.029 10,0.03 10,0.03 9.999,0.029 3.43,0.01" /> + <path style="fill:none;stroke:#87B97D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path116" d="m 615.989,393.41 v -10 -10 -10 -10 -10 -10 -10 -10 -6.581" /> + </g> + </g> +</svg> diff --git a/app/javascript/images/floppy-2.svg b/app/javascript/images/floppy-2.svg new file mode 100644 index 000000000..d57a72a72 --- /dev/null +++ b/app/javascript/images/floppy-2.svg @@ -0,0 +1,64 @@ +<svg xmlns="http://www.w3.org/2000/svg" width="384" version="1.1" height="384"> + <g transform="translate(-282.71845,-76)" id="RenderLayer_LineSet"> + <g id="strokes"> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path2" d="m 405.991,306.829 v 10 10 10 10 10 10 10 10 6.581 5.978 9.656 3.057" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path4" d="m 405.991,409.044 v 0 -9.656 -5.978 -10 -10 -10 -10 -10 -10 -10 -10 -6.581" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path6" d="m 370.692,127.899 v 1.329 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path8" d="m 439.906,283.073 v 0 h -10 -10 -10.303 -3.612 -10 -10 -10 -2.337 l -2.962,-2.901 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path10" d="m 373.654,283.073 -2.962,-2.901 v -10 -10 -10 -10 -10 -10 -1.283 -10 -10 -10 -10 -10 -9.658" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path12" d="m 370.692,127.899 h -7.383 -10 -2.899 -5.311 v 0 l -0.45,0.28 -0.37,0.387 -0.268,0.47 v 0.192 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 2.901 10 4.487 5.906 3.363 10 10 10 10 10 10 10 10 6.581 l 6.235,6.039 7.183,6.957 2.643,2.56 3.237,3.135 v 0 h 7.383 2.962 10 10 10 2.337 v 0 0 -3.057" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path14" d="m 584.095,303.466 3.074,3.363 v 10 10 10 10 10 10 10 10 6.581 6.183 9.988 10e-4 0.001 2.518 h 6.497 10 2.976 7.534 v 0 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path16" d="m 615.989,393.41 v -10 -10 -10 -10 -10 -10 -10 -10 -6.581 -3.363 -5.906 -10 -4.487 -2.901 -10 -10 -10 -10 -10 -10 -1.283 -10 -10 -10 -10 -10 -9.658 -2.701 -4.955 -10 -0.947 -10 -1.4 -0.061 l -0.299,-0.524 -0.394,-0.413 -0.019,-0.019 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path18" d="m 584.093,129.228 h -10 -10 -10 -10 l -10,-0.001 h -10 -5.476 -10 -10 -10 -10 -10 -10 l -10,-0.001 h -8.828 -10 -10 -10 -0.326 -3.615 l -10,0.001 h -10 l -10,0.001 h -2.205 -2.951 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path20" d="m 615.277,128.211 v 0 l -0.501,-0.312 v 0 0 h -8.134 -10 -2.976 -6.497 v 1.329" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path22" d="m 615.69,128.643 0.299,0.524 v 0.061 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 2.901 10 4.487 5.906 3.363 10 10 10 10 10 10 10 10 6.581 6.183 9.987 0.626 l -0.447,0.784 -0.617,0.644 -0.749,0.467" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path24" d="m 587.169,156.53 v 0 0 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 l -3.074,2.901 h -10 -10 -10 -10 -10 -10 -5.424" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path26" d="m 370.692,129.228 v -1.329 0 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path28" d="m 584.093,129.228 h 3.076" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path30" d="m 350.41,140.628 h 10 2.899 v 10 0.947 h -3.555 -9.344 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path32" d="m 587.169,129.228 v 10 1.4 10 0.947 4.955" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path34" d="m 350.41,151.575 v -10 -0.947" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path36" d="m 593.666,151.575 v -10 -0.947 0 h 10 2.976" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path38" d="m 606.642,140.628 v 10 0.947 h -10 -2.976 v 0 -10 -0.947" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path40" d="m 615.69,128.643 -0.394,-0.413 -0.019,-0.019 v 0 l -0.501,-0.312" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path42" d="m 615.989,393.41 v 6.183 9.987 0.626 l -0.447,0.783 -0.576,0.603 -0.041,0.042 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path44" d="m 614.925,411.634 v 0 l -0.749,0.467" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path46" d="m 615.69,128.643 -0.009,-0.01 -0.404,-0.422 -0.501,-0.312" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path48" d="m 614.176,412.101 0.749,-0.467 v 0 l 0.041,-0.042 0.576,-0.603 0.447,-0.783 v -0.626 -9.987 -6.183" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path50" d="m 406.223,306.613 -0.232,0.216 v 0 l 0.232,-0.216 3.38,-3.147 h 10 10 10.303 10 10 10 10 10 10 10 8.765 10 10 1.007" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path52" d="m 518.671,283.073 v 0 h -10 -2.247" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path54" d="m 615.277,128.211 0.404,0.422" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path56" d="m 383.445,273.927 h 10 10 10 10 10 6.461" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path58" d="m 576.555,273.927 2.03,-0.051 1.978,-0.302 1.707,-0.727" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path60" d="m 582.27,272.847 1.099,-1.131 0.456,-1.309 0.077,-1.342" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path62" d="m 583.902,269.065 v -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -9.834 0 -10 -7.959" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path64" d="m 583.902,141.272 -0.077,-1.344 -0.457,-1.309 -1.098,-1.13" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path66" d="m 582.27,137.489 -1.709,-0.727 -1.977,-0.301 -2.029,-0.051" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path68" d="m 576.555,136.41 h -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -3.11 l -2.03,0.051 -1.978,0.302 -1.707,0.726" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path70" d="m 377.73,137.489 -1.099,1.131 -0.456,1.309 -0.077,1.343" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path72" d="m 376.098,269.065 0.077,1.343 0.457,1.309 1.098,1.13" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path74" d="m 377.73,272.847 1.709,0.727 1.977,0.302 2.029,0.051" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path76" d="m 457.882,318.176 v 10 10 10 10 10 10 10 8.996 l -0.375,1.491 -0.542,1.03" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path78" d="m 456.965,399.693 h -10 -10 -8.726 l -0.542,-1.03 -0.375,-1.491" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path80" d="m 539.678,303.466 -0.064,-0.035 h -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10.198 l -1.889,1.029 -1.304,1.491" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path82" d="m 543.74,411.917 v -2.465 -0.024 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -2.742 l -1.686,-1.925 -2.376,-1.295" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path84" d="m 427.612,316.452 0.42,-0.797 h 10 10 8.933 l 0.542,1.03 0.375,1.491" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path86" d="m 427.322,317.607 0.29,-1.155" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path88" d="m 350.41,151.575 v -10 -0.947" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path90" d="m 370.692,127.899 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path92" d="m 376.098,141.272 v 10 7.954 0.005 10 10 10 10 10 10 10 10 10 10 9.834" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path94" d="m 405.991,409.044 v 3.057" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path96" d="m 406.223,305.951 v 0.662 0 0 0 10 10 10 10 10 10 10 10 10 10 2.333 0.098 2.873" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path98" d="m 427.322,397.172 v -10 -10 -10 -10 -10 -10 -10 -9.565" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path100" d="m 405.991,409.044 h 0.232" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path102" d="m 506.424,283.073 h -3.436 -10 -10 -10 -10 -6.548 -3.543 -10e-4 -10 -2.99" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path104" d="m 406.223,411.917 h 10 10 10 10 10 10 10 10 10 10 10 10 10 7.517" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path106" d="m 518.671,273.927 h 10 10 10 10 10 7.884" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path108" d="m 439.906,273.927 h 6.803 v 0 h 2.704 10 10 10 10 10 10.551 2.65 10e-4 6.056" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path110" d="m 539.678,303.466 h 10 10 10 10 4.417" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path112" d="m 587.169,156.53 v 0" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path114" d="m 543.74,409.452 10,0.029 10,0.03 10,0.03 9.999,0.029 3.43,0.01" /> + <path style="fill:none;stroke:#A9713D;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path116" d="m 615.989,393.41 v -10 -10 -10 -10 -10 -10 -10 -10 -6.581" /> + </g> + </g> +</svg> diff --git a/app/javascript/images/floppy-3.svg b/app/javascript/images/floppy-3.svg new file mode 100644 index 000000000..2fe8ef399 --- /dev/null +++ b/app/javascript/images/floppy-3.svg @@ -0,0 +1,64 @@ +<svg xmlns="http://www.w3.org/2000/svg" width="384" version="1.1" height="384"> + <g transform="translate(-282.71845,-76)" id="RenderLayer_LineSet"> + <g id="strokes"> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path2" d="m 405.991,306.829 v 10 10 10 10 10 10 10 10 6.581 5.978 9.656 3.057" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path4" d="m 405.991,409.044 v 0 -9.656 -5.978 -10 -10 -10 -10 -10 -10 -10 -10 -6.581" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path6" d="m 370.692,127.899 v 1.329 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path8" d="m 439.906,283.073 v 0 h -10 -10 -10.303 -3.612 -10 -10 -10 -2.337 l -2.962,-2.901 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path10" d="m 373.654,283.073 -2.962,-2.901 v -10 -10 -10 -10 -10 -10 -1.283 -10 -10 -10 -10 -10 -9.658" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path12" d="m 370.692,127.899 h -7.383 -10 -2.899 -5.311 v 0 l -0.45,0.28 -0.37,0.387 -0.268,0.47 v 0.192 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 2.901 10 4.487 5.906 3.363 10 10 10 10 10 10 10 10 6.581 l 6.235,6.039 7.183,6.957 2.643,2.56 3.237,3.135 v 0 h 7.383 2.962 10 10 10 2.337 v 0 0 -3.057" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path14" d="m 584.095,303.466 3.074,3.363 v 10 10 10 10 10 10 10 10 6.581 6.183 9.988 10e-4 0.001 2.518 h 6.497 10 2.976 7.534 v 0 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path16" d="m 615.989,393.41 v -10 -10 -10 -10 -10 -10 -10 -10 -6.581 -3.363 -5.906 -10 -4.487 -2.901 -10 -10 -10 -10 -10 -10 -1.283 -10 -10 -10 -10 -10 -9.658 -2.701 -4.955 -10 -0.947 -10 -1.4 -0.061 l -0.299,-0.524 -0.394,-0.413 -0.019,-0.019 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path18" d="m 584.093,129.228 h -10 -10 -10 -10 l -10,-0.001 h -10 -5.476 -10 -10 -10 -10 -10 -10 l -10,-0.001 h -8.828 -10 -10 -10 -0.326 -3.615 l -10,0.001 h -10 l -10,0.001 h -2.205 -2.951 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path20" d="m 615.277,128.211 v 0 l -0.501,-0.312 v 0 0 h -8.134 -10 -2.976 -6.497 v 1.329" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path22" d="m 615.69,128.643 0.299,0.524 v 0.061 10 1.4 10 0.947 4.955 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 2.901 10 4.487 5.906 3.363 10 10 10 10 10 10 10 10 6.581 6.183 9.987 0.626 l -0.447,0.784 -0.617,0.644 -0.749,0.467" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path24" d="m 587.169,156.53 v 0 0 2.701 10 10 10 10 10 9.658 10 10 10 10 10 10 1.283 l -3.074,2.901 h -10 -10 -10 -10 -10 -10 -5.424" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path26" d="m 370.692,129.228 v -1.329 0 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path28" d="m 584.093,129.228 h 3.076" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path30" d="m 350.41,140.628 h 10 2.899 v 10 0.947 h -3.555 -9.344 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path32" d="m 587.169,129.228 v 10 1.4 10 0.947 4.955" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path34" d="m 350.41,151.575 v -10 -0.947" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path36" d="m 593.666,151.575 v -10 -0.947 0 h 10 2.976" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path38" d="m 606.642,140.628 v 10 0.947 h -10 -2.976 v 0 -10 -0.947" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path40" d="m 615.69,128.643 -0.394,-0.413 -0.019,-0.019 v 0 l -0.501,-0.312" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path42" d="m 615.989,393.41 v 6.183 9.987 0.626 l -0.447,0.783 -0.576,0.603 -0.041,0.042 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path44" d="m 614.925,411.634 v 0 l -0.749,0.467" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path46" d="m 615.69,128.643 -0.009,-0.01 -0.404,-0.422 -0.501,-0.312" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path48" d="m 614.176,412.101 0.749,-0.467 v 0 l 0.041,-0.042 0.576,-0.603 0.447,-0.783 v -0.626 -9.987 -6.183" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path50" d="m 406.223,306.613 -0.232,0.216 v 0 l 0.232,-0.216 3.38,-3.147 h 10 10 10.303 10 10 10 10 10 10 10 8.765 10 10 1.007" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path52" d="m 518.671,283.073 v 0 h -10 -2.247" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path54" d="m 615.277,128.211 0.404,0.422" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path56" d="m 383.445,273.927 h 10 10 10 10 10 6.461" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path58" d="m 576.555,273.927 2.03,-0.051 1.978,-0.302 1.707,-0.727" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path60" d="m 582.27,272.847 1.099,-1.131 0.456,-1.309 0.077,-1.342" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path62" d="m 583.902,269.065 v -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -9.834 0 -10 -7.959" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path64" d="m 583.902,141.272 -0.077,-1.344 -0.457,-1.309 -1.098,-1.13" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path66" d="m 582.27,137.489 -1.709,-0.727 -1.977,-0.301 -2.029,-0.051" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path68" d="m 576.555,136.41 h -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -3.11 l -2.03,0.051 -1.978,0.302 -1.707,0.726" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path70" d="m 377.73,137.489 -1.099,1.131 -0.456,1.309 -0.077,1.343" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path72" d="m 376.098,269.065 0.077,1.343 0.457,1.309 1.098,1.13" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path74" d="m 377.73,272.847 1.709,0.727 1.977,0.302 2.029,0.051" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path76" d="m 457.882,318.176 v 10 10 10 10 10 10 10 8.996 l -0.375,1.491 -0.542,1.03" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path78" d="m 456.965,399.693 h -10 -10 -8.726 l -0.542,-1.03 -0.375,-1.491" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path80" d="m 539.678,303.466 -0.064,-0.035 h -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10.198 l -1.889,1.029 -1.304,1.491" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path82" d="m 543.74,411.917 v -2.465 -0.024 -10 -10 -10 -10 -10 -10 -10 -10 -10 -10 -2.742 l -1.686,-1.925 -2.376,-1.295" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path84" d="m 427.612,316.452 0.42,-0.797 h 10 10 8.933 l 0.542,1.03 0.375,1.491" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path86" d="m 427.322,317.607 0.29,-1.155" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path88" d="m 350.41,151.575 v -10 -0.947" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path90" d="m 370.692,127.899 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path92" d="m 376.098,141.272 v 10 7.954 0.005 10 10 10 10 10 10 10 10 10 10 9.834" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path94" d="m 405.991,409.044 v 3.057" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path96" d="m 406.223,305.951 v 0.662 0 0 0 10 10 10 10 10 10 10 10 10 10 2.333 0.098 2.873" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path98" d="m 427.322,397.172 v -10 -10 -10 -10 -10 -10 -10 -9.565" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path100" d="m 405.991,409.044 h 0.232" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path102" d="m 506.424,283.073 h -3.436 -10 -10 -10 -10 -6.548 -3.543 -10e-4 -10 -2.99" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path104" d="m 406.223,411.917 h 10 10 10 10 10 10 10 10 10 10 10 10 10 7.517" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path106" d="m 518.671,273.927 h 10 10 10 10 10 7.884" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path108" d="m 439.906,273.927 h 6.803 v 0 h 2.704 10 10 10 10 10 10.551 2.65 10e-4 6.056" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path110" d="m 539.678,303.466 h 10 10 10 10 4.417" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path112" d="m 587.169,156.53 v 0" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path114" d="m 543.74,409.452 10,0.029 10,0.03 10,0.03 9.999,0.029 3.43,0.01" /> + <path style="fill:none;stroke:#CB7590;stroke-width:3;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1" id="path116" d="m 615.989,393.41 v -10 -10 -10 -10 -10 -10 -10 -10 -6.581" /> + </g> + </g> +</svg> diff --git a/app/javascript/images/header-cybre-alt.jpg b/app/javascript/images/header-cybre-alt.jpg new file mode 100644 index 000000000..4d2b6b3a8 --- /dev/null +++ b/app/javascript/images/header-cybre-alt.jpg Binary files differdiff --git a/app/javascript/images/header-cybre-colour.jpg b/app/javascript/images/header-cybre-colour.jpg new file mode 100644 index 000000000..2d1b5b4f0 --- /dev/null +++ b/app/javascript/images/header-cybre-colour.jpg Binary files differdiff --git a/app/javascript/images/header-cybre.jpeg b/app/javascript/images/header-cybre.jpeg new file mode 100644 index 000000000..e9d7b336f --- /dev/null +++ b/app/javascript/images/header-cybre.jpeg Binary files differdiff --git a/app/javascript/images/icon_about.png b/app/javascript/images/icon_about.png new file mode 100644 index 000000000..08b76dcd9 --- /dev/null +++ b/app/javascript/images/icon_about.png Binary files differdiff --git a/app/javascript/images/icon_blocks.png b/app/javascript/images/icon_blocks.png new file mode 100644 index 000000000..8b1490875 --- /dev/null +++ b/app/javascript/images/icon_blocks.png Binary files differdiff --git a/app/javascript/images/icon_bookmarks.png b/app/javascript/images/icon_bookmarks.png new file mode 100644 index 000000000..b0cff1344 --- /dev/null +++ b/app/javascript/images/icon_bookmarks.png Binary files differdiff --git a/app/javascript/images/icon_developers.png b/app/javascript/images/icon_developers.png new file mode 100644 index 000000000..c6d2e1829 --- /dev/null +++ b/app/javascript/images/icon_developers.png Binary files differdiff --git a/app/javascript/images/icon_direct.png b/app/javascript/images/icon_direct.png new file mode 100644 index 000000000..71e898a98 --- /dev/null +++ b/app/javascript/images/icon_direct.png Binary files differdiff --git a/app/javascript/images/icon_docs.png b/app/javascript/images/icon_docs.png new file mode 100644 index 000000000..6af1c8268 --- /dev/null +++ b/app/javascript/images/icon_docs.png Binary files differdiff --git a/app/javascript/images/icon_domain_blocks.png b/app/javascript/images/icon_domain_blocks.png new file mode 100644 index 000000000..ed3750485 --- /dev/null +++ b/app/javascript/images/icon_domain_blocks.png Binary files differdiff --git a/app/javascript/images/icon_follow_requests.png b/app/javascript/images/icon_follow_requests.png new file mode 100644 index 000000000..4123e2a69 --- /dev/null +++ b/app/javascript/images/icon_follow_requests.png Binary files differdiff --git a/app/javascript/images/icon_home.png b/app/javascript/images/icon_home.png new file mode 100644 index 000000000..66ce779c0 --- /dev/null +++ b/app/javascript/images/icon_home.png Binary files differdiff --git a/app/javascript/images/icon_invite.png b/app/javascript/images/icon_invite.png new file mode 100644 index 000000000..21156ec96 --- /dev/null +++ b/app/javascript/images/icon_invite.png Binary files differdiff --git a/app/javascript/images/icon_keyboard_shortcuts.png b/app/javascript/images/icon_keyboard_shortcuts.png new file mode 100644 index 000000000..d66f3939e --- /dev/null +++ b/app/javascript/images/icon_keyboard_shortcuts.png Binary files differdiff --git a/app/javascript/images/icon_likes.png b/app/javascript/images/icon_likes.png new file mode 100644 index 000000000..17d7a9c59 --- /dev/null +++ b/app/javascript/images/icon_likes.png Binary files differdiff --git a/app/javascript/images/icon_lists.png b/app/javascript/images/icon_lists.png new file mode 100644 index 000000000..3828946e8 --- /dev/null +++ b/app/javascript/images/icon_lists.png Binary files differdiff --git a/app/javascript/images/icon_local.png b/app/javascript/images/icon_local.png new file mode 100644 index 000000000..5f82df395 --- /dev/null +++ b/app/javascript/images/icon_local.png Binary files differdiff --git a/app/javascript/images/icon_logout.png b/app/javascript/images/icon_logout.png new file mode 100644 index 000000000..7ff806f58 --- /dev/null +++ b/app/javascript/images/icon_logout.png Binary files differdiff --git a/app/javascript/images/icon_mobile_apps.png b/app/javascript/images/icon_mobile_apps.png new file mode 100644 index 000000000..a7cbd78c1 --- /dev/null +++ b/app/javascript/images/icon_mobile_apps.png Binary files differdiff --git a/app/javascript/images/icon_mutes.png b/app/javascript/images/icon_mutes.png new file mode 100644 index 000000000..c2225e966 --- /dev/null +++ b/app/javascript/images/icon_mutes.png Binary files differdiff --git a/app/javascript/images/icon_notifications.png b/app/javascript/images/icon_notifications.png new file mode 100644 index 000000000..0aaf5e68d --- /dev/null +++ b/app/javascript/images/icon_notifications.png Binary files differdiff --git a/app/javascript/images/icon_pin.png b/app/javascript/images/icon_pin.png new file mode 100644 index 000000000..2329d8c54 --- /dev/null +++ b/app/javascript/images/icon_pin.png Binary files differdiff --git a/app/javascript/images/icon_profile_directory.png b/app/javascript/images/icon_profile_directory.png new file mode 100644 index 000000000..05a94213a --- /dev/null +++ b/app/javascript/images/icon_profile_directory.png Binary files differdiff --git a/app/javascript/images/icon_public.png b/app/javascript/images/icon_public.png new file mode 100644 index 000000000..3c09460db --- /dev/null +++ b/app/javascript/images/icon_public.png Binary files differdiff --git a/app/javascript/images/icon_security.png b/app/javascript/images/icon_security.png new file mode 100644 index 000000000..ccdbfaf78 --- /dev/null +++ b/app/javascript/images/icon_security.png Binary files differdiff --git a/app/javascript/images/icon_settings.png b/app/javascript/images/icon_settings.png new file mode 100644 index 000000000..07f5c4519 --- /dev/null +++ b/app/javascript/images/icon_settings.png Binary files differdiff --git a/app/javascript/images/icon_tos.png b/app/javascript/images/icon_tos.png new file mode 100644 index 000000000..d0dbb13f7 --- /dev/null +++ b/app/javascript/images/icon_tos.png Binary files differdiff --git a/app/javascript/images/logo-cybre-light.png b/app/javascript/images/logo-cybre-light.png new file mode 100644 index 000000000..91908f6d3 --- /dev/null +++ b/app/javascript/images/logo-cybre-light.png Binary files differdiff --git a/app/javascript/images/logo-cybre.png b/app/javascript/images/logo-cybre.png new file mode 100644 index 000000000..41dd8fd4c --- /dev/null +++ b/app/javascript/images/logo-cybre.png Binary files differdiff --git a/app/javascript/images/start.png b/app/javascript/images/start.png new file mode 100644 index 000000000..7843455b6 --- /dev/null +++ b/app/javascript/images/start.png Binary files differdiff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js index 66b5a17ac..999507072 100644 --- a/app/javascript/mastodon/components/status_action_bar.js +++ b/app/javascript/mastodon/components/status_action_bar.js @@ -319,10 +319,9 @@ class StatusActionBar extends ImmutablePureComponent { return ( <div className='status__action-bar'> - <IconButton className='status__action-bar-button' title={replyTitle} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} counter={status.get('replies_count')} obfuscateCount /> + <IconButton className='status__action-bar-button' title={replyTitle} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} /> <IconButton className={classNames('status__action-bar-button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} pressed={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} /> - <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} pressed={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /> - + <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} pressed={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='floppy-o' onClick={this.handleFavouriteClick} /> {shareButton} <div className='status__action-bar-dropdown'> diff --git a/app/javascript/mastodon/components/status_content.js b/app/javascript/mastodon/components/status_content.js index 185a2a663..8e4cf0e53 100644 --- a/app/javascript/mastodon/components/status_content.js +++ b/app/javascript/mastodon/components/status_content.js @@ -193,6 +193,7 @@ export default class StatusContent extends React.PureComponent { const showThreadButton = ( <button className='status__content__read-more-button' onClick={this.props.onClick}> + <i className='fa fa-fw fa-sort-amount-desc status__prepend-icon' /> <FormattedMessage id='status.show_thread' defaultMessage='Show thread' /> </button> ); diff --git a/app/javascript/mastodon/containers/timeline_container.js b/app/javascript/mastodon/containers/timeline_container.js index ed8095f90..8de2379b7 100644 --- a/app/javascript/mastodon/containers/timeline_container.js +++ b/app/javascript/mastodon/containers/timeline_container.js @@ -7,6 +7,7 @@ import { hydrateStore } from '../actions/store'; import { IntlProvider, addLocaleData } from 'react-intl'; import { getLocale } from '../locales'; import PublicTimeline from '../features/standalone/public_timeline'; +import CommunityTimeline from '../features/standalone/community_timeline'; import HashtagTimeline from '../features/standalone/hashtag_timeline'; import ModalContainer from '../features/ui/containers/modal_container'; import initialState from '../initial_state'; @@ -25,22 +26,24 @@ export default class TimelineContainer extends React.PureComponent { static propTypes = { locale: PropTypes.string.isRequired, hashtag: PropTypes.string, - local: PropTypes.bool, + showPublicTimeline: PropTypes.bool.isRequired, }; static defaultProps = { - local: !initialState.settings.known_fediverse, + showPublicTimeline: initialState.settings.known_fediverse, }; render () { - const { locale, hashtag, local } = this.props; + const { locale, hashtag, showPublicTimeline } = this.props; let timeline; if (hashtag) { timeline = <HashtagTimeline hashtag={hashtag} local={local} />; + } else if (showPublicTimeline) { + timeline = <PublicTimeline />; } else { - timeline = <PublicTimeline local={local} />; + timeline = <CommunityTimeline />; } return ( @@ -48,7 +51,6 @@ export default class TimelineContainer extends React.PureComponent { <Provider store={store}> <Fragment> {timeline} - {ReactDOM.createPortal( <ModalContainer />, document.getElementById('modal-container'), diff --git a/app/javascript/mastodon/features/compose/components/compose_form.js b/app/javascript/mastodon/features/compose/components/compose_form.js index 8af806ec4..137a30506 100644 --- a/app/javascript/mastodon/features/compose/components/compose_form.js +++ b/app/javascript/mastodon/features/compose/components/compose_form.js @@ -96,7 +96,15 @@ class ComposeForm extends ImmutablePureComponent { this.props.onChange(this.autosuggestTextarea.textarea.value); } +<<<<<<< HEAD if (!this.canSubmit()) { +======= + // Submit disabled: + const { isSubmitting, isChangingUpload, isUploading, anyMedia } = this.props; + const fulltext = [this.props.spoilerText, countableText(this.props.text)].join(''); + + if (isSubmitting || isUploading || isChangingUpload || length(fulltext) > 1024 || (fulltext.length !== 0 && fulltext.trim().length === 0 && !anyMedia)) { +>>>>>>> Feature: 1024-character posts in server and client return; } @@ -188,6 +196,11 @@ class ComposeForm extends ImmutablePureComponent { render () { const { intl, onPaste, showSearch } = this.props; const disabled = this.props.isSubmitting; +<<<<<<< HEAD +======= + const text = [this.props.spoilerText, countableText(this.props.text)].join(''); + const disabledButton = disabled || this.props.isUploading || this.props.isChangingUpload || length(text) > 1024 || (text.length !== 0 && text.trim().length === 0 && !anyMedia); +>>>>>>> Feature: 1024-character posts in server and client let publishText = ''; if (this.props.privacy === 'private' || this.props.privacy === 'direct') { @@ -249,7 +262,7 @@ class ComposeForm extends ImmutablePureComponent { <PrivacyDropdownContainer /> <SpoilerButtonContainer /> </div> - <div className='character-counter__wrapper'><CharacterCounter max={500} text={this.getFulltextForCharacterCounting()} /></div> + <div className='character-counter__wrapper'><CharacterCounter max={1024} text={this.getFulltextForCharacterCounting()} /></div> </div> <div className='compose-form__publish'> diff --git a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js index dc4f48060..c99825895 100644 --- a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js +++ b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js @@ -361,8 +361,8 @@ class EmojiPickerDropdown extends React.PureComponent { <div ref={this.setTargetRef} className='emoji-button' title={title} aria-label={title} aria-expanded={active} role='button' onClick={this.onToggle} onKeyDown={this.onToggle} tabIndex={0}> {button || <img className={classNames('emojione', { 'pulse-loading': active && loading })} - alt='🙂' - src={`${assetHost}/emoji/1f602.svg`} + alt='🤔' + src={`${assetHost}/emoji/1f914.svg`} />} </div> diff --git a/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js b/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js index 5ec937a39..4c1332153 100644 --- a/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js +++ b/app/javascript/mastodon/features/compose/containers/emoji_picker_dropdown_container.js @@ -12,13 +12,13 @@ const DEFAULTS = [ '+1', 'grinning', 'kissing_heart', - 'heart_eyes', + 'vhs', 'laughing', - 'stuck_out_tongue_winking_eye', + 'floppy_disk', 'sweat_smile', 'joy', 'yum', - 'disappointed', + 'computer', 'thinking_face', 'weary', 'sob', diff --git a/app/javascript/mastodon/features/getting_started/index.js b/app/javascript/mastodon/features/getting_started/index.js index 1b9994612..a60c69418 100644 --- a/app/javascript/mastodon/features/getting_started/index.js +++ b/app/javascript/mastodon/features/getting_started/index.js @@ -16,21 +16,21 @@ import LinkFooter from 'mastodon/features/ui/components/link_footer'; import TrendsContainer from './containers/trends_container'; const messages = defineMessages({ - home_timeline: { id: 'tabs_bar.home', defaultMessage: 'Home' }, - notifications: { id: 'tabs_bar.notifications', defaultMessage: 'Notifications' }, - public_timeline: { id: 'navigation_bar.public_timeline', defaultMessage: 'Federated timeline' }, + home_timeline: { id: 'tabs_bar.home', defaultMessage: '/timelines/home' }, + notifications: { id: 'tabs_bar.notifications', defaultMessage: '~/.notifications' }, + public_timeline: { id: 'navigation_bar.public_timeline', defaultMessage: '/timelines/federated' }, settings_subheading: { id: 'column_subheading.settings', defaultMessage: 'Settings' }, - community_timeline: { id: 'navigation_bar.community_timeline', defaultMessage: 'Local timeline' }, - direct: { id: 'navigation_bar.direct', defaultMessage: 'Direct messages' }, - bookmarks: { id: 'navigation_bar.bookmarks', defaultMessage: 'Bookmarks' }, - preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' }, - follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' }, - favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' }, - blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' }, - domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Hidden domains' }, - mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' }, - pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned toots' }, - lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' }, + community_timeline: { id: 'navigation_bar.community_timeline', defaultMessage: '/timelines/local' }, + direct: { id: 'navigation_bar.direct', defaultMessage: '~/.dms' }, + bookmarks: { id: 'navigation_bar.bookmarks', defaultMessage: '~/.bookmarks' }, + preferences: { id: 'navigation_bar.preferences', defaultMessage: 'edit ~/.config' }, + follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: '~/.follow-requests' }, + favourites: { id: 'navigation_bar.favourites', defaultMessage: '~/.florps' }, + blocks: { id: 'navigation_bar.blocks', defaultMessage: '~/.blocked' }, + domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: '~/.muted/domains' }, + mutes: { id: 'navigation_bar.mutes', defaultMessage: '~/.muted' }, + pins: { id: 'navigation_bar.pins', defaultMessage: '~/.pinned' }, + lists: { id: 'navigation_bar.lists', defaultMessage: '~/.lists' }, discover: { id: 'navigation_bar.discover', defaultMessage: 'Discover' }, personal: { id: 'navigation_bar.personal', defaultMessage: 'Personal' }, security: { id: 'navigation_bar.security', defaultMessage: 'Security' }, diff --git a/app/javascript/mastodon/features/notifications/components/notification.js b/app/javascript/mastodon/features/notifications/components/notification.js index 94fdbd6f4..7c5da8785 100644 --- a/app/javascript/mastodon/features/notifications/components/notification.js +++ b/app/javascript/mastodon/features/notifications/components/notification.js @@ -185,7 +185,7 @@ class Notification extends ImmutablePureComponent { <div className={classNames('notification notification-favourite focusable', { unread })} tabIndex='0' aria-label={notificationForScreenReader(intl, intl.formatMessage(messages.favourite, { name: notification.getIn(['account', 'acct']) }), notification.get('created_at'))}> <div className='notification__message'> <div className='notification__favourite-icon-wrapper'> - <Icon id='star' className='star-icon' fixedWidth /> + <Icon id='floppy-o' className='star-icon' fixedWidth /> </div> <span title={notification.get('created_at')}> diff --git a/app/javascript/mastodon/features/standalone/community_timeline/index.js b/app/javascript/mastodon/features/standalone/community_timeline/index.js new file mode 100644 index 000000000..f917f41c9 --- /dev/null +++ b/app/javascript/mastodon/features/standalone/community_timeline/index.js @@ -0,0 +1,71 @@ +import React from 'react'; +import { connect } from 'react-redux'; +import PropTypes from 'prop-types'; +import StatusListContainer from '../../ui/containers/status_list_container'; +import { expandCommunityTimeline } from '../../../actions/timelines'; +import Column from '../../../components/column'; +import ColumnHeader from '../../../components/column_header'; +import { defineMessages, injectIntl } from 'react-intl'; +import { connectCommunityStream } from '../../../actions/streaming'; + +const messages = defineMessages({ + title: { id: 'standalone.public_title', defaultMessage: 'A look inside...' }, +}); + +export default @connect() +@injectIntl +class CommunityTimeline extends React.PureComponent { + + static propTypes = { + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + }; + + handleHeaderClick = () => { + this.column.scrollTop(); + } + + setRef = c => { + this.column = c; + } + + componentDidMount () { + const { dispatch } = this.props; + + dispatch(expandCommunityTimeline()); + this.disconnect = dispatch(connectCommunityStream()); + } + + componentWillUnmount () { + if (this.disconnect) { + this.disconnect(); + this.disconnect = null; + } + } + + handleLoadMore = maxId => { + this.props.dispatch(expandCommunityTimeline({ maxId })); + } + + render () { + const { intl } = this.props; + + return ( + <Column ref={this.setRef} label={intl.formatMessage(messages.title)}> + <ColumnHeader + icon='users' + title={intl.formatMessage(messages.title)} + onClick={this.handleHeaderClick} + /> + + <StatusListContainer + timelineId='community' + onLoadMore={this.handleLoadMore} + scrollKey='standalone_public_timeline' + trackScroll={false} + /> + </Column> + ); + } + +} diff --git a/app/javascript/mastodon/features/status/components/action_bar.js b/app/javascript/mastodon/features/status/components/action_bar.js index d7d504bc5..5c25e5363 100644 --- a/app/javascript/mastodon/features/status/components/action_bar.js +++ b/app/javascript/mastodon/features/status/components/action_bar.js @@ -275,7 +275,7 @@ class ActionBar extends React.PureComponent { <div className='detailed-status__action-bar'> <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.reply)} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} /></div> <div className='detailed-status__button' ><IconButton className={classNames({ reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} /></div> - <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /></div> + <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='floppy-o' onClick={this.handleFavouriteClick} /></div> {shareButton} <div className='detailed-status__button'><IconButton className='bookmark-icon' active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div> diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js index 043a749ed..db038fe63 100644 --- a/app/javascript/mastodon/features/status/components/detailed_status.js +++ b/app/javascript/mastodon/features/status/components/detailed_status.js @@ -220,7 +220,7 @@ class DetailedStatus extends ImmutablePureComponent { if (this.context.router) { favouriteLink = ( <Link to={`/statuses/${status.get('id')}/favourites`} className='detailed-status__link'> - <Icon id='star' /> + <Icon id='floppy-o' /> <span className='detailed-status__favorites'> <AnimatedNumber value={status.get('favourites_count')} /> </span> @@ -229,7 +229,7 @@ class DetailedStatus extends ImmutablePureComponent { } else { favouriteLink = ( <a href={`/interact/${status.get('id')}?type=favourite`} className='detailed-status__link' onClick={this.handleModalLink}> - <Icon id='star' /> + <Icon id='floppy-o' /> <span className='detailed-status__favorites'> <AnimatedNumber value={status.get('favourites_count')} /> </span> diff --git a/app/javascript/mastodon/features/ui/components/document_title.js b/app/javascript/mastodon/features/ui/components/document_title.js index cd081b20c..86ba738b0 100644 --- a/app/javascript/mastodon/features/ui/components/document_title.js +++ b/app/javascript/mastodon/features/ui/components/document_title.js @@ -23,15 +23,7 @@ class DocumentTitle extends PureComponent { } _sideEffects () { - const { unread } = this.props; - - if (unread > 99) { - document.title = `(*) ${title}`; - } else if (unread > 0) { - document.title = `(${unread}) ${title}`; - } else { - document.title = title; - } + document.title = title; } render () { diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index 91240aecf..3d021a632 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -9,3 +9,5 @@ loadPolyfills().then(() => { }).catch(e => { console.error(e); }); + +require('what-input'); diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js index 8c5c15b8f..b2afe3fd6 100644 --- a/app/javascript/packs/public.js +++ b/app/javascript/packs/public.js @@ -20,6 +20,12 @@ window.addEventListener('message', e => { id: data.id, height: document.getElementsByTagName('html')[0].scrollHeight, }, '*'); + + if (document.fonts && document.fonts.ready) { + document.fonts.ready.then(sizeBioText); + } else { + sizeBioText(); + } }); }); @@ -142,6 +148,7 @@ function main() { delegate(document, '.custom-emoji', 'mouseover', getEmojiAnimationHandler('data-original')); delegate(document, '.custom-emoji', 'mouseout', getEmojiAnimationHandler('data-static')); +<<<<<<< HEAD delegate(document, '.status__content__spoiler-link', 'click', function() { const statusEl = this.parentNode.parentNode; @@ -161,6 +168,26 @@ function main() { const message = (statusEl.dataset.spoiler === 'expanded') ? (messages['status.show_less'] || 'Show less') : (messages['status.show_more'] || 'Show more'); spoilerLink.textContent = (new IntlMessageFormat(message, locale)).format(); }); +======= + if (document.body.classList.contains('with-modals')) { + const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth; + const scrollbarWidthStyle = document.createElement('style'); + scrollbarWidthStyle.id = 'scrollbar-width'; + document.head.appendChild(scrollbarWidthStyle); + scrollbarWidthStyle.sheet.insertRule(`body.with-modals--active { margin-right: ${scrollbarWidth}px; }`, 0); + } + + [].forEach.call(document.querySelectorAll('[data-component="Card"]'), (content) => { + const props = JSON.parse(content.getAttribute('data-props')); + ReactDOM.render(<CardContainer locale={locale} {...props} />, content); + }); + + if (document.fonts && document.fonts.ready) { + document.fonts.ready.then(sizeBioText); + } else { + sizeBioText(); + } +>>>>>>> Bio length -> 500 characters }); delegate(document, '.webapp-btn', 'click', ({ target, button }) => { @@ -291,6 +318,22 @@ function main() { } }); }); + + delegate(document, '#account_note', 'input', sizeBioText); + + function sizeBioText() { + const noteCounter = document.querySelector('.note-counter'); + const bioTextArea = document.querySelector('#account_note'); + + if (noteCounter) { + noteCounter.textContent = 500 - length(bioTextArea.value); + } + + if (bioTextArea) { + bioTextArea.style.height = 'auto'; + bioTextArea.style.height = (bioTextArea.scrollHeight+3) + 'px'; + } + } } loadPolyfills() diff --git a/app/javascript/styles/cybre-base.scss b/app/javascript/styles/cybre-base.scss new file mode 100644 index 000000000..487995ab2 --- /dev/null +++ b/app/javascript/styles/cybre-base.scss @@ -0,0 +1,91 @@ +@import 'application'; + +/* Wider compose area */ +@media screen and (min-width: 1300px) { + .drawer { + width: 17%; /* Not part of the flex fun */ + max-width: 400px; + min-width: 330px; + } + .layout-multiple-columns .column { + flex-grow: 1 !important; + max-width: 400px; + } +} + +/* Don't show outline around statuses if we're in + * mouse or touch mode (rather than keyboard) */ +[data-whatinput="mouse"], [data-whatinput="touch"] { + .status__content:focus, .status:focus, + .status__wrapper:focus, .status__content__text:focus { + outline: none; + } +} + +/* Less emphatic show more */ +.status__content__read-more-button { + font-size: 14px; + color: $dark-text-color; + + .status__prepend-icon { + padding-right: 4px; + } +} + +/* Show a little arrowey thing after the time in a + * status to signal that you can click it to see + * a detailed view */ +.status time:after, +.detailed-status__datetime span:after { + font: normal normal normal 14px/1 FontAwesome; + content: "\00a0\00a0\f08e"; +} + +/* Don't display the elephant mascot (we have our + * own, thanks) */ +.drawer__inner__mastodon { + display: none; +} + +/* Let the compose area/drawer be short, but + * expand if necessary */ +.drawer .drawer__inner { + overflow: visible; + height:inherit; + background-image: none; +} +.drawer__pager { + overflow-y:auto; +} + +/* Put a reasonable background on the single-column compose form */ +.layout-single-column .compose-panel { + background-color: $ui-base-color; + height: auto; + max-height: 100%; + overflow-y: visible; + margin-top: 65px; +} + +/* Better distinguish the search bar */ +.layout-single-column .compose-panel .search { + position:relative; + top: -55px; + margin-bottom: -55px; +} + +/* Use display: none instead of visibility:hidden + * to hide the suggested follows list on non-mobile */ +@media screen and (min-width: 630px) { + .search-results .trends { + display:none; + } +} + +/* Don't display the weird triangles on the modal layout, + * because they look strange on cybrespace themes. */ +.modal-layout__mastodon { + display:none; +} + +@import 'fullwidth-media'; diff --git a/app/javascript/styles/cybre-light.scss b/app/javascript/styles/cybre-light.scss new file mode 100644 index 000000000..952c2ea96 --- /dev/null +++ b/app/javascript/styles/cybre-light.scss @@ -0,0 +1,955 @@ +$success-green: #B64579; // Padua + +$ui-base-color: #f7e8ed; // "darkest" +$ui-base-alt: #f9f2f5; +$ui-base-lighter-color: darken($ui-base-color, 40%); // Lighter darkest +$ui-secondary-color: #ead0d6; // "lightest" +$ui-primary-color: #bf5677; // "lighter" +$ui-highlight-color: #bf5677; // "vibrant" +$primary-text-color: #382b32; +$dark-text-color: #ca748f; +$secondary-text-color: #382b32; + +$header-color: $ui-primary-color; +$header-text-color: #fff; +$icon-button-inactive-color: lighten(desaturate($ui-base-lighter-color, 20%), 20%); +$action-button-color: $icon-button-inactive-color; + +$about-page-text: $primary-text-color; + +@import 'cybre-base'; + +$gold-star: #dd9d08; + +/* cybre-specific additions */ + +.column .static-content.getting-started { + background-image: url('../images/logo-cybre-light.png'); + background-size:auto 50%; + background-position: 50% 75%; + background-repeat:no-repeat; +} + +.ui, body { + background: $ui-base-color url('../images/background-cybre-light.png'); + background-attachment: fixed; +} + +.drawer__inner__mastodon { + display: none; +} + +.landing-page .header-wrapper { + background-image:url('../images/header-cybre-alt.jpg'); + background-size:cover; + background-position:50% 50%; +} + +.landing-page.alternative .header { + background-image:url('../images/header-cybre-colour.jpg'); + background-repeat: repeat-x; + background-size:contain; + height:45vh; + width: 100%; + position:absolute; + z-index: 1; + text-align:center; + + display: unset!important; +} + +.landing-page.alternative .header img { + margin: auto; + max-height:45vh; +} + + +.landing-page.alternative .grid { + position: relative; + z-index:2; + margin-top:15vh; +} + +.landing-page.alternative .landing-page__hero img { + visibility: hidden; + max-height:170px; +} + +.landing-page.alternative .landing-page__forms { + height:auto; +} + +.landing-page.alternative .column-1 { + display:flex; + align-items:flex-end; +} + +.landing-page.alternative .column { + max-height:initial; +} + +.landing-page.alternative .row__mascot { + .floats { + position:absolute; + img { + width:100%; + height:100%; + } + transition: all 0.1s linear; + animation-name: floating; + animation-iteration-count: infinite; + animation-direction: alternate; + animation-timing-function: ease-in-out; + } + + .float-1 { + width:50px; + height:50px; + bottom:60px; + left:110px; + animation-duration: 3s; + } + + .float-2 { + width:130px; + height:130px; + left:85px; + bottom: -60px; + animation-duration: 3.5s; + animation-delay: 0.2s; + } + + .float-3 { + width:100px; + height:100px; + right: 50; + top: -10px; + animation-duration: 4s; + animation-delay: 0.5s; + } +} + +/* about.scss */ + +.landing-page { + h1 { + color: $about-page-text; + small { + color: lighten($about-page-text, 10%); + } + } + p, li { + color: $about-page-text; + } + + .header-wrapper { + padding-top:0px; + + background-size:cover; + background-position:50% 55%; + } + + .header-wrapper { + .mascot { + width:500px; + bottom:-52px; + left:-120px; + } + } + + .container.links { + background-color: $ui-base-color; + border-top: 5px solid $ui-primary-color; + width:100%; + max-width:100%; + padding:0px calc(50% - 400px); + + a { + &:hover { + color: lighten($ui-primary-color, 10%); + } + } + } + + .container.hero { + .floats { + display:none; + } + + .closed-registrations-message, form { + border-top: 50px solid #5f4770; + -webkit-box-shadow: 0 0 6px rgba(0,0,0,.1); + box-shadow: 0 0 6px rgba(0,0,0,.1); + + &:before { + font-size: 16px; + font-family:inherit; + line-height:inherit; + font-weight:normal; + color:white; + position:absolute; + top:-35px; + } + } + + .closed-registrations-message:before { + content: "Registrations closed"; + } + + form:before { + content: "Register now"; + } + } + + #mastodon-timeline { + .column-header { + color:white; + } + } +} + +.features-list__row { + .text { + color: $about-page-text; + } +} + +.information-board { + .panel { + .panel-header { + color: $primary-text-color; + border-bottom: 1px solid lighten($ui-secondary-color, 4%); + + a, + span { + font-weight: 400; + color: lighten($ui-primary-color, 4%); + } + } + } +} + +/* components.scss */ + +.onboarding-modal__page { + p { + color: $primary-text-color; + } +} + +.column-header { + background: $header-color; + color: $header-text-color; + border-top-left-radius: 3px; + border-top-right-radius: 3px; + box-shadow: 0px 0px 3px rgba(0,0,0,0.3); +} + +.column-header__button { + background: $header-color; + color: $header-text-color; + border-top-right-radius: 3px; + + &:hover { + color: darken($ui-base-color, 10%); + } + + &.active { + color: $primary-text-color; + background: darken($ui-base-color, 5%); + + &:hover { + background: darken($ui-base-color, 5%); + } + } +} + +.status-card, .status-card.compact { + border-color: $ui-highlight-color; +} + +// selectivity -- needs to override .column-header > button +.column-header .column-header__back-button { + background: $header-color; + color:$header-text-color; +} + +.column-back-button { + background: $header-color; + color:$header-text-color; +} + +.column-header__collapsible-inner { + background: darken($ui-base-alt, 2%); +} + +.empty-column-indicator, +.error-column { + color: darken($ui-base-lighter-color, 15%); +} + +.column > .scrollable { + background: $ui-base-alt; +} + +.compose-form { + .autosuggest-textarea__textarea, + .spoiler-input__input { + color: $primary-text-color; + border: 1px solid $ui-primary-color; + } + + .autosuggest-textarea__textarea { + border-bottom-width:0px; + } + .compose-form__modifiers { + border: 1px solid $ui-primary-color; + border-top-width:0px; + } + + .compose-form__buttons button.active:last-child { + border-radius:3px; + background: $ui-base-color; + color: $ui-primary-color; + } + .compose-form__buttons-wrapper { + background-color:$ui-primary-color; + } + + .compose-form__warning a { + color:white; + } + + .icon-button.inverted { + color:white; + + &:hover { + color:$ui-secondary-color; + } + } +} + +button.icon-button { + &.disabled { + } +} + +.icon-button { + &.inverted { + color: darken($ui-base-lighter-color, 10%); + } + + &.overlayed { + background: rgba($base-overlay-background, 0.2); + color: rgba($white, 0.7); + + &:hover { + background: rgba($base-overlay-background, 0.4); + } + } + + &.disabled { + color: desaturate($icon-button-inactive-color, 5%); + + &:hover, + &:active, + &:focus { + color: desaturate($icon-button-inactive-color, 5%); + } + } + + color: $icon-button-inactive-color; + + &:hover, + &:active, + &:focus { + color: darken($icon-button-inactive-color, 5%); + } +} + +.icon-button.star-icon, +.icon-button.star-icon:active { + background:transparent; + border:none; +} + +.icon-button.star-icon.active { + color: $gold-star; + &:active, &:hover, &:focus { + color: $gold-star; + } +} + +.text-icon-button { + color: $white; + &.active { + background: $ui-base-color; + color: $ui-primary-color; + } + &:focus, &:hover { + color: darken($ui-base-color, 3%); + } +} +.status.status-direct { + background: darken($ui-base-alt, 5%); + .icon-button.disabled { + color: lighten($ui-base-lighter-color, 10%); + } +} + +.account__header, .account-card { + & > div { + background: rgba(lighten($ui-base-color, 4%), 0.6); + } + + .account__header__content { + color: $primary-text-color; + } + + .detailed-status__display-name .display-name strong { + color: $ui-highlight-color; + } + + .icon-button { + &, &:hover { + color:desaturate($ui-base-lighter-color, 20%); + } + &.active { + &, &:hover { + color:$ui-base-lighter-color; + } + } + } +} + +.account__section-headline a { + &.active { + color: $primary-text-color; + + &::after { + border-bottom-color: $ui-base-alt; + } + + &::after { + border-bottom-color: $ui-base-alt; + } + } +} + +.privacy-dropdown.active .privacy-dropdown__value.active .icon-button { + color: $ui-primary-color; +} + +.privacy-dropdown__option { + color: $primary-text-color; + + strong { + color: $primary-text-color; + } + + &:hover, + &.active { + color: $white; + + .privacy-dropdown__option__content { + color: $white; + + strong { + color: $white; + } + } + } +} + +.emoji-picker-dropdown__menu { + .emoji-search-wrapper { + border-color: darken($ui-base-color, 10%); + } + .emoji-search { + background: darken($ui-base-color, 5%); + border-color: darken($ui-base-color, 10%); + } + .emoji-mart { + color: $ui-primary-color; + } +} + +.search-popout { + background: $ui-base-color; + color: $ui-primary-color; + + h4 { + color: $ui-primary-color; + } + + em { + color: $ui-highlight-color; + } +} +.search__icon .fa.active { + opacity:1.0; +} +.search-results__hashtag { + color: darken($ui-primary-color, 10%); + &:hover { + color: lighten($ui-primary-color, 5%); + } +} + +.static-content { + /*color: $primary-text-color;*/ +} + +#Getting-started { + background: $ui-primary-color; + border-bottom:0px; + color:white; +} + +.getting-started { + p { + color: $primary-text-color; + } + + a { + color: darken($ui-base-lighter-color, 10%); + } +} +.getting-started__wrapper { + flex: 0 0.5 auto; +} + +.getting-started { + .column-link { + background: lighten($ui-primary-color, 5%); + color:$white; + &:hover { + background: lighten($ui-primary-color, 10%); + } + } +} +.column-link__badge { + background: saturate(darken($ui-primary-color, 5%), 5%); +} +.column-subheading { + background: darken($ui-primary-color, 5%); + color:$white; +} + +.media-spoiler, +.video-player__spoiler.active { + color: $white; + &:hover { + color: darken($white, 5%); + } +} + +.status { + border-bottom: 1px solid $ui-secondary-color; +} + +.status__relative-time, .status__display-name { + color: darken($ui-base-color, 40%); +} + +.status__content { + .status__content__spoiler-link { + background: $ui-base-lighter-color; + + &:hover { + background: lighten($ui-base-lighter-color, 5%); + } + } +} + +.muted .status__content p { + color: $icon-button-inactive-color; +} + +.dropdown-menu__item { + & > a { + color: $primary-text-color; + &:hover, &:active, &:focus { + color: $white; + } + } +} + +.dropdown--active .dropdown__content { + & > ul { + background: $ui-base-color; + box-shadow: 0 0 5px rgba($base-shadow-color, 0.2); + & > li > a { + background: $ui-base-color; + color: $primary-text-color; + + &:hover { + background: $ui-highlight-color; + color: $ui-base-color; + } + } + } +} + +.boost-modal, +.confirmation-modal, +.report-modal, +.actions-modal, +.mute-modal +{ + color: $primary-text-color; +} +.boost-modal__action-bar, +.confirmation-modal__action-bar, +.mute-modal__action-bar, +.report-modal__action-bar, +.mute-modal__action-bar { + & > div { + color: $ui-primary-color; + } +} + +.actions-modal +{ + ul { + li:not(:empty) { + a { + color: $primary-text-color; + button { + + } + &.active, &:hover, &:active, &:focus { + color: $white; + button { + color: $white; + } + } + } + } + } +} + +.react-toggle-track { + background-color: $icon-button-inactive-color; +} + +.report-modal__comment .setting-text { + color: $primary-text-color; + border-bottom-color: lighten($ui-primary-color, 10%); + &:focus, &:active { + color: $primary-text-color; + } +} + +.status.light { + .status__content { + color: $primary-text-color; + } + .display-name strong { + color: $primary-text-color; + } +} + +.reply-indicator__content a { + color: lighten($ui-highlight-color, 30%); +} + +.status__content +{ + a { + color: $ui-highlight-color; + + &:hover { + .fa { + color: darken($ui-base-color, 40%); + } + } + } +} + +.detailed-status__display-name { + color: $ui-base-lighter-color; +} + +.drawer .drawer__inner { + overflow: visible; + height:inherit; + background:$ui-base-alt; +} + +.search__icon .fa { + color: $ui-highlight-color; +} + +.drawer__pager { + overflow-y:auto; +} + +.drawer .drawer__header { + background: $ui-base-color; + border-radius:3px; +} + +.onboarding-modal__page h1 { + background-color: darken($ui-primary-color, 5%); +} + +.poll__text input[type="text"], +.compose-form__poll-wrapper select { + color: $primary-text-color; +} + +.compose-form__poll-wrapper .button.button-secondary { + color: $ui-highlight-color; +} + +/* forms.scss */ +.block-button, .button, button { + background-color: $ui-primary-color; + color: $white; + + &.button-alternative { + color: $ui-base-color; + } + + &.logo-button { + color: $white; + svg path:first-child { + fill: $white; + } + } +} + +.simple_form { + p.hint { + color: $primary-text-color; + } + + .block-button, .button, button { + background-color: $ui-primary-color; + color: $white; + + &:hover { + background-color: lighten($ui-primary-color, 5%); + } + + &:active, + &:focus { + background-color: darken($ui-primary-color, 5%); + } + + } +} + +/* admin.scss */ + +.table > thead > tr > th { + border-bottom-color: $ui-secondary-color; +} + +.simple_form h4 { + border-bottom: 1px solid $ui-highlight-color; +} + +.admin-wrapper { + .content { + h2, p.hint, h4, h6 { + color: $primary-text-color; + } + + .muted-hint { + color: $primary-text-color; + } + } + + .sidebar { + .logo { + -webkit-filter: invert(100%); + filter: invert(100%); + } + + ul { + ul { + a { + &.selected { + background-color: $ui-primary-color; + color: $white; + + &:hover { + background-color: lighten($ui-primary-color, 10%); + } + } + } + } + a { + &.selected { + background-color: $ui-primary-color; + color: $white; + + &:hover { + background-color: lighten($ui-primary-color, 10%); + } + } + } + } + } +} + +.pagination .current { + color: $ui-primary-color; +} + +.report-accounts__item > strong { + color: $primary-text-color; +} + +.admin-wrapper .content { + & > p { + color: $primary-text-color; + } + hr { + border-color: $ui-highlight-color; + } +} + +/* accounts.scss */ +.card { + .name { + color: $white; + } + + .counter { + .counter-number { + color: $white; + } + } +} + +/* stream_entries.scss */ +.activity-stream { + .entry { + } + .status.light { + .display-name { + strong { + color: $primary-text-color; + } + } + .status__content { + color: $primary-text-color; + } + } + .detailed-status.light { + .detailed-status__display-name { + .display-name { + strong { + color: $primary-text-color; + } + } + } + .status__content { + color: $primary-text-color; + } + .status-card, + .status-card__title, + .status-card__description { + color: $primary-text-color; + } + } +} + +/* accounts.scss */ +.card { + .name { + color: darken($ui-primary-color, 15%); + } + .counter { + .counter-number { + color: darken($ui-primary-color, 15%); + } + border-color: $ui-primary-color; + } +} + +.activity-stream-tabs { + a { + color: lighten($ui-primary-color, 10%); + &.active { + color: darken($ui-primary-color, 10%); + } + } +} + +/* uncategorized */ + +.empty-column-indicator, .error-column { + background-color: $ui-base-alt; +} + +.actions .button.button-alternative { + background: $ui-highlight-color; + color: $white; + + &:active, + &:focus, + &:hover { + background-color: lighten($ui-highlight-color, 4%); + } +} + +.public-layout .header { + background: $ui-highlight-color; + color: $white; +} + +.public-layout .public-account-header__tabs__name h1 { + color: $white; + small { + color: $white; + } +} +.public-layout .header .brand:hover, +.public-layout .header .brand:focus, +.public-layout .header .brand:active { + background: lighten($ui-highlight-color, 5%); +} + +.public-layout .container:last-child { + background:$ui-highlight-color; + padding-left: 100px; + padding-right: 100px; + border-radius: 4px; + h4 { + color: white; + } +} + +.modal-layout, .modal-layout__mastodon > * { + background: none; +} + +.dashboard__widgets a:not(.name-tag) { + color: $primary-text-color; +} + +.tabs-bar__wrapper { + background: $ui-base-color url('../images/background-cybre-light.png'); +} + +.layout-single-column .navigation-panel { + background-color: $ui-highlight-color; + height: auto; + .column-link { + background: lighten($ui-primary-color, 5%); + color:$white; + &:hover { + background: lighten($ui-primary-color, 10%); + } + &.active { + background: darken($ui-primary-color, 5%); + } + } + hr { + display: none; + } +} diff --git a/app/javascript/styles/cybre.scss b/app/javascript/styles/cybre.scss new file mode 100644 index 000000000..972eb5d0b --- /dev/null +++ b/app/javascript/styles/cybre.scss @@ -0,0 +1,278 @@ +$ui-base-color: #1b1b1b; // darkest +$ui-highlight-color: #1ea21e; // vibrant +$ui-secondary-color: #E4F2E4; // lightest +$ui-primary-color: #E4F2E4; // lighter +$ui-primary-color-alt: #a0b49c; // darker, for external pages + +$about-page-text: lighten($ui-base-color, 50%); + +@import 'cybre-base'; + +@keyframes floating { + from { + transform: translate(0, 0); + } + 65% { + transform: translate(0, 4px); + } + to { + transform: translate(0, -0); + } +} + +body, body.about-body { + background: $ui-base-color url('../images/background-cybre.png'); + background-attachment: fixed; +} + +body.about-body { + // basics.scss &.about-body + background: darken($ui-base-color, 8%) url('../images/background-cybre.png'); + + background-position-y: 200px; + background-position-x: center; +} + +.about-body .mascot { + display: none; +} + +.muted { + .status__content p, .status__content a { + color: lighten($ui-base-color, 35%); + } + + .status__display-name strong { + color: lighten($ui-base-color, 35%); + } +} + +.compose-form__buttons button.active:last-child { + color:$ui-secondary-color; + background-color: $ui-highlight-color; + border-radius:3px; +} + +.screenshot-with-signup { + min-height:300px; +} + +.container.hero .closed-registrations-message .clock { + font-size: 150%; + margin: 1em auto; +} + +.column .static-content.getting-started { + background-image: url('../images/logo-cybre.png'), url('../images/background-cybre.png'); + background-size:auto 50%, cover; + background-position: 50% 75%, center center; + background-repeat:no-repeat, no-repeat; +} + +.columns-area { + background: $ui-base-color url('../images/background-cybre.png'); +} + +.actions .button.button-alternative { + background: $ui-highlight-color; + color: $ui-primary-color; + + &:active, + &:focus, + &:hover { + background-color: lighten($ui-highlight-color, 4%); + } +} + +@media screen and (max-width: 1280px) { + .landing-page .container.links { + top: -15px; + } +} + +.landing-page.alternative .header { + background-image:url('../images/header-cybre-colour.jpg'); + background-repeat: repeat-x; + background-size:contain; + height:45vh; + width: 100%; + position:absolute; + z-index: 1; + text-align:center; + + display: unset!important; +} + +.landing-page.alternative .header img { + margin: auto; + max-height:45vh; +} + + +.landing-page.alternative .grid { + position: relative; + z-index:2; + margin-top:15vh; +} + +.landing-page.alternative .landing-page__hero img { + visibility: hidden; + max-height:170px; +} + +.landing-page.alternative .landing-page__forms { + height:auto; +} + +.landing-page.alternative .column-1 { + display:flex; + align-items:flex-end; +} + +.landing-page.alternative .column { + max-height:initial; +} + +.landing-page.alternative .row__mascot { + .floats { + position:absolute; + img { + width:100%; + height:100%; + } + transition: all 0.1s linear; + animation-name: floating; + animation-iteration-count: infinite; + animation-direction: alternate; + animation-timing-function: ease-in-out; + } + + .float-1 { + width:50px; + height:50px; + bottom:60px; + left:110px; + animation-duration: 3s; + } + + .float-2 { + width:130px; + height:130px; + left:85px; + bottom: -60px; + animation-duration: 3.5s; + animation-delay: 0.2s; + } + + .float-3 { + width:100px; + height:100px; + right: 50; + top: -10px; + animation-duration: 4s; + animation-delay: 0.5s; + } +} + +.activity-stream { + .status.light { + .status__header .status__meta .status__relative-time { + color: $ui-primary-color-alt; + } + + .display-name span { + color: $ui-primary-color-alt; + } + + .status__content { + a.status__content__spoiler-link { + background: $ui-primary-color-alt; + + &:hover { + background: lighten($ui-primary-color-alt, 8%); + } + } + } + } + + .detailed-status.light { + .detailed-status__display-name .display-name span { + color: $ui-primary-color-alt; + } + + .status__content a.status__content__spoiler-link { + background: $ui-primary-color-alt; + + &:hover { + background: lighten($ui-primary-color-alt, 8%); + } + } + + .detailed-status__meta { + color: $ui-primary-color-alt; + } + } + + .media-spoiler { + background: $ui-primary-color-alt; + &:hover { + background: darken($ui-primary-color-alt, 5%); + } + } + + .pre-header { + color: $ui-primary-color-alt; + .status__display-name.muted strong { + color: $ui-primary-color-alt; + } + } +} + +.embed .activity-stream .entry .detailed-status.light .button.button-secondary.logo-button { + color: $ui-primary-color-alt; + svg { + path:first-child { + fill: $ui-primary-color-alt; + } + } + &:active, + &:focus, + &:hover { + svg path:first-child { + fill: lighten($ui-primary-color-alt, 4%); + } + } +} + +.emoji-mart-search { + background: $simple-background-color; + input { + color: $ui-primary-color-alt; + border: 1px solid $ui-primary-color-alt; + } +} + +.emoji-mart-anchor { + color: $ui-primary-color-alt; + &:hover { + color: darken($ui-primary-color-alt, 8%); + } +} + +.search-popout { + background: $ui-base-color; + color: $ui-primary-color; + + h4 { + color: $ui-primary-color; + } + + em { + color: $ui-highlight-color; + } +} + +.status__content a, +.status__content a.unhandled-link { + color: mix($ui-highlight-color, $ui-secondary-color, 10%); +} diff --git a/app/javascript/styles/fullwidth-media.scss b/app/javascript/styles/fullwidth-media.scss new file mode 100644 index 000000000..f6a036d4f --- /dev/null +++ b/app/javascript/styles/fullwidth-media.scss @@ -0,0 +1,48 @@ + +.detailed-status > .media-spoiler, +.status > .media-spoiler, +.status .video-player, +.media-gallery, +.status .status-card.interactive { + margin-top: 20px; + margin-left: -68px; + width: calc(100% + 80px); +} + +.detailed-status > .media-spoiler, +.status > .media-spoiler, +.video-player { + max-width: none; +} + +/* If there's no status text, add an extra margin on top */ +.status .status__info + .media-gallery, +.status .status__info + .media-spoiler, +.status .status__info + .video-player, +.status .status__info + .status-card { + margin-top: 40px; +} + +.status__video-player-video { + transform: unset; + top: unset; +} + +.detailed-status .media-gallery { + margin-left: -10px; + width: calc(100% + 22px); +} + +.public-layout .status { + .status__content { + min-height: 15px; + } + & > .media-spoiler, + .video-player, + .media-gallery, + .status-card { + margin-top: 20px; + width: calc(100% + 94px); + margin-left: -78px; + } +} diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index d6385f161..b45f0bcd4 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -1669,13 +1669,13 @@ a.account__display-name { .no-reduce-motion .icon-button.star-icon { &.activate { - & > .fa-star { + & > .fa-floppy-o { animation: spring-rotate-in 1s linear; } } &.deactivate { - & > .fa-star { + & > .fa-floppy-o { animation: spring-rotate-out 1s linear; } } @@ -3195,7 +3195,6 @@ a.status-card.compact:hover { } .status-card__image-image { - border-radius: 4px 0 0 4px; display: block; margin: 0; width: 100%; diff --git a/app/javascript/styles/mastodon/containers.scss b/app/javascript/styles/mastodon/containers.scss index cb0301372..3684c699c 100644 --- a/app/javascript/styles/mastodon/containers.scss +++ b/app/javascript/styles/mastodon/containers.scss @@ -263,8 +263,6 @@ } .container { - max-width: 960px; - @media screen and (max-width: $no-gap-breakpoint) { padding: 0; } @@ -298,6 +296,12 @@ min-height: 1px; } + h2 { + font-size: 1rem; + align-items: center; + display: flex; + } + .nav-left { display: flex; align-items: stretch; diff --git a/app/javascript/styles/win95.scss b/app/javascript/styles/win95.scss new file mode 100644 index 000000000..5dbe1db74 --- /dev/null +++ b/app/javascript/styles/win95.scss @@ -0,0 +1,2587 @@ +$win95-bg: #bfbfbf; +$win95-dark-grey: #404040; +$win95-mid-grey: #808080; +$win95-window-header: #00007f; +$win95-tooltip-yellow: #ffffcc; +$win95-blue: blue; +$win95-cyan: #008080; + +$ui-base-lighter-color: $win95-dark-grey; +$ui-highlight-color: $win95-window-header; + +@mixin win95-border-outset() { + border-left: 2px solid #efefef; + border-top: 2px solid #efefef; + border-right: 2px solid #404040; + border-bottom: 2px solid #404040; + border-radius:0px; +} + +@mixin win95-border-outset-sides-only() { + border-left: 2px solid #efefef; + border-right: 2px solid #404040; + border-radius:0px; +} + +@mixin win95-outset() { + box-shadow: inset -1px -1px 0px #000000, + inset 1px 1px 0px #ffffff, + inset -2px -2px 0px #808080, + inset 2px 2px 0px #dfdfdf; + border-radius:0px; +} + +@mixin win95-outset-no-highlight() { + box-shadow: inset -1px -1px 0px #000000, + inset -2px -2px 0px #808080; + border-radius:0px; +} + +@mixin win95-border-inset() { + border-left: 2px solid #404040; + border-top: 2px solid #404040; + border-right: 2px solid #efefef; + border-bottom: 2px solid #efefef; + border-radius:0px; +} + +@mixin win95-border-slight-inset() { + border-left: 1px solid #404040; + border-top: 1px solid #404040; + border-right: 1px solid #efefef; + border-bottom: 1px solid #efefef; + border-radius:0px; +} + +@mixin win95-inset() { + box-shadow: inset 1px 1px 0px #000000, + inset -1px -1px 0px #ffffff, + inset 2px 2px 0px #808080, + inset -2px -2px 0px #dfdfdf; + border-width:0px; + border-radius:0px; +} + + +@mixin win95-tab() { + box-shadow: inset -1px 0px 0px #000000, + inset 1px 0px 0px #ffffff, + inset 0px 1px 0px #ffffff, + inset 0px 2px 0px #dfdfdf, + inset -2px 0px 0px #808080, + inset 2px 0px 0px #dfdfdf; + border-radius:0px; + border-top-left-radius: 1px; + border-top-right-radius: 1px; +} + +@mixin win95-border-groove() { + border-radius: 0px; + border: 2px groove #bfbfbf; +} + +@mixin win95-reset() { + box-shadow: unset; + border: 0px solid transparent; +} + +@font-face { + font-family:"premillenium"; + src: url('../fonts/premillenium/MSSansSerif.ttf') format('truetype'); +} + +@import 'cybre-base'; + +html { + scrollbar-color: $win95-mid-grey transparent; +} + +body { + font-size:13px; + font-family: "MS Sans Serif", "premillenium", sans-serif; + color:black; +} + +.ui, +.ui .columns-area, +body.admin { + background: $win95-cyan; +} + +.loading-bar { + height:5px; + background-color: #000080; +} + +.tabs-bar__wrapper { + background-color: $win95-cyan; +} + +.tabs-bar { + background: $win95-bg; + @include win95-outset(); + height: 30px; +} + +.tabs-bar__link { + color:black; + border:2px outset $win95-bg; + border-top-width: 1px; + border-left-width: 1px; + margin:2px; + padding:3px; +} + +.tabs-bar__link.active { + @include win95-inset(); + color:black; +} + +.tabs-bar__link:last-child::before { + content:"Start"; + color:black; + font-weight:bold; + font-size:15px; + width:80%; + display:block; + position:absolute; + right:0px; +} + +.tabs-bar__link:last-child { + position:relative; + flex-basis:60px !important; + font-size:0px; + color:$win95-bg; + + background-image: url("../images/start.png"); + background-repeat:no-repeat; + background-position:8%; + background-clip:padding-box; + background-size:auto 50%; +} + +.drawer .drawer__inner { + overflow: visible; + height:inherit; + background:$win95-bg; +} + +.drawer:after { + display:block; + content: " "; + + position:absolute; + bottom:15px; + left:15px; + width:132px; + height:117px; + background-image:url("../images/clippy_wave.gif"), url("../images/clippy_frame.png"); + background-repeat:no-repeat; + background-position: 4px 20px, 0px 0px; + z-index:0; +} + +.drawer__pager { + overflow-y:auto; + z-index:1; +} + +.privacy-dropdown__dropdown { + z-index:2; +} + +.column > .scrollable { + background: $win95-bg; + @include win95-border-outset(); + border-top-width:0px; +} + +.column-header__wrapper { + color:white; + font-weight:bold; + background:#7f7f7f; +} + +.column-header { + padding:0px; + font-size:13px; + background:#7f7f7f; + @include win95-border-outset(); + border-bottom-width:0px; + color:white; + font-weight:bold; + align-items:baseline; + min-height: 24px; +} + +.column-header > button { + padding: 0px; + min-height: 22px; +} + +.column-header__wrapper.active { + background:$win95-window-header; +} + +.column-header__wrapper.active::before { + display:none; +} +.column-header.active { + box-shadow:unset; + background:$win95-window-header; +} + +.column-header.active .column-header__icon { + color:white; +} + +.column-header__buttons { + max-height: 20px; + margin: 2px; + margin-left: -2px; +} + +.column-header__buttons button { + margin-left: 2px; +} + +.column-header__button { + background: $win95-bg; + color: black; + @include win95-outset(); + + line-height:0px; + font-size:14px; + padding:0px 4px; + + &:hover { + color: black; + } +} + +.column-header__button.active, .column-header__button.active:hover { + @include win95-inset(); + background-color:#7f7f7f; +} + +// selectivity -- needs to override .column-header > button +.column-header .column-header__back-button { + background: $win95-bg; + color: black; + padding:2px; + padding-right: 4px; + max-height: 20px; + min-height: unset; + margin: 2px; + @include win95-outset(); + font-size: 13px; + line-height: 17px; + font-weight:bold; +} + +.column-header__buttons .column-header__back-button { + margin: 0; +} + +.column-back-button { + background:$win95-bg; + color:black; + @include win95-outset(); + font-size:13px; + font-weight:bold; + + padding: 2px; + height: 26px; +} + +.column-back-button--slim-button { + position:absolute; + top:-22px; + right:4px; + max-height:20px; + padding: 1px 6px 0 2px; + box-sizing: border-box; +} + +.column-back-button__icon { + font-size:11px; + margin-top:-3px; +} + +.column-header__collapsible { + border-left:2px outset $win95-bg; + border-right:2px outset $win95-bg; +} + +.column-header__collapsible-inner { + background:$win95-bg; + color:black; +} + +.column-header__collapsible__extra { + color:black; +} + +.column-header__collapsible__extra div[role="group"] { + border: 2px groove #eee; + margin-bottom: 11px; + padding: 4px; +} + +.column-inline-form { + background-color: $win95-bg; + @include win95-border-outset(); + border-bottom-width:0px; + border-top-width:0px; + + align-items: baseline; +} + +.column-inline-form .icon-button { + font-size: 14px!important; + line-height: 17px!important; +} + +.column-inline-form .setting-text { + line-height: 17px; + padding-left: 4px; +} + +.column-settings__section { + color:black; + font-weight:bold; + font-size:11px; +} + +[role="group"] .column-settings__section { + display:inline-block; + background-color:$win95-bg; + position:relative; + + top: -14px; + top: calc(-1em - 0.5ex); + left: 4px; + + padding: 0px 4px; + margin-bottom: 0px; +} + +.setting-meta__label, .setting-toggle__label { + color:black; + font-weight:normal; +} + +.setting-meta__label span:before { + content:"("; +} +.setting-meta__label span:after { + content:")"; +} + +.setting-toggle { + line-height:13px; +} + +.react-toggle .react-toggle-track { + border-radius:0px; + background-color:white; + @include win95-border-inset(); + + width:12px; + height:12px; +} + +.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track { + background-color:white; +} + +.react-toggle .react-toggle-track-check { + left:2px; + transition:unset; +} + +.react-toggle .react-toggle-track-check svg path { + fill: black; +} + +.react-toggle .react-toggle-track-x { + display:none; +} + +.react-toggle .react-toggle-thumb { + border-radius:0px; + display:none; +} + +.text-btn { + background-color:$win95-bg; + @include win95-outset(); + padding:4px; +} + +.text-btn:hover { + text-decoration:none; + color:black; +} + +.text-btn:active { + @include win95-inset(); +} + +.setting-text { + color:black; + background-color:white; + @include win95-inset(); + font-size:13px; + padding:2px; +} + +.setting-text:active, .setting-text:focus, +.setting-text.light:active, .setting-text.light:focus { + color:black; + border-bottom:2px inset $win95-bg; +} + +.column-header__setting-arrows .column-header__setting-btn { + padding:3px 10px; +} + +.column-header__setting-arrows .column-header__setting-btn:last-child { + padding:3px 10px; +} + +.missing-indicator { + background-color:$win95-bg; + color:black; + @include win95-outset(); +} + +.missing-indicator > div { + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRUaXRsZQAACJnLyy9Jyy/NSwEAD5IDblIFOhoAAAAXelRYdEF1dGhvcgAACJlLzijKz0vMAQALmgLoDsFj8gAAAQpJREFUOMuVlD0OwjAMhd2oQl04Axfo0IGBgYELcAY6cqQuSO0ZOEAZGBg6VKg74gwsEaoESRVHjusI8aQqzY8/PbtOEz1qkFSn2YevlaNOpLMJh2DwvixhuXtOa6/LCh51DUMEFkAsgAZD207Doin8mQ562JpRE5CHBAAhmIqD1L8AqzUUUJkxc6kr3AgAJ+NuvIWRdk7WcrKl0AUqcIBBHOiEbpS4m27mIL5Onfg3k0rgggeQuS2sDOGSahKR+glgqaGLgUJs951NN1q9D72cQqQWR9cr3sm9YcEssEuz6eEuZh2bu0aSOhQ1MBezu2O/+TVSvEFII3qLsZWrSA2AAUQIh1HpyP/kC++zjVSMj6ntAAAAAElFTkSuQmCC') no-repeat; + background-position:center center; +} + +.empty-column-indicator, +.error-column { + background: $win95-bg; + color: black; +} + +.notification__filter-bar { + background: $win95-bg; + @include win95-border-outset-sides-only(); + padding-top: 10px; + padding-left: 10px; + padding-right: 10px; + border-bottom: 2px solid #efefef; + overflow-y: visible; + + button { + background: transparent; + color: black; + padding: 8px 0; + align-self: end; + @include win95-tab(); + + &.active { + color: black; + top: 2px; + background-color: $win95-bg; + + &::before, &::after { + display:none; + } + } + } +} + +.status__wrapper { + border: 2px groove $win95-bg; + margin:4px; +} + +.status { + @include win95-border-slight-inset(); + background-color:white; + margin:4px; + padding-bottom:40px; + margin-bottom:8px; +} + +.status.status-direct { + background:$win95-bg; + &:focus, &:active { + background:$win95-bg; + } + + &:not(.read) { + background: white; + } +} +.focusable:focus .status.status-direct { + background:$win95-bg; +} + +[data-whatinput="mouse"], [data-whatinput="touch"] { + .status__content:focus, .status:focus, + .status__wrapper:focus, .status__content__text:focus { + background-color: $win95-bg; + } + + .status.status-direct, .detailed-status { + &:not(.read) { + .status__content:focus { + background-color: white; + } + } + } +} + +.status__content, .reply-indicator__content { + font-size:13px; + color: black; +} + +.status.light .status__relative-time, +.status.light .display-name span { + color: #7f7f7f; +} + +.status__action-bar { + box-sizing:border-box; + position:absolute; + bottom:-1px; + left:-1px; + background:$win95-bg; + width:calc(100% + 2px); + padding-left:10px; + padding: 4px 2px; + padding-bottom:4px; + border-bottom:2px groove $win95-bg; + border-top:1px outset $win95-bg; + text-align: right; +} + +.status__wrapper .status__action-bar { + border-bottom-width:0px; +} + +.status__action-bar-button { + float:right; +} + +.status__action-bar-dropdown { + margin-left:auto; + margin-right:10px; + + .icon-button { + min-width:28px; + } +} +.status.light .status__content a { + color:blue; +} + +.focusable:focus { + background: $win95-bg; + .detailed-status__action-bar { + background: $win95-bg; + } + + .status, .detailed-status { + background: white; + outline:2px dotted $win95-mid-grey; + } +} + +.dropdown__trigger.icon-button { + padding-right:6px; +} + +.detailed-status__action-bar-dropdown .icon-button { + min-width:28px; +} + +.detailed-status { + background:white; + background-clip:padding-box; + margin:4px; + border: 2px groove $win95-bg; + padding:4px; +} + +.detailed-status__display-name { + color:#7f7f7f; +} + +.detailed-status__display-name strong { + color:black; + font-weight:bold; +} +.account__avatar, +.account__avatar-overlay-base, +.account__header__avatar, +.account__avatar-overlay-overlay { + @include win95-border-slight-inset(); + clip-path:none; + filter: saturate(1.8) brightness(1.1); +} + +.detailed-status__action-bar { + background-color:$win95-bg; + border:0px; + border-bottom:2px groove $win95-bg; + margin-bottom:8px; + justify-items:left; + padding-left:4px; +} + +.icon-button { + background:$win95-bg; + @include win95-border-outset(); + padding:0px 0px 0px 0px; + margin-right:4px; + + color:#3f3f3f; + &.inverted, &:hover, &.inverted:hover, &:active, &:focus { + color:#3f3f3f; + } +} + +.icon-button:active { + @include win95-border-inset(); +} + +.status__action-bar > .icon-button { + padding:0px 15px 0px 0px; + min-width:25px; +} + +.icon-button.star-icon, +.icon-button.star-icon:active { + background:transparent; + border:none; +} + +.icon-button.star-icon.active { + color: $gold-star; + &:active, &:hover, &:focus { + color: $gold-star; + } +} + +.icon-button.star-icon > i { + background:$win95-bg; + @include win95-border-outset(); + padding-bottom:3px; +} + +.icon-button.star-icon:active > i { + @include win95-border-inset(); +} + +.text-icon-button { + color:$win95-dark-grey; +} + +.detailed-status__action-bar-dropdown { + margin-left:auto; + justify-content:right; + padding-right:16px; +} + +.detailed-status__button { + flex:0 0 auto; +} + +.detailed-status__button .icon-button { + padding-left:2px; + padding-right:25px; +} + +.status-card, .status-card.compact, a.status-card, a.status-card.compact { + border-radius:0px; + background:white; + border: 1px solid black; + color:black; + + &:hover { + background-color:white; + } +} + +.status-card__title { + color:blue; + text-decoration:underline; + font-weight:bold; +} + +.load-more { + width:auto; + margin:5px auto; + background: $win95-bg; + @include win95-outset(); + color:black; + padding: 2px 5px; + + &:hover { + background: $win95-bg; + color:black; + } +} + +.status-card__description { + color:black; +} + +.account__display-name strong, .status__display-name strong { + color:black; + font-weight:bold; +} + +.account .account__display-name { + color:black; +} + +.account { + border-bottom: none; +} + +.reply-indicator__content .status__content__spoiler-link, .status__content .status__content__spoiler-link { + background:$win95-bg; + @include win95-outset(); +} + +.reply-indicator__content .status__content__spoiler-link:hover, .status__content .status__content__spoiler-link:hover { + background:$win95-bg; +} + +.reply-indicator__content .status__content__spoiler-link:active, .status__content .status__content__spoiler-link:active { + @include win95-inset(); +} + +.reply-indicator__content a, .status__content a { + color:blue; +} + +.notification { + border: 2px groove $win95-bg; + margin:4px; +} + +.notification__message { + color:black; + font-size:13px; +} + +.notification__display-name { + font-weight:bold; +} + + +.drawer__header { + background: $win95-bg; + @include win95-border-outset(); + justify-content:left; + margin-bottom:0px; + padding-bottom:2px; + border-bottom:2px groove $win95-bg; +} + +.drawer__tab { + color:black; + @include win95-outset(); + padding:5px; + margin:2px; + flex: 0 0 auto; +} + +.drawer__tab:first-child::before { + content:"Start"; + color:black; + font-weight:bold; + font-size:15px; + width:80%; + display:block; + position:absolute; + right:0px; + +} + +.drawer__tab:first-child { + position:relative; + padding:5px 15px; + width:40px; + font-size:0px; + color:$win95-bg; + + background-image: url("../images/start.png"); + background-repeat:no-repeat; + background-position:8%; + background-clip:padding-box; + background-size:auto 50%; +} + +.drawer__header a:hover { + background-color:transparent; +} + +.drawer__header a:first-child:hover { + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAIAAACpTQvdAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRBdXRob3IAAAiZS84oys9LzAEAC5oC6A7BY/IAAACWSURBVCiRhVJJDsQgDEuqOfRZ7a1P5gbP4uaJaEjTADMWQhHYjlk4p0wLnNdptdF4KvBUDyGzVwc2xO+uKtH+1o0ytEEmqFpuxlvFCGCxKbNIT56QCi2MzaA/2Mz+mERSOeqzJG2RUxkjdTabgPtFoZ1bZxcKvgPcLZVufAyR9Ni8v5dWDzfFx0giC1RvZFv6l35QQ/Mvv39XXgGzQpoAAAAASUVORK5CYII="); + background-repeat:no-repeat; + background-position:8%; + background-clip:padding-box; + background-size:auto 50%; + transition:unset; +} + +.drawer__tab:first-child { + +} + +.search { + background:$win95-bg; + padding-top:2px; + padding:2px; + border:2px outset $win95-bg; + border-top-width:0px; + border-bottom: 2px groove $win95-bg; + margin-bottom:0px; +} + +.search input { + background-color:white; + color:black; + @include win95-border-slight-inset(); +} + +.search__input:focus { + background-color:white; +} + +.search-popout { + box-shadow: unset; + color:black; + border-radius:0px; + background-color:$win95-tooltip-yellow; + border:1px solid black; + + h4 { + color:black; + text-transform: none; + font-weight:bold; + } +} + +.search-results__header { + background-color: $win95-bg; + color:black; + border-bottom:2px groove $win95-bg; +} + +.search-results__hashtag { + color:blue; +} + +.search-results__section h5:before { + display: none; +} + +.search-results__section h5 { + background: #bfbfbf; + span { + color: black; + padding: 0px 2px; + } +} + +.search-results__section { + border: 3px groove white; + margin: 11px 6px 9px 3px; +} + +.search-results__section .account:hover, +.search-results__section .account:hover .account__display-name, +.search-results__section .account:hover .account__display-name strong, +.search-results__section .search-results__hashtag:hover { + background-color:$win95-window-header; + color:white; +} + +.search__icon .fa { + color:#808080; + + &.active { + opacity:1.0; + } + + &:hover { + color: #808080; + } +} + +.trends__item__name a, +.trends__item__current { + color: black; +} + +.drawer__inner, +.drawer__inner.darker { + background-color:$win95-bg; + border: 2px outset $win95-bg; + border-top-width:0px; +} + +.navigation-bar { + color:black; +} + +.navigation-bar strong { + color:black; + font-weight:bold; +} + +.compose-form .autosuggest-textarea__textarea, +.compose-form .spoiler-input__input { + border-radius:0px; + @include win95-border-slight-inset(); +} + +.compose-form .autosuggest-textarea__textarea { + border-bottom:0px; +} + +.compose-form__uploads-wrapper { + border-radius:0px; + border-bottom:1px inset $win95-bg; + border-top-width:0px; +} + +.compose-form__upload-wrapper { + border-left:1px inset $win95-bg; + border-right:1px inset $win95-bg; +} + +.compose-form .compose-form__buttons-wrapper { + background-color: $win95-bg; + border:2px groove $win95-bg; + margin-top:4px; + padding:4px 8px; +} + +.compose-form__buttons { + background-color:$win95-bg; + border-radius:0px; + box-shadow:unset; +} + +.compose-form__buttons-separator { + border-left: 2px groove $win95-bg; +} + +.compose-form__poll-wrapper .icon-button.disabled { + color: $win95-mid-grey; +} + +.privacy-dropdown.active .privacy-dropdown__value.active, +.advanced-options-dropdown.open .advanced-options-dropdown__value { + background: $win95-bg; +} + +.privacy-dropdown.active .privacy-dropdown__value.active .icon-button { + color: $win95-dark-grey; +} + +.privacy-dropdown.active +.privacy-dropdown__value { + background: $win95-bg; + box-shadow:unset; +} + +.privacy-dropdown__option.active, .privacy-dropdown__option:hover, +.privacy-dropdown__option.active:hover { + background:$win95-window-header; +} + +.privacy-dropdown__dropdown, +.privacy-dropdown.active .privacy-dropdown__dropdown, +.advanced-options-dropdown__dropdown, +.advanced-options-dropdown.open .advanced-options-dropdown__dropdown +{ + box-shadow:unset; + color:black; + @include win95-outset(); + background: $win95-bg; +} + +.privacy-dropdown__option__content { + color:black; +} + +.privacy-dropdown__option__content strong { + font-weight:bold; +} + +.compose-form { + .compose-form__warning::before { + content:"Tip:"; + font-weight:bold; + display:block; + position:absolute; + top:-10px; + background-color:$win95-bg; + font-size:11px; + padding: 0px 5px; + } + + .compose-form__warning { + position:relative; + box-shadow:unset; + border:2px groove $win95-bg; + background-color:$win95-bg; + color:black; + } + + .compose-form__warning a { + color:blue; + } + + .compose-form__warning strong { + color:black; + text-decoration:underline; + } +} + +.compose-form__buttons button.active:last-child { + @include win95-border-inset(); + background: #dfdfdf; + color:#7f7f7f; +} + +.compose-form__upload-thumbnail { + border-radius:0px; + border:2px groove $win95-bg; + background-color:$win95-bg; + padding:2px; + box-sizing:border-box; +} + +.compose-form__upload-thumbnail .icon-button { + max-width:20px; + max-height:20px; + line-height:10px !important; +} + +.compose-form__upload-thumbnail .icon-button::before { + content:"X"; + font-size:13px; + font-weight:bold; + color:black; +} + +.compose-form__upload-thumbnail .icon-button i { + display:none; +} + +.emoji-picker-dropdown__menu { + z-index:2; +} + +.emoji-dialog.with-search { + box-shadow:unset; + border-radius:0px; + background-color:$win95-bg; + border:1px solid black; + box-sizing:content-box; + +} + +.emoji-dialog .emoji-search { + color:black; + background-color:white; + border-radius:0px; + @include win95-inset(); +} + +.emoji-dialog .emoji-search-wrapper { + border-bottom:2px groove $win95-bg; +} + +.emoji-dialog .emoji-category-title { + color:black; + font-weight:bold; +} + +.reply-indicator { + background-color:$win95-bg; + border-radius:3px; + border:2px groove $win95-bg; +} + +.button { + background-color:$win95-bg; + @include win95-outset(); + border-radius:0px; + color:black; + font-weight:bold; + + &:hover, &:focus, &:disabled { + background-color:$win95-bg; + } + + &:active { + @include win95-inset(); + } + + &:disabled { + color: #808080; + text-shadow: 1px 1px 0px #efefef; + + &:active { + @include win95-outset(); + } + } + +} + +.button.button-secondary { + background-color: $win95-bg; +} + +.column-link { + background-color:transparent; + color:black; + &:hover { + background-color: $win95-window-header; + color:white; + } +} + +.column-link__badge { + background-image: url('../images/alert_badge.png'); + background-repeat: no-repeat; + background-size:contain; + background-color:transparent; + border-radius:0; + box-sizing: border-box; + width: 24px; + height:24px; + padding-top:4px; + padding-left:0px; + padding-right:1px; + text-align:center; + position:relative; + top:2px; +} + +.column-link:hover .column-link__badge { + color:black; +} + +.column-subheading { + background-color:$win95-bg; + color:black; + @include win95-border-outset-sides-only; +} + +.column { + overflow-y:auto; +} + +.getting-started { + background: none; + position:relative; + top:-30px; + padding-top:30px; + z-index:10; + overflow-y:auto; + background-color: $win95-cyan; +} + +.getting-started__wrapper { + padding-top:0px; + + box-shadow: inset -1px 0px 0px #000000, + inset 1px 1px 0px #ffffff, + inset -2px 0px 0px #808080, + inset 2px 2px 0px #dfdfdf; + border-radius:0px; + + background-color:$win95-bg; + border-bottom: 2px groove $win95-bg; + + height: unset !important; + + .navigation-bar { + padding-left: 45px; + } + + .column-subheading { + font-size:0px; + margin:0px; + padding:0px; + background-color: transparent; + color:black; + border-bottom: 2px groove $win95-bg; + text-transform: none; + } + +} + +.column-link { + background-size:32px 32px; + background-repeat:no-repeat; + background-position: 36px 50%; + padding-left:45px; + + &:hover { + background-size:32px 32px; + background-repeat:no-repeat; + background-position: 36px 50%; + } + + i { + font-size: 0px; + width:32px; + } + } + +.getting-started__wrapper::before { + content: "Start"; + display:block; + color:black; + font-weight:bold; + font-size:15px; + position:absolute; + top:0px; + left:0px; + padding:5px 15px; + width:50px; + font-size:16px; + padding-left:25px; + background-color:$win95-bg; + z-index:12; + + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAIAAACpTQvdAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRBdXRob3IAAAiZS84oys9LzAEAC5oC6A7BY/IAAACWSURBVCiRhVJJDsQgDEuqOfRZ7a1P5gbP4uaJaEjTADMWQhHYjlk4p0wLnNdptdF4KvBUDyGzVwc2xO+uKtH+1o0ytEEmqFpuxlvFCGCxKbNIT56QCi2MzaA/2Mz+mERSOeqzJG2RUxkjdTabgPtFoZ1bZxcKvgPcLZVufAyR9Ni8v5dWDzfFx0giC1RvZFv6l35QQ/Mvv39XXgGzQpoAAAAASUVORK5CYII="); + background-repeat:no-repeat; + background-position:8%; + background-clip:padding-box; + background-size:auto 50%; + + @include win95-border-inset(); +} + + +@media screen and (min-width: 360px) { + .getting-started__wrapper{ + margin-bottom:0px; + } +} + +@media screen and (max-width: 360px) { + .getting-started { + top:0px; + padding-top:0px; + } + + .getting-started__wrapper::before { + display:none; + } +} + +.getting-started__footer { + background-color: $win95-bg; + padding:0px; + padding-bottom:10px; + position:relative; + top:0px; + + @include win95-outset-no-highlight(); + + p { + margin-left: 45px; + } + + ul { + display:block; + li { + cursor:pointer; + display:block; + font-size:0px; + padding:0px; + line-height:0; + a { + padding:15px; + padding-left:77px; + line-height:1em; + font-size:16px; + display:block; + color:black; + background-size:32px 32px; + background-repeat:no-repeat; + background-position: 36px 50%; + &:hover { + text-decoration:none; + } + } + + &:hover { + background-color: $win95-window-header; + a { + color:white; + } + } + } + } +} + +.getting-started__footer::after { + content:"Mastodon 95"; + font-weight:bold; + font-size:23px; + color:white; + line-height:30px; + padding-left:20px; + padding-right:40px; + + left:0px; + box-sizing:border-box; + bottom:-32px; + display:block; + position:absolute; + background-color:#7f7f7f; + width:1000px; + height:32px; + + z-index:11; + + border-left: 2px solid #404040; + border-top: 2px solid #efefef; + border-right: 2px solid #efefef; + border-radius:0px; + + -ms-transform: rotate(-90deg); + + -webkit-transform: rotate(-90deg); + transform: rotate(-90deg); + transform-origin:top left; +} + +.layout-single-column .getting-started__footer::after { + display: none; +} + +.getting-started__wrapper + .flex-spacer { + display:none; +} + +.column-link[href="/web/timelines/home"] { + background-image: url("../images/icon_home.png"); + &:hover { background-image: url("../images/icon_home.png"); } +} +.column-link[href="/web/notifications"] { + background-image: url("../images/icon_notifications.png"); + &:hover { background-image: url("../images/icon_notifications.png"); } +} +.column-link[href="/web/timelines/public"] { + background-image: url("../images/icon_public.png"); + &:hover { background-image: url("../images/icon_public.png"); } +} +.column-link[href="/web/timelines/public/local"] { + background-image: url("../images/icon_local.png"); + &:hover { background-image: url("../images/icon_local.png"); } +} +.column-link[href="/web/timelines/direct"] { + background-image: url("../images/icon_direct.png"); + &:hover { background-image: url("../images/icon_direct.png"); } +} +.column-link[href="/web/pinned"] { + background-image: url("../images/icon_pin.png"); + &:hover { background-image: url("../images/icon_pin.png"); } +} +.column-link[href="/web/favourites"] { + background-image: url("../images/icon_likes.png"); + &:hover { background-image: url("../images/icon_likes.png"); } +} +.column-link[href="/web/lists"] { + background-image: url("../images/icon_lists.png"); + &:hover { background-image: url("../images/icon_lists.png"); } +} +.column-link[href="/web/follow_requests"] { + background-image: url("../images/icon_follow_requests.png"); + &:hover { background-image: url("../images/icon_follow_requests.png"); } +} +.column-link[href="/web/blocks"] { + background-image: url("../images/icon_blocks.png"); + &:hover { background-image: url("../images/icon_blocks.png"); } +} +.column-link[href="/web/domain_blocks"] { + background-image: url("../images/icon_domain_blocks.png"); + &:hover { background-image: url("../images/icon_domain_blocks.png"); } +} +.column-link[href="/web/mutes"] { + background-image: url("../images/icon_mutes.png"); + &:hover { background-image: url("../images/icon_mutes.png"); } +} +.column-link[href="/web/directory"] { + background-image: url("../images/icon_profile_directory.png"); + &:hover { background-image: url("../images/icon_profile_directory.png"); } +} +.column-link[href="/web/bookmarks"] { + background-image: url("../images/icon_bookmarks.png"); + &:hover { background-image: url("../images/icon_bookmarks.png"); } +} + +.getting-started__footer ul li a[href="/web/keyboard-shortcuts"] { + background-image: url("../images/icon_keyboard_shortcuts.png"); + &:hover { background-image: url("../images/icon_keyboard_shortcuts.png"); } +} +.getting-started__footer ul li a[href="/invites"] { + background-image: url("../images/icon_invite.png"); + &:hover { background-image: url("../images/icon_invite.png"); } +} +.getting-started__footer ul li a[href="/terms"] { + background-image: url("../images/icon_tos.png"); + &:hover { background-image: url("../images/icon_tos.png"); } +} +.getting-started__footer ul li a[href="https://docs.joinmastodon.org"] { + background-image: url("../images/icon_docs.png"); + &:hover { background-image: url("../images/icon_docs.png"); } +} +.getting-started__footer ul li a[href="/about/more"] { + background-image: url("../images/icon_about.png"); + &:hover { background-image: url("../images/icon_about.png"); } +} +.getting-started__footer ul li a[href="/auth/sign_out"] { + background-image: url("../images/icon_logout.png"); + &:hover { background-image: url("../images/icon_logout.png"); } +} +.getting-started__footer ul li a[href="https://joinmastodon.org/apps"] { + background-image: url("../images/icon_mobile_apps.png"); + &:hover { background-image: url("../images/icon_mobile_apps.png"); } +} +.getting-started__footer ul li a[href="/settings/applications"] { + background-image: url("../images/icon_developers.png"); + &:hover { background-image: url("../images/icon_developers.png"); } +} +.getting-started__footer ul li a[href="/auth/edit"] { + background-image: url("../images/icon_settings.png"); + &:hover { background-image: url("../images/icon_settings.png"); } +} + +.column .static-content.getting-started { + display:none; +} + +.keyboard-shortcuts kbd { + background-color: $win95-bg; +} + +.account__header { + background-color:#7f7f7f; +} + +.account__header .account__header__content { + color:white; +} + +.account__header__fields { + border-left: 1px solid black; + border-top: 1px solid black; + + dt { + background-color:$win95-bg; + color:black; + border-top: 1px solid #ffffff; + border-bottom: 1px solid $win95-mid-grey; + border-right: 1px solid $win95-mid-grey; + } + dd { + background-color:white; + border: 1px solid $win95-bg; + color:black; + } + dd,dt { + padding: 5px 8px; + } +} + +.account-authorize__wrapper { + border: 2px groove $win95-bg; + margin: 2px; + padding:2px; +} + +.domain .domain__domain-name strong { + color: black; +} + +.account--panel { + background-color: $win95-bg; + border:0px; + border-top: 2px groove $win95-bg; +} + +.account-authorize .account__header__content { + color:black; + margin:10px; +} + +.account__action-bar__tab > span { + color:black; + font-weight:bold; +} + +.account__action-bar__tab strong { + color:black; +} + +.account__action-bar { + border: unset; +} + +.account__action-bar__tab { + border: 1px outset $win95-bg; +} + +.account__action-bar__tab:active { + @include win95-inset(); +} + +.account__section-headline { + background: $win95-bg; + margin-top: 5px; + + & > a { + @include win95-tab(); + color: black; + padding: 5px; + + &.active { + background: $win95-bg; + @include win95-inset(); + color: black; + + &:before, &:after { + display: none; + } + } + } +} + +.dropdown--active .dropdown__content > ul, +.dropdown-menu { + background:$win95-tooltip-yellow; + border-radius:0px; + border:1px solid black; + box-shadow:unset; + margin-top: 6px; +} + +.dropdown-menu a { + background-color:transparent; +} + +.dropdown-menu__arrow { + &.bottom { + border-bottom-color: $win95-tooltip-yellow; + } + + &.top { + border-top-color: $win95-tooltip-yellow; + } + + &:before { + position: relative; + border: 0 solid transparent; + display: block; + content: ''; + left: -8px; + z-index: -1; + } + + &.bottom::before { + border-bottom-color: black; + border-width: 0 8px 6px; + bottom: 1px; + } + + &.top::before { + border-top-color: black; + border-width: 6px 8px 0; + top: -5px; + } +} + +.dropdown-menu { + margin-top: 6px; +} + +.dropdown--active::after { + display:none; +} + +.dropdown--active .icon-button { + color:black; + @include win95-inset(); +} + +.dropdown--active .dropdown__content > ul > li > a { + background:transparent; +} + +.dropdown--active .dropdown__content > ul > li > a:hover { + background:transparent; + color:black; + text-decoration:underline; +} + +.dropdown__sep, +.dropdown-menu__separator +{ + border-color:#7f7f7f; +} + +.detailed-status__action-bar-dropdown .dropdown--active .dropdown__content.dropdown__left { + left: unset; +} + +.dropdown > .icon-button, .detailed-status__action-bar .icon-button, +.status__action-bar .icon-button, .star-icon i { + /* i don't know what's going on with the inline + styles someone should look at the react code */ + height: 25px !important; + width: 28px !important; + box-sizing: border-box; +} + +.icon-button { + height: auto!important; + width: auto!important; +} + +.status__action-bar-dropdown .icon-button { + position: relative; + top: -1px; +} + +.fa-user-plus, .fa-user-times { + padding: 2px 0px 2px 1px; +} + +.fa-ellipsis-h { + padding-top: 3px; +} + +.status__action-bar-button .fa-floppy-o { + padding-top: 2px; +} + +.notification .status__action-bar { + border-bottom: none; +} + +.notification .status { + margin-bottom: 4px; +} + +.status__wrapper .status { + margin-bottom: 3px; +} + +.status__wrapper { + margin-bottom: 8px; +} + +.status__prepend { + color: black; + font-size: 13px; +} + +.icon-button .fa-retweet { + position: relative; + top: -1px; +} + +.embed-modal, .error-modal, .onboarding-modal, +.actions-modal, .boost-modal, .confirmation-modal, .report-modal { + @include win95-outset(); + background:$win95-bg; +} + +.actions-modal::before, +.boost-modal::before, +.confirmation-modal::before, +.report-modal::before { + content: "Confirmation"; + display:block; + background:$win95-window-header; + color:white; + font-weight:bold; + padding-left:2px; +} + +.boost-modal::before { + content: "Boost confirmation"; +} + +.boost-modal__action-bar > div > span:before { + content: "Tip: "; + font-weight:bold; +} + +.boost-modal__action-bar, .confirmation-modal__action-bar, .report-modal__action-bar { + background:$win95-bg; + margin-top:-15px; +} + +.embed-modal h4, .error-modal h4, .onboarding-modal h4 { + background:$win95-window-header; + color:white; + font-weight:bold; + padding:2px; + font-size:13px; + text-align:left; +} + +.media-modal .media-modal__close { + font-size: 14px!important; + line-height: 17px!important; + margin-right: 4vw; + margin-top: 4vh; +} + +.confirmation-modal__action-bar { + .confirmation-modal__cancel-button { + color:black; + + &:active, + &:focus, + &:hover { + color:black; + } + + &:active { + @include win95-inset(); + } + } +} + +.embed-modal .embed-modal__container .embed-modal__html, +.embed-modal .embed-modal__container .embed-modal__html:focus { + background:white; + color:black; + @include win95-inset(); +} + +.report-modal__target .media-modal__close { + top: 3px; + right: 0px; + font-size: 12px!important; + line-height: 13px!important; +} + +.report-modal__comment p { + font-size: 12px; + margin-bottom: 1em; + padding-left: 3px; +} + +.report-modal__comment .setting-text.light { + border-radius: 0; +} + +.report-modal__container { + margin-right: 2px; +} + +.report-modal::before { + height: 22px; + line-height: 23px; +} + +.status-check-box__status .media-gallery { + margin: unset; +} + +.modal-root__overlay, +.account__header > div { + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAFnpUWHRUaXRsZQAACJnLzU9JzElKBwALgwLXaCRlPwAAABd6VFh0QXV0aG9yAAAImUvOKMrPS8wBAAuaAugOwWPyAAAAEUlEQVQImWNgYGD4z4AE/gMADwMB/414xEUAAAAASUVORK5CYII='); +} + + +.admin-wrapper::before { + position:absolute; + top:0px; + content:"Control Panel"; + color:white; + background-color:$win95-window-header; + font-size:13px; + font-weight:bold; + width:calc(100%); + margin: 2px; + display:block; + padding:2px; + padding-left:22px; + box-sizing:border-box; +} + +.admin-wrapper { + position:relative; + background: $win95-bg; + @include win95-outset(); + width:70vw; + height:80vh; + min-height:80vh; + margin:10vh auto; + color: black; + padding-top:24px; + flex-direction:column; + overflow:hidden; +} + +@media screen and (max-width: 1120px) { + .admin-wrapper { + width:90vw; + height:95vh; + margin:2.5vh auto; + } +} + +@media screen and (max-width: 740px) { + .admin-wrapper { + width:100vw; + height:95vh; + height:calc(100vh - 24px); + margin:0px 0px 0px 0px; + } +} + +.admin-wrapper .sidebar-wrapper { + position:static; + height:auto; + min-height:auto; + flex: 0 0 auto; + margin:2px; +} + +.admin-wrapper .content-wrapper { + flex: 1 1 auto; + width:calc(100% - 20px); + max-width:calc(100% - 20px); + @include win95-border-outset(); + position:relative; + margin-left:10px; + margin-right:10px; + margin-bottom:40px; + box-sizing:border-box; + overflow-y:scroll; + height: 100%; +} + +.admin-wrapper .content { + background-color: $win95-bg; + width: 100%; + max-width:100%; + min-height:100%; + box-sizing:border-box; + position:relative; +} +.admin-wrapper .content h4 { + color: black; +} + +.admin-wrapper .sidebar { + position:static; + background: $win95-bg; + color:black; + width: 100%; + height:auto; + padding-bottom: 20px; +} + +.admin-wrapper .sidebar .logo { + position:absolute; + top:2px; + left:4px; + width:18px; + height:18px; + margin:0px; +} + +.admin-wrapper .sidebar > ul { + background: $win95-bg; + margin:0px; + margin-left:8px; + color:black; + + & > li { + display:inline-block; + + &#settings, + &#admin { + padding:2px; + border: 0px solid transparent; + } + + &#logout { + position:absolute; + @include win95-outset(); + right:12px; + bottom:10px; + } + + &#web { + display:inline-block; + @include win95-outset(); + position:absolute; + left: 12px; + bottom: 10px; + } + + & > a { + display:inline-block; + @include win95-tab(); + padding:2px 5px; + margin:0px; + color:black; + vertical-align:baseline; + + &.selected { + background: $win95-bg; + color:black; + padding-top: 4px; + padding-bottom:4px; + } + + &:hover { + background: $win95-bg; + color:black; + } + } + + & > ul { + width:calc(100% - 20px); + background: transparent; + position:absolute; + left: 10px; + top:54px; + z-index:3; + + & > li { + background: $win95-bg; + display: inline-block; + vertical-align:baseline; + + & > a { + background: $win95-bg; + @include win95-tab(); + color:black; + padding:2px 5px; + position:relative; + z-index:3; + + &.selected { + background: $win95-bg; + color:black; + padding-bottom:4px; + padding-top: 4px; + padding-right:7px; + margin-left:-2px; + margin-right:-2px; + position:relative; + z-index:4; + + &:first-child { + margin-left:0px; + } + + &:hover { + background: transparent; + color:black; + } + } + + &:hover { + background: $win95-bg; + color:black; + } + } + } + } + } +} + +.admin-wrapper .sidebar ul .simple-navigation-active-leaf a:hover { + background: $win95-bg; +} + +@media screen and (max-width: 1520px) { + .admin-wrapper .sidebar > ul > li > ul { + max-width:1000px; + } + + .admin-wrapper .sidebar { + padding-bottom: 45px; + } +} + +@media screen and (max-width: 600px) { + .admin-wrapper .sidebar > ul > li > ul { + max-width:500px; + } + + .admin-wrapper { + .sidebar { + padding:0px; + padding-bottom: 70px; + width: 100%; + height: auto; + } + .content-wrapper { + overflow:auto; + height:80%; + height:calc(100% - 150px); + } + } +} + +.flash-message { + background-color:$win95-tooltip-yellow; + color:black; + border:1px solid black; + border-radius:0px; + position:absolute; + top:0px; + left:0px; + width:100%; +} + +.admin-wrapper table { + background-color: white; + @include win95-border-slight-inset(); +} + +.admin-wrapper .table th, .table td { + background-color:transparent; +} + +.admin-wrapper button.table-action-link, +.admin-wrapper a.table-action-link, +.admin-wrapper button.table-action-link:hover, +.admin-wrapper a.table-action-link:hover, +.admin-wrapper a.name-tag, +.admin-wrapper .name-tag, +.admin-wrapper a.inline-name-tag, +.admin-wrapper .inline-name-tag, +.admin-wrapper .content h2, +.admin-wrapper .content h3, +.simple_form .input.with_label .label_input > label, +.admin-wrapper .content h6, +.admin-wrapper .content > p, +.admin-wrapper .content .muted-hint, +.simple_form span.hint, +.simple_form h4, +.simple_form .check_boxes .checkbox label, +.simple_form .input.with_label.boolean .label_input > label, +.filters .filter-subset a, +.simple_form .input.radio_buttons .radio label, +a.table-action-link, +a.table-action-link:hover, +.simple_form .input.with_block_label > label, +.simple_form p.hint, +.admin-wrapper .content > p strong, +.simple_form .input.with_floating_label .label_input > label, +.admin-wrapper .content .fields-group h6 { + color:black; +} + +.report-card { + background: white; + border: 1px solid black; + border-radius: 0px; +} + +.report-card__summary__item:hover { + background: white; +} + +.report-card__summary__item__content a { + color: black; +} + +.directory__tag > a, .directory__tag > div, +.directory__tag > a:hover, .directory__tag > a:active, .directory__tag > a:focus { + background: white; + border: 1px solid black; + border-radius: 0px; +} + +.admin-wrapper .content .directory__tag h4 { + color: black; +} + +.simple_form .hint code { + background: $win95-bg; + border-radius: 0px; +} + +.input-copy { + background: transparent; + border: 0px solid transparent; +} + +.table > tbody > tr:nth-child(2n+1) > td, +.table > tbody > tr:nth-child(2n+1) > th { + background-color:white; +} + +.simple_form input[type=text], +.simple_form input[type=number], +.simple_form input[type=email], +.simple_form input[type=password], +.simple_form textarea { + color:black; + background-color:white; + @include win95-border-slight-inset(); + + &:active, &:focus { + background-color:white; + } +} + +.simple_form button, +.simple_form .button, +.simple_form .block-button +{ + background: $win95-bg; + @include win95-outset(); + color:black; + font-weight: normal; + + &:hover { + background: $win95-bg; + } +} + +.simple_form .warning, .table-form .warning +{ + background: $win95-tooltip-yellow; + color:black; + box-shadow: unset; + text-shadow:unset; + border:1px solid black; + + a { + color: blue; + text-decoration:underline; + } +} + +.simple_form button.negative, +.simple_form .button.negative, +.simple_form .block-button.negative +{ + background: $win95-bg; +} + +.simple_form select { + background: white; + border-radius: 0px; + color: black; +} + +.filters .filter-subset { + border: 2px groove $win95-bg; + padding:2px; +} + +.filters .filter-subset a::before { + content: ""; + background-color:white; + border-radius:50%; + border:2px solid black; + border-top-color:#7f7f7f; + border-left-color:#7f7f7f; + border-bottom-color:#f5f5f5; + border-right-color:#f5f5f5; + width:12px; + height:12px; + display:inline-block; + vertical-align:middle; + margin-right:2px; +} + +.filters .filter-subset a.selected::before { + background-color:black; + box-shadow: inset 0 0 0 3px white; +} + +.filters .filter-subset a, +.filters .filter-subset a:hover, +.filters .filter-subset a.selected { + color:black; + border-bottom: 0px solid transparent; +} + +.drawer__inner__mastodon { + display: none; +} + +.list-editor h4 { + padding: 2px; + color: white; + font-size: 14px; + font-weight: bold; + background: #00007f; + border-radius: 0; +} + +.list-editor { + @include win95-border-outset(); + box-shadow: unset; +} + +.list-editor .drawer__inner { + @include win95-inset(); + border-radius: 0; +} + +.batch-table__toolbar { + border-radius: 0px; + background-color:white; + border: 1px solid black; +} + +.batch-table__row { + border: 1px solid black; + background-color: white; + + &:hover { + background-color: white; + } +} + +.batch-table__row:nth-child(2n) { + background-color: white; +} + +.dashboard__counters > div > div, +.dashboard__counters > div > a { + background-color: $win95-bg; + border: 1px solid black; + border-radius: 1px; + color:black; + + &:hover { + background-color: $win95-bg; + } +} + +.dashboard__counters__label, +.dashboard__widgets a:not(.name-tag), +.dashboard__counters__num { + color:black; +} + +.card { + & > a, & > a:hover { + box-shadow: none; + + .card__img { + border-radius: 0px; + border: 1px solid black; + } + + .card__bar { + @include win95-outset(); + background-color: $win95-bg; + + .display-name { + strong, span { + color:black; + } + } + } + } +} + +/* Public layout stuff */ +body { + background: $win95-cyan; +} + +.public-layout { + max-width: 960px; + margin:10px auto; + background: $win95-bg; + padding:0px; + @include win95-outset(); + + .header { + background: $win95-window-header; + @include win95-border-outset(); + height: 22px; + margin: 0px; + padding:0px; + border-radius: 0px; + + .brand { + padding: 2px; + } + + .nav-button { + @include win95-outset(); + background: $win95-bg; + color:black; + margin: 2px; + margin-bottom: 0px; + &:hover { + background: $win95-bg; + color:black; + } + } + } + .footer { + background: none; + &, h4, ul a, .grid .column-2 h4 a { + color: black; + } + } + + .button.logo-button { + @include win95-outset(); + background: $win95-bg; + color:black; + &:hover { + background: $win95-bg; + color:black; + } + svg { + visibility:hidden; + } + &, &:hover { + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAIAAACpTQvdAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRBdXRob3IAAAiZS84oys9LzAEAC5oC6A7BY/IAAACWSURBVCiRhVJJDsQgDEuqOfRZ7a1P5gbP4uaJaEjTADMWQhHYjlk4p0wLnNdptdF4KvBUDyGzVwc2xO+uKtH+1o0ytEEmqFpuxlvFCGCxKbNIT56QCi2MzaA/2Mz+mERSOeqzJG2RUxkjdTabgPtFoZ1bZxcKvgPcLZVufAyR9Ni8v5dWDzfFx0giC1RvZFv6l35QQ/Mvv39XXgGzQpoAAAAASUVORK5CYII="); + background-repeat:no-repeat; + background-position:8%; + background-clip:padding-box; + background-size:auto 50%; + } + } + + .public-account-header { + @include win95-reset(); + padding: 4px; + .public-account-header__image { + @include win95-border-slight-inset(); + border-radius: 0px; + } + } + + .public-account-header__bar { + &, &:before { + background: transparent; + } + .avatar img { + @include win95-border-slight-inset(); + filter: saturate(1.8) brightness(1.1); + border-radius: 0px; + background: darken($win95-bg, 9.09%); + } + } + .public-account-header__extra__links { + margin-top: 0px; + a, a strong { + color: black; + } + } + + .public-account-header__tabs { + position: relative; + } + + .public-account-header__tabs__name { + display: inline-block; + position: relative; + background: $win95-tooltip-yellow; + border: 1px solid black; + padding: 4px; + + h1, h1 small { + color:black; + text-shadow: unset; + text-overflow: unset; + } + + margin-bottom: 24px; + + &:after { + content: ""; + display:block; + position:absolute; + left: 0px; + bottom: -20px; + width: 0px; + height: 0px; + border-left: 20px solid $win95-tooltip-yellow; + border-bottom: 20px solid transparent; + } + &:before { + content: ""; + display:block; + position:absolute; + left: -1px; + bottom: -22px; + width: 0px; + height: 0px; + border-left: 22px solid black; + border-bottom: 22px solid transparent; + } + } + + .public-account-header__tabs__tabs { + .details-counters { + @include win95-border-groove(); + .counter { + .counter-number, .counter-label { + color: black; + } + &:after { + border-bottom-width: 0px; + } + &.active { + @include win95-border-slight-inset(); + } + } + } + } + + .public-account-bio { + @include win95-reset(); + @include win95-border-groove(); + background: $win95-bg; + margin-right: 10px; + .account__header__content, .roles { + color: black; + } + } + .public-account-bio__extra { + color: black; + } + + .status__prepend { + padding-top:5px; + } + .status__content , + .reply-indicator__content { + .status__content__spoiler-link { + color: $win95-dark-grey; + } + } + .account__section-headline { + margin-left: 10px; + } + .card-grid { + margin-left: 10px; + } + .status { + padding: 15px 15px 55px 78px; + } +} + +@media screen and (max-width: 1255px) { + .container { + width: 100%; + padding: 0px; + } +} + +.hero-widget { + box-shadow: none; + @include win95-border-groove(); + background: $win95-bg; + padding: 8px; + margin-right: 10px; + margin-top: 10px; +} +.hero-widget__text { + background: none; + color: black; +} +.hero-widget__img { + background: none; + border-radius: 0px; + border: 1px solid black; + img { + border-radius: 0px; + } +} + +.activity-stream { + @include win95-reset(); + @include win95-border-groove(); + + background: $win95-bg; + margin-top: 10px; + margin-left: 10px; + .entry { + background: none; + &:first-child:last-child, &:first-child { + .detailed-status, .status, .load-more { + border-radius: 0px; + } + } + } +} + +.nothing-here { + @include win95-reset(); + background: transparent; + color: black; +} + +.flash-message.notice { + border: 1px solid black; + background: $win95-tooltip-yellow; + color:black; +} + +.layout-single-column .compose-panel { + background: $win95-bg; +} + +.layout-single-column .status__wrapper .status { + padding-bottom: 50px; +} + +::-webkit-scrollbar { + width: 14px; +} + +::-webkit-scrollbar-track { + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAAAAABX3VL4AAAADklEQVQIW2P4f4DhwH8ACoADf0PlskQAAAAASUVORK5CYII='); + + &:hover { + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAAAAABX3VL4AAAADklEQVQIW2P4f4DhwH8ACoADf0PlskQAAAAASUVORK5CYII='); + } +} + +::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-color: #efefef #404040 #404040 #efefef; + border-style: solid; + border-width: 2px; + + &:hover { + background: #bfbfbf; + border-color: #efefef #404040 #404040 #efefef; + border-style: solid; + border-width: 2px; + } + + &:active { + background: #bfbfbf; + border-color: #404040 #efefef #efefef #404040; + } +} |
