FIX: conflicting class declaration with core (#4)
* DEV: Remove `fade-in` and use `jsuites.basic.css` instead * FIX: Linting issues with jspreadsheet-theme * WIP: Add bash script to handle vendor assets * FIX: Ember Linting fixes * DEV: Cleanup comments and commented code
This commit is contained in:
Keegan George
GitHub
parent
12e09ebad6
commit
52710496ed
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"extends": "eslint-config-discourse",
|
||||
"ignorePatterns": ["javascripts/vendor/*"],
|
||||
"ignorePatterns": ["javascripts/vendor/*", "assets/vendor/*"],
|
||||
"globals": {
|
||||
"settings": "readonly",
|
||||
"themePrefix": "readonly"
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
"minimum_discourse_version": null,
|
||||
"maximum_discourse_version": null,
|
||||
"assets": {
|
||||
"jsuites": "assets/jsuites.js",
|
||||
"jspreadsheet": "assets/jspreadsheet.js"
|
||||
"jsuites": "assets/vendor/jsuites.js",
|
||||
"jspreadsheet": "assets/vendor/jspreadsheet.js"
|
||||
},
|
||||
"modifiers": {
|
||||
"svg_icons": [
|
||||
|
|
|
|||
16861
assets/jspreadsheet.js
16861
assets/jspreadsheet.js
File diff suppressed because it is too large
Load Diff
13312
assets/jsuites.js
13312
assets/jsuites.js
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,88 @@
|
|||
#!/bin/bash
|
||||
|
||||
# Global Variables:
|
||||
SCSS_VENDOR=scss/vendor/
|
||||
JS_VENDOR=assets/vendor/
|
||||
|
||||
JSUITES_JS_URL="https://jsuites.net/v4/jsuites.js"
|
||||
JSPREADSHEET_JS_URL="https://bossanova.uk/jspreadsheet/v4/jexcel.js"
|
||||
|
||||
JSUITES_CSS_URL="https://raw.githubusercontent.com/jsuites/jsuites/master/dist/jsuites.basic.css"
|
||||
JSPREADSHEET_CSS_URL="https://bossanova.uk/jspreadsheet/v4/jexcel.css"
|
||||
|
||||
JSUITES_CSS_FILE=jsuites.basic.css
|
||||
JSUITES_SCSS_FILE=jsuites.scss
|
||||
JSUITES_SCSS_FILE_LOCATION=$SCSS_VENDOR$JSUITES_SCSS_FILE
|
||||
|
||||
JSUITES_JS_FILE=jsuites.js
|
||||
JSUITES_NEW_JS_FILE=jsuites.js
|
||||
JSUITES_JS_FILE_LOCATION=$JS_VENDOR$JSUITES_NEW_JS_FILE
|
||||
|
||||
JSPREADSHEET_CSS_FILE=jexcel.css
|
||||
JSPREADSHEET_SCSS_FILE=jspreadsheet.scss
|
||||
JSPREADSHEET_SCSS_FILE_LOCATION=$SCSS_VENDOR$JSPREADSHEET_SCSS_FILE
|
||||
|
||||
JSPREADSHEET_JS_FILE=jexcel.js
|
||||
JSPREADSHEET_NEW_JS_FILE=jspreadsheet.js
|
||||
JSPREADSHEET_JS_FILE_LOCATION=$JS_VENDOR$JSPREADSHEET_NEW_JS_FILE
|
||||
|
||||
|
||||
|
||||
|
||||
# Remove all vendor related files:
|
||||
rm -r ${SCSS_VENDOR}*
|
||||
rm -r ${JS_VENDOR}
|
||||
|
||||
# Recreate vendor directory
|
||||
mkdir $JS_VENDOR
|
||||
echo "Old vendor assets have been removed."
|
||||
|
||||
|
||||
# STYLESHEETS:
|
||||
# Add JSuite vendor file
|
||||
if test -f "$JSUITES_CSS_FILE"; then
|
||||
echo "$JSUITES_CSS_FILE already exists."
|
||||
else
|
||||
# Fetch jsuite stylesheet
|
||||
wget $JSUITES_CSS_URL
|
||||
echo "$JSUITES_CSS_FILE has been created in $(pwd)"
|
||||
# Move jsuite stylesheet to vendor as a scss file
|
||||
mv $JSUITES_CSS_FILE $JSUITES_SCSS_FILE_LOCATION
|
||||
echo "$JSUITES_SCSS_FILE has been placed in the scss vendor directory"
|
||||
# Scope styles to jexcel_container class
|
||||
sed -i '' '1s/^/.jexcel_container {\n/' $JSUITES_SCSS_FILE_LOCATION
|
||||
sed -i '' '$a\
|
||||
}' $JSUITES_SCSS_FILE_LOCATION
|
||||
|
||||
# Remove conflicting animation classes
|
||||
# TODO: Improve below code to handle nested code blocks
|
||||
fi
|
||||
|
||||
# Add JSpreadsheet vendor file
|
||||
if test -f "$JSPREADSHEET_CSS_FILE"; then
|
||||
echo "$JSPREADSHEET_CSS_FILE already exists."
|
||||
else
|
||||
# Fetch jspreadsheet stylesheet
|
||||
wget $JSPREADSHEET_CSS_URL
|
||||
echo "$JSPREADSHEET_CSS_FILE has been created in $(pwd)"
|
||||
# Move jspreadsheet stylesheet to vendor as a scss file
|
||||
mv $JSPREADSHEET_CSS_FILE $JSPREADSHEET_SCSS_FILE_LOCATION
|
||||
fi
|
||||
|
||||
# Apply prettier to vendor files
|
||||
yarn prettier --write $SCSS_VENDOR
|
||||
|
||||
# JAVASCRIPTS:
|
||||
if test -f "$JSUITES_JS_FILE"; then
|
||||
echo "$JSUITES_JS_FILE already exists."
|
||||
else
|
||||
wget $JSUITES_JS_URL
|
||||
mv $JSUITES_JS_FILE $JSUITES_JS_FILE_LOCATION
|
||||
fi
|
||||
|
||||
if test -f "$JSPREADSHEET_JS_FILE"; then
|
||||
echo "$JSPREADSHEET_JS_FILE already exists."
|
||||
else
|
||||
wget $JSPREADSHEET_JS_URL
|
||||
mv $JSPREADSHEET_JS_FILE $JSPREADSHEET_JS_FILE_LOCATION
|
||||
fi
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
@import "vendor/jspreadsheet";
|
||||
@import "vendor/jspreadsheet-datatables";
|
||||
@import "vendor/jspreadsheet-theme";
|
||||
@import "vendor/jsuites";
|
||||
@import "theme/jspreadsheet-theme";
|
||||
@import "post/table-edit-decorator";
|
||||
@import "modal/insert-table-modal";
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import { iconNode } from "discourse-common/lib/icon-library";
|
|||
import { create } from "virtual-dom";
|
||||
import { ajax } from "discourse/lib/ajax";
|
||||
import { popupAjaxError } from "discourse/lib/ajax-error";
|
||||
|
||||
export default apiInitializer("0.11.1", (api) => {
|
||||
const site = api.container.lookup("site:main");
|
||||
const currentUser = api.getCurrentUser();
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import { popupAjaxError } from "discourse/lib/ajax-error";
|
|||
import I18n from "I18n";
|
||||
import { schedule } from "@ember/runloop";
|
||||
import { tracked } from "@glimmer/tracking";
|
||||
|
||||
export default class SpreadsheetEditor extends GlimmerComponent {
|
||||
@tracked showEditReason = false;
|
||||
spreadsheet = null;
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,9 +1,13 @@
|
|||
{
|
||||
"name": "discourse-table-builder",
|
||||
"description": "Create and edit markdown tables using a spreadsheet editor.",
|
||||
"version": "0.0.1",
|
||||
"repository": "https://github.com/keegangeorge/discourse-table-builder",
|
||||
"author": "Keegan George",
|
||||
"license": "GPL-2.0-or-later",
|
||||
"scripts": {
|
||||
"build": "bash ./build.bash"
|
||||
},
|
||||
"devDependencies": {
|
||||
"eslint-config-discourse": "latest"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,6 +27,21 @@
|
|||
background-color: transparent;
|
||||
}
|
||||
|
||||
table.jexcel > thead > tr > td {
|
||||
border-top: 1px solid transparent;
|
||||
border-left: 1px solid transparent;
|
||||
border-right: 1px solid transparent;
|
||||
border-bottom: 1px solid #000;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
table.jexcel > tbody > tr > td {
|
||||
padding: 8px;
|
||||
border-right: 1px solid transparent;
|
||||
border-left: 1px solid transparent;
|
||||
}
|
||||
|
||||
table.jexcel {
|
||||
border-bottom: 1px solid var(--jexcel_border_color);
|
||||
}
|
||||
|
|
@ -1,85 +0,0 @@
|
|||
table.jexcel {
|
||||
border-right: 1px solid transparent;
|
||||
}
|
||||
|
||||
table.jexcel > thead {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
table.jexcel > thead > tr > td {
|
||||
border-top: 1px solid transparent;
|
||||
border-left: 1px solid transparent;
|
||||
border-right: 1px solid transparent;
|
||||
border-bottom: 1px solid #000;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
table.jexcel > thead > tr > td.selected {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
table.jexcel > tbody > tr > td {
|
||||
padding: 8px;
|
||||
border-right: 1px solid transparent;
|
||||
border-left: 1px solid transparent;
|
||||
}
|
||||
|
||||
table.jexcel > tbody > tr > td:first-child {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
table.jexcel > tbody > tr.selected > td:first-child {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.jexcel_toolbar {
|
||||
background-color: transparent;
|
||||
border: 0px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
border-top: 1px solid #ccc;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.jexcel_pagination > div > div {
|
||||
border: 1px solid transparent;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.jexcel_page_selected {
|
||||
background: linear-gradient(to bottom, #fff 0%, #dcdcdc 100%);
|
||||
border: 1px solid #979797 !important;
|
||||
font-weight: normal;
|
||||
color: #333 !important;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
/*.jexcel > div > table > tbody > tr,
|
||||
.jexcel > div > table > thead
|
||||
{
|
||||
border-left:1px solid transparent;
|
||||
}
|
||||
.jexcel > div > table > tbody > tr > td
|
||||
{
|
||||
padding:10px;
|
||||
border-right:1px solid transparent;
|
||||
}
|
||||
.jexcel > div > table > tbody > td.edition
|
||||
{
|
||||
padding:0px;
|
||||
padding-left:4px;
|
||||
}
|
||||
.jexcel > div > table > tbody > tr > td:first-child
|
||||
{
|
||||
background-color:#fff;
|
||||
font-weight:bold;
|
||||
}
|
||||
.jexcel > div > table > tbody > tr.selected > td:first-child
|
||||
{
|
||||
background-color:#eee;
|
||||
}
|
||||
.jexcel > div > table > thead > tr > td.selected
|
||||
{
|
||||
background-color:#eee;
|
||||
}*/
|
||||
|
|
@ -410,6 +410,7 @@
|
|||
-khtml-user-drag: none;
|
||||
-moz-user-drag: none;
|
||||
-o-user-drag: none;
|
||||
user-drag: none;
|
||||
}
|
||||
|
||||
.jexcel_textarea {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
.jexcel_container {
|
||||
/**
|
||||
* (c) jSuites Javascript Web Components
|
||||
*
|
||||
|
|
@ -602,7 +603,7 @@ div[data-before]:before {
|
|||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
|
||||
-webkit-flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
|
@ -1145,6 +1146,9 @@ div[data-before]:before {
|
|||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.jdropdown-content:empty {
|
||||
}
|
||||
|
||||
.jdropdown-item {
|
||||
white-space: nowrap;
|
||||
text-align: left;
|
||||
|
|
@ -1468,6 +1472,9 @@ div[data-before]:before {
|
|||
|
||||
/** List render **/
|
||||
|
||||
.jdropdown-list {
|
||||
}
|
||||
|
||||
.jdropdown-list .jdropdown-container {
|
||||
display: block;
|
||||
}
|
||||
|
|
@ -1714,120 +1721,6 @@ div[data-before]:before {
|
|||
border-top-color: transparent;
|
||||
}
|
||||
|
||||
.jmodal {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 60%;
|
||||
height: 60%;
|
||||
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
|
||||
-webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
|
||||
-moz-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
|
||||
border: 1px solid #ccc;
|
||||
background-color: #fff;
|
||||
transform: translate(-50%, -50%);
|
||||
box-sizing: border-box;
|
||||
padding-top: 50px !important;
|
||||
z-index: 9002;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.jmodal:before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
content: attr(title);
|
||||
padding: 25px;
|
||||
padding-bottom: 20px;
|
||||
box-sizing: border-box;
|
||||
font-size: 1.4em;
|
||||
background-color: #fff;
|
||||
border-radius: 8px 8px 0px 0px;
|
||||
}
|
||||
|
||||
.jmodal_content {
|
||||
padding: 22px;
|
||||
overflow-y: auto;
|
||||
max-height: 100%;
|
||||
box-sizing: border-box;
|
||||
height: -webkit-fill-available;
|
||||
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #333 transparent;
|
||||
}
|
||||
|
||||
.jmodal_content::-webkit-scrollbar {
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.jmodal_content::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.jmodal_content::-webkit-scrollbar-track {
|
||||
border: 1px solid #fff;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.jmodal_content::-webkit-scrollbar-thumb {
|
||||
border: 1px solid #fff;
|
||||
background: #888;
|
||||
}
|
||||
|
||||
.jmodal.no-title {
|
||||
padding-top: initial !important;
|
||||
}
|
||||
|
||||
.jmodal.no-title:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.jmodal:after {
|
||||
content: "";
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
margin: 25px;
|
||||
font-size: 24px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
text-shadow: 0px 0px 5px #fff;
|
||||
}
|
||||
|
||||
.jmodal_fullscreen {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
transform: none;
|
||||
border: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
.jmodal_backdrop {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border: 0px;
|
||||
padding: 0px;
|
||||
z-index: 8000;
|
||||
display: none;
|
||||
|
||||
-webkit-touch-callout: none; /* iOS Safari */
|
||||
-webkit-user-select: none; /* Safari */
|
||||
-khtml-user-select: none; /* Konqueror HTML */
|
||||
-moz-user-select: none; /* Firefox */
|
||||
-ms-user-select: none; /* Internet Explorer/Edge */
|
||||
user-select: none; /* Non-prefixed version, currently
|
||||
supported by Chrome and Opera */
|
||||
}
|
||||
|
||||
.jnotification {
|
||||
position: fixed;
|
||||
z-index: 10000;
|
||||
|
|
@ -1980,8 +1873,8 @@ div[data-before]:before {
|
|||
position: absolute;
|
||||
top: 0;
|
||||
display: none;
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
|
||||
0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
|
||||
0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
padding: 4px;
|
||||
|
|
@ -2033,46 +1926,6 @@ div[data-before]:before {
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.jprogressbar {
|
||||
cursor: pointer;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
border: 1px solid #ccc;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.jprogressbar::before {
|
||||
content: attr(data-value);
|
||||
position: absolute;
|
||||
margin: 5px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.jprogressbar-header::placeholder {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.jprogressbar::focus {
|
||||
outline: auto 5px -webkit-focus-ring-color;
|
||||
}
|
||||
|
||||
.jprogressbar > div {
|
||||
background-color: #eee;
|
||||
background-color: red;
|
||||
box-sizing: border-box;
|
||||
height: 31px;
|
||||
}
|
||||
|
||||
.jrating {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -2092,357 +1945,6 @@ div[data-before]:before {
|
|||
background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='red'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
.jsearch {
|
||||
position: relative;
|
||||
display: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.jsearch_container {
|
||||
position: absolute;
|
||||
box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.302),
|
||||
0 2px 6px 2px rgba(60, 64, 67, 0.149);
|
||||
border: none;
|
||||
-webkit-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
width: 280px;
|
||||
padding: 8px 0;
|
||||
|
||||
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
||||
-webkit-transition: opacity 0.218s;
|
||||
transition: opacity 0.218s;
|
||||
background: #fff;
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
min-width: 300px;
|
||||
outline: none;
|
||||
width: auto;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.jsearch_container:empty:after {
|
||||
content: attr(data-placeholder);
|
||||
}
|
||||
|
||||
.jsearch_container > div {
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
padding: 5px 10px;
|
||||
user-select: none;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.jsearch_container > div:hover {
|
||||
background-color: #e8eaed;
|
||||
}
|
||||
|
||||
.jsearch_container > div > img {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
user-select: none;
|
||||
border-radius: 16px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.jsearch_container > div > div {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
margin-left: 2px;
|
||||
max-width: 300px;
|
||||
white-space: nowrap;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.jsearch_container .selected {
|
||||
background-color: #e8eaed;
|
||||
}
|
||||
|
||||
.jslider {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.jslider-focus {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
.jslider-focus img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.jslider img {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.jslider-left::before {
|
||||
position: fixed;
|
||||
left: 15px;
|
||||
top: 50%;
|
||||
content: "arrow_back_ios";
|
||||
color: #fff;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Material Icons";
|
||||
font-size: 30px;
|
||||
/* before it was 0px 0px 0px #000 */
|
||||
text-shadow: 0px 0px 6px rgb(56, 56, 56);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.jslider-right::after {
|
||||
position: fixed;
|
||||
right: 15px;
|
||||
top: 50%;
|
||||
content: "arrow_forward_ios";
|
||||
color: #fff;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Material Icons";
|
||||
font-size: 30px;
|
||||
/* before it was 0px 0px 0px #000 */
|
||||
text-shadow: 0px 0px 6px rgb(56, 56, 56);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.jslider-close {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
|
||||
position: fixed;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
cursor: pointer;
|
||||
z-index: 3000;
|
||||
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.jslider-counter {
|
||||
height: 24px;
|
||||
background-color: transparent;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 15px;
|
||||
cursor: pointer;
|
||||
z-index: 3000;
|
||||
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
-webkit-justify-content: center;
|
||||
-webkit-align-items: center;
|
||||
-webkit-flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.jslider-caption {
|
||||
position: fixed;
|
||||
max-width: 90vw;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
z-index: 3000;
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.jslider-counter div {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
margin: 0px 5px;
|
||||
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.jslider-counter .jslider-counter-focus {
|
||||
background-color: cornflowerblue;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.jslider-focus {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
max-height: 100%;
|
||||
z-index: 2000;
|
||||
margin: 0px;
|
||||
box-sizing: border-box;
|
||||
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
-webkit-transition-duration: 0.05s;
|
||||
transition-duration: 0.05s;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.jslider-focus img {
|
||||
width: 50vw;
|
||||
height: auto;
|
||||
box-sizing: border-box;
|
||||
margin: 0 auto;
|
||||
vertical-align: middle;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.jslider-focus img.jslider-vertical {
|
||||
width: auto;
|
||||
/* before it was 50vh */
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 576px) {
|
||||
.jslider-focus img.jslider-vertical {
|
||||
width: 99vw !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.jslider-focus img {
|
||||
width: 100vw !important;
|
||||
height: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.jslider-grid {
|
||||
display: -ms-grid;
|
||||
display: grid;
|
||||
grid-gap: 1px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="2"] {
|
||||
-ms-grid-columns: 1fr 50%;
|
||||
grid-template-columns: 1fr 50%;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="3"] {
|
||||
-ms-grid-columns: 1fr 33%;
|
||||
grid-template-columns: 1fr 33%;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="4"] {
|
||||
-ms-grid-columns: 1fr 25%;
|
||||
grid-template-columns: 1fr 25%;
|
||||
}
|
||||
|
||||
.jslider-grid img {
|
||||
display: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.jslider-grid[data-total]:after {
|
||||
content: attr(data-total) "+";
|
||||
font-size: 1.5em;
|
||||
position: absolute;
|
||||
color: #fff;
|
||||
right: 15px;
|
||||
bottom: 6px;
|
||||
}
|
||||
|
||||
.jslider-grid img:first-child {
|
||||
-ms-grid-column: 1;
|
||||
-ms-grid-row: 1;
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="2"] img:nth-child(2) {
|
||||
-ms-grid-column: 2;
|
||||
-ms-grid-row: 1;
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="3"] img:first-child {
|
||||
-ms-grid-column: 1 / 2;
|
||||
-ms-grid-row: 1 / 4;
|
||||
grid-column: 1 / 2;
|
||||
grid-row: 1 / 4;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="3"] img:nth-child(2) {
|
||||
-ms-grid-column: 2;
|
||||
-ms-grid-row: 1;
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="3"] img:nth-child(3) {
|
||||
-ms-grid-column: 2;
|
||||
-ms-grid-row: 2;
|
||||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="4"] img:first-child {
|
||||
-ms-grid-column: 1 / 2;
|
||||
-ms-grid-row: 1 / 4;
|
||||
grid-column: 1 / 2;
|
||||
grid-row: 1 / 4;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="4"] img:nth-child(2) {
|
||||
-ms-grid-column: 2;
|
||||
-ms-grid-row: 1;
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="4"] img:nth-child(3) {
|
||||
-ms-grid-column: 2;
|
||||
-ms-grid-row: 2;
|
||||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jslider-grid[data-number="4"] img:nth-child(4) {
|
||||
-ms-grid-column: 2;
|
||||
-ms-grid-row: 3;
|
||||
grid-column: 2;
|
||||
grid-row: 3;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.jtabs {
|
||||
max-width: 100vw;
|
||||
position: relative;
|
||||
|
|
@ -2584,76 +2086,11 @@ div[data-before]:before {
|
|||
background-color: rgba(194, 197, 188, 0.884);
|
||||
}
|
||||
|
||||
.jtags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-pack: flex-start;
|
||||
-webkit-justify-content: space-between;
|
||||
justify-content: flex-start;
|
||||
padding: 2px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.jtags.jtags-empty:not(.jtags-focus)::before {
|
||||
position: absolute;
|
||||
margin: 5px;
|
||||
color: #ccc;
|
||||
content: attr(data-placeholder);
|
||||
}
|
||||
|
||||
.jtags > div {
|
||||
padding: 3px;
|
||||
padding-left: 10px;
|
||||
padding-right: 22px;
|
||||
position: relative;
|
||||
border-radius: 1px;
|
||||
margin: 2px;
|
||||
display: block;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.jtags > div:empty:before {
|
||||
content: " ";
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.jtags > div::after {
|
||||
content: "x";
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
cursor: pointer;
|
||||
font-size: 11px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.jtags_label {
|
||||
background-color: #eeeeee !important;
|
||||
}
|
||||
|
||||
.jtags_label::after {
|
||||
display: inline-block !important;
|
||||
}
|
||||
|
||||
.jtags_error::after {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.jtags_error {
|
||||
background-color: #d93025 !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.jtoolbar-container {
|
||||
border-radius: 2px;
|
||||
margin-bottom: 5px;
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
|
||||
0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
|
||||
0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
||||
display: inline-flex !important;
|
||||
}
|
||||
|
||||
|
|
@ -2827,8 +2264,8 @@ div[data-before]:before {
|
|||
.jtoolbar-floating {
|
||||
position: absolute;
|
||||
display: none;
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
|
||||
0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
|
||||
0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
padding: 4px;
|
||||
|
|
@ -2845,3 +2282,4 @@ div[data-before]:before {
|
|||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue