0
0
Fork 1
Spiegel von https://github.com/paviliondev/discourse-custom-wizard.git synchronisiert 2024-09-19 15:21:11 +02:00

Namespace CSS and remove uneccessary site attributes

Dieser Commit ist enthalten in:
Angus McLeod 2022-07-27 14:40:05 +01:00
Ursprung 60823cd87a
Commit 150afb29e0
22 geänderte Dateien mit 1335 neuen und 1504 gelöschten Zeilen

Datei anzeigen

@ -3,7 +3,7 @@ class CustomWizard::WizardController < ::ApplicationController
before_action :ensure_plugin_enabled
before_action :ensure_logged_in, only: [:skip]
def index
def show
if wizard.present?
render json: CustomWizard::WizardSerializer.new(wizard, scope: guardian, root: false).as_json, status: 200
else
@ -31,26 +31,8 @@ class CustomWizard::WizardController < ::ApplicationController
render json: result
end
def qunit
raise Discourse::InvalidAccess.new if Rails.env.production?
respond_to do |format|
format.html do
render "default/empty"
end
end
end
protected
def ensure_logged_in
raise Discourse::NotLoggedIn.new unless current_user.present?
end
def guardian
@guardian ||= Guardian.new(current_user, request)
end
def wizard
@wizard ||= begin
builder = CustomWizard::Builder.new(params[:wizard_id].underscore, current_user)
@ -61,41 +43,6 @@ class CustomWizard::WizardController < ::ApplicationController
end
end
def wizard_page_title
wizard ? (wizard.name || wizard.id) : I18n.t('wizard.custom_title')
end
def wizard_theme_id
wizard ? wizard.theme_id : nil
end
def wizard_theme_lookup(name)
Theme.lookup_field(wizard_theme_id, view_context.mobile_view? ? :mobile : :desktop, name)
end
def wizard_theme_translations_lookup
Theme.lookup_field(wizard_theme_id, :translations, I18n.locale)
end
def preload_wizard_json
return if request.xhr? || request.format.json?
return if request.method != "GET"
store_preloaded("siteSettings", SiteSetting.client_settings_json)
end
def store_preloaded(key, json)
@preloaded ||= {}
@preloaded[key] = json.gsub("</", "<\\/")
end
## Simplified version of with_resolved_locale in ApplicationController
def with_resolved_locale
locale = current_user ? current_user.effective_locale : SiteSetting.default_locale
I18n.ensure_all_loaded!
I18n.with_locale(locale) { yield }
end
private
def ensure_plugin_enabled

Datei anzeigen

@ -9,13 +9,10 @@ class CustomWizard::WizardSerializer < CustomWizard::BasicWizardSerializer
:completed,
:required,
:permitted,
:uncategorized_category_id,
:categories,
:resume_on_revisit
has_many :steps, serializer: ::CustomWizard::StepSerializer, embed: :objects
has_one :user, serializer: ::BasicUserSerializer, embed: :objects
has_many :groups, serializer: ::BasicGroupSerializer, embed: :objects
def completed
object.completed?
@ -46,24 +43,4 @@ class CustomWizard::WizardSerializer < CustomWizard::BasicWizardSerializer
def include_steps?
!include_completed?
end
def include_categories?
object.needs_categories
end
def include_groups?
object.needs_groups
end
def uncategorized_category_id
SiteSetting.uncategorized_category_id
end
def include_uncategorized_category_id?
object.needs_categories
end
def categories
object.categories.map { |c| c.to_h }
end
end

Datei anzeigen

@ -1,62 +0,0 @@
<html>
<head>
<%= discourse_color_scheme_stylesheets %>
<%= discourse_stylesheet_link_tag :wizard, theme_id: nil %>
<%= discourse_stylesheet_link_tag :wizard_custom %>
<%- if wizard_theme_id.present? %>
<%= discourse_stylesheet_link_tag (mobile_view? ? :mobile_theme : :desktop_theme), theme_id: wizard_theme_id %>
<%- end %>
<%= preload_script "locales/#{I18n.locale}" %>
<%= preload_script "ember_jquery" %>
<%= preload_script "wizard-vendor" %>
<%= preload_script "wizard-custom" %>
<%= preload_script "wizard-raw-templates" %>
<%= preload_script "wizard-plugin" %>
<%= preload_script "pretty-text-bundle" %>
<%= preload_script_url ExtraLocalesController.url("wizard") %>
<%= csrf_meta_tags %>
<%- unless customization_disabled? %>
<%= wizard_theme_translations_lookup %>
<%= raw wizard_theme_lookup("head_tag") %>
<%- end %>
<%= server_plugin_outlet "custom_wizard" %>
<%= tag.meta id: 'data-discourse-setup', data: client_side_setup_data %>
<meta name="discourse_theme_id" content="<%= wizard_theme_id %>">
<meta name="discourse-base-uri" content="<%= Discourse.base_path %>">
<%= render partial: "layouts/head" %>
<title><%= wizard_page_title %></title>
</head>
<body class='custom-wizard wizard'>
<%- unless customization_disabled? %>
<%= raw wizard_theme_lookup("header") %>
<%- end %>
<div id='custom-wizard-main'></div>
<%- unless customization_disabled? %>
<%= raw wizard_theme_lookup("body_tag") %>
<%- end %>
<%- if current_user %>
<%= preload_script 'wizard-custom-start' %>
<%- else %>
<%= preload_script 'wizard-custom-guest' %>
<%- end %>
<div id="svg-sprites" style="display:none;">
<div class="fontawesome">
<%= raw SvgSprite.bundle %>
</div>
</div>
<div class="hidden" id="data-preloaded-wizard" data-preloaded-wizard="<%= preloaded_json %>"></div>
</body>
</html>

Datei anzeigen

@ -34,7 +34,7 @@ export default ComposerEditor.extend({
if (this.siteSettings.enable_mentions) {
$input.autocomplete({
template: findRawTemplate("user-selector-autocomplete"),
dataSource: (term) => this.userSearchTerm.call(this, term),
dataSource: (term) => this._userSearchTerm.call(this, term),
key: "@",
transformComplete: (v) => v.username || v.name,
afterComplete: (value) => {

Datei anzeigen

@ -1,8 +1,13 @@
import { findCustomWizard, updateCachedWizard } from "../models/custom-wizard";
import I18n from "I18n";
import Route from "@ember/routing/route";
import DiscourseRoute from "discourse/routes/discourse";
export default DiscourseRoute.extend({
titleToken() {
const wizard = this.modelFor('custom-wizard');
return wizard ? (wizard.name || wizard.id) : I18n.t('wizard.custom_title');
},
export default Route.extend({
beforeModel(transition) {
if (transition.intent.queryParams) {
this.set("queryParams", transition.intent.queryParams);

Datei anzeigen

@ -4,4 +4,3 @@
maximum=field.limit
onChange=(action (mut categories))
tabindex=field.tabindex}}

Datei anzeigen

@ -1,5 +1,5 @@
{{custom-wizard-group-selector
groups=wizard.groups
groups=site.groups
field=field
whitelist=field.content
value=field.value

Datei anzeigen

@ -1,175 +1,172 @@
img.avatar {
border-radius: 50%;
vertical-align: middle;
}
div.ac-wrap {
box-sizing: border-box;
position: relative;
overflow: visible;
max-height: 150px;
min-height: 34px;
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
padding: 5px;
div.item {
float: left;
margin-bottom: 4px;
margin-right: 10px;
line-height: 1.6;
span {
height: 24px;
display: inline-block;
line-height: 20px;
}
}
.ac-collapsed-button {
float: left;
border-radius: 20px;
body.custom-wizard {
div.ac-wrap {
box-sizing: border-box;
position: relative;
top: -2px;
margin-right: 10px;
}
input[type="text"] {
border: 0;
}
.remove-link {
margin-left: 4px;
font-size: $font-down-1;
line-height: $line-height-small;
padding: 1px 3.5px;
border-radius: 12px;
box-sizing: border-box;
border: 1px solid var(--primary-low);
&:hover {
background-color: var(--danger-low);
border: 1px solid var(--danger-medium);
text-decoration: none;
color: var(--danger);
}
}
.ac-loading {
position: absolute;
top: 7px;
right: 5px;
}
input {
margin-bottom: 0;
}
.autocomplete {
z-index: 999999;
position: absolute;
width: inherit;
max-width: 240px;
box-sizing: border-box;
overflow: visible;
max-height: 150px;
min-height: 34px;
background-color: var(--secondary);
border: 1px solid var(--primary-low);
border: 1px solid var(--primary-medium);
padding: 5px;
li,
.no-results {
padding: 10px;
div.item {
float: left;
margin-bottom: 4px;
margin-right: 10px;
line-height: 1.6;
span {
height: 24px;
display: inline-block;
line-height: 20px;
}
}
ul {
list-style: none;
padding: 0;
margin: 0;
.ac-collapsed-button {
float: left;
border-radius: 20px;
position: relative;
top: -2px;
margin-right: 10px;
}
li {
.d-users {
color: var(--primary-medium);
padding: 0 2px;
}
input[type="text"] {
border: 0;
}
border-bottom: 1px solid var(--primary-low);
.remove-link {
margin-left: 4px;
font-size: $font-down-1;
line-height: $line-height-small;
padding: 1px 3.5px;
border-radius: 12px;
box-sizing: border-box;
border: 1px solid var(--primary-low);
a {
padding: 5px;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 14px;
text-decoration: none;
color: var(--primary);
&:hover {
background-color: var(--danger-low);
border: 1px solid var(--danger-medium);
text-decoration: none;
color: var(--danger);
}
}
img {
margin-right: 5px;
.ac-loading {
position: absolute;
top: 7px;
right: 5px;
}
input {
margin-bottom: 0;
}
.autocomplete {
z-index: 999999;
position: absolute;
width: inherit;
max-width: 240px;
box-sizing: border-box;
background-color: var(--secondary);
border: 1px solid var(--primary-low);
li,
.no-results {
padding: 10px;
}
ul {
list-style: none;
padding: 0;
margin: 0;
li {
.d-users {
color: var(--primary-medium);
padding: 0 2px;
}
span.username {
border-bottom: 1px solid var(--primary-low);
a {
padding: 5px;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 14px;
text-decoration: none;
color: var(--primary);
vertical-align: middle;
}
span.name {
font-size: $font-down-1;
vertical-align: middle;
margin-left: 5px;
color: var(--primary);
}
img {
margin-right: 5px;
}
&.selected {
background-color: var(--tertiary);
span.username {
color: var(--primary);
vertical-align: middle;
}
span.username,
span.name {
color: var(--secondary);
font-size: $font-down-1;
vertical-align: middle;
margin-left: 5px;
color: var(--primary);
}
&.selected {
background-color: var(--tertiary);
span.username,
span.name {
color: var(--secondary);
}
}
&:hover:not(.selected) {
background-color: var(--highlight-low);
text-decoration: none;
}
}
}
}
&:hover:not(.selected) {
background-color: var(--highlight-low);
text-decoration: none;
}
ul > label {
margin: 5px 0;
padding: 0 5px;
font-size: 80%;
line-height: 1.4em;
a {
text-decoration: underline;
}
}
}
}
ul > label {
margin: 5px 0;
padding: 0 5px;
font-size: 80%;
line-height: 1.4em;
.ac-form-result {
cursor: pointer;
background-color: var(--secondary);
display: flex;
a {
text-decoration: underline;
&:hover,
&.selected {
background-color: var(--tertiary);
color: white;
label {
color: white;
}
}
}
}
.ac-form-result {
cursor: pointer;
background-color: var(--secondary);
display: flex;
&:hover,
&.selected {
background-color: var(--tertiary);
color: white;
label {
color: white;
flex: 1 1 auto;
margin-bottom: 0;
cursor: pointer;
}
i {
margin-right: 5px;
}
}
label {
flex: 1 1 auto;
margin-bottom: 0;
cursor: pointer;
}
i {
margin-right: 5px;
}
}

Datei anzeigen

@ -1,130 +1,132 @@
.badge-wrapper {
font-size: $font-down-1;
font-weight: bold;
white-space: nowrap;
position: relative;
display: inline-flex;
align-items: baseline;
.badge-category {
body.custom-wizard {
.badge-wrapper {
font-size: $font-down-1;
font-weight: bold;
white-space: nowrap;
position: relative;
display: inline-flex;
align-items: baseline;
.category-name {
text-overflow: ellipsis;
overflow: hidden;
}
.badge-category {
display: inline-flex;
align-items: baseline;
.d-icon {
margin-right: 3px;
width: 0.74em;
height: 0.74em;
color: inherit;
}
}
.category-name {
text-overflow: ellipsis;
overflow: hidden;
}
&.bullet {
margin-right: 8px;
span.badge-category {
color: var(--primary-high);
overflow: hidden;
text-overflow: ellipsis;
.extra-info-wrapper & {
color: var(--header_primary);
.d-icon {
margin-right: 3px;
width: 0.74em;
height: 0.74em;
color: inherit;
}
}
.badge-category-parent-bg,
.badge-category-bg {
flex: 0 0 auto;
width: 9px;
height: 9px;
margin-right: 5px;
display: inline-block;
}
&.bullet {
margin-right: 8px;
.badge-category-parent-bg {
width: 5px;
margin-right: 0;
+ .badge-category-bg {
width: 5px;
}
}
.d-icon {
color: var(--primary-medium);
}
}
&.box {
margin-right: 5px;
padding: 2px 4px 2px 4px;
display: inline-flex;
span {
overflow: hidden;
text-overflow: ellipsis;
&.badge-category-bg,
&.badge-category-parent-bg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
&.badge-category-parent-bg {
width: calc(100% - 5px);
& + .badge-category-bg {
left: 5px;
width: calc(100% - 5px);
& + .badge-category {
margin-left: 5px;
}
span.badge-category {
color: var(--primary-high);
overflow: hidden;
text-overflow: ellipsis;
.extra-info-wrapper & {
color: var(--header_primary);
}
}
&.badge-category {
position: relative;
.badge-category-parent-bg,
.badge-category-bg {
flex: 0 0 auto;
width: 9px;
height: 9px;
margin-right: 5px;
display: inline-block;
}
.badge-category-parent-bg {
width: 5px;
margin-right: 0;
+ .badge-category-bg {
width: 5px;
}
}
.d-icon {
color: var(--primary-medium);
}
}
+ .topic-header-extra {
&.box {
margin-right: 5px;
padding: 2px 4px 2px 4px;
display: inline-flex;
span {
overflow: hidden;
text-overflow: ellipsis;
&.badge-category-bg,
&.badge-category-parent-bg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
&.badge-category-parent-bg {
width: calc(100% - 5px);
& + .badge-category-bg {
left: 5px;
width: calc(100% - 5px);
& + .badge-category {
margin-left: 5px;
}
}
}
&.badge-category {
position: relative;
}
}
+ .topic-header-extra {
padding: 2px 4px 2px 4px;
}
}
}
&.bar {
margin-right: 5px;
&.bar {
margin-right: 5px;
span.badge-category {
span.badge-category {
color: var(--primary-high);
padding: 1px 3px;
overflow: hidden;
text-overflow: ellipsis;
.extra-info-wrapper & {
color: var(--header_primary);
}
}
.badge-category-parent-bg,
.badge-category-bg {
display: inline-block;
padding: 0 1px;
&:before {
content: "\a0";
}
}
}
&.none {
color: var(--primary-high);
padding: 1px 3px;
overflow: hidden;
text-overflow: ellipsis;
.extra-info-wrapper & {
color: var(--header_primary);
}
margin-right: 5px;
}
.badge-category-parent-bg,
.badge-category-bg {
display: inline-block;
padding: 0 1px;
&:before {
content: "\a0";
}
}
}
&.none {
color: var(--primary-high);
margin-right: 5px;
}
}

Datei anzeigen

@ -1,90 +1,65 @@
input {
display: inline-block;
padding: 4px 10px;
margin-bottom: 9px;
font-size: 1em;
line-height: 1;
color: var(--primary);
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
border-radius: 0;
box-sizing: border-box;
}
textarea {
height: auto;
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
&:focus {
border-color: var(--tertiary);
box-shadow: shadow("focus");
outline: 0;
}
}
input,
select,
textarea {
color: var(--primary);
caret-color: currentColor;
&[class*="span"] {
float: none;
margin-left: 0;
}
&[disabled],
&[readonly] {
cursor: not-allowed;
background-color: var(--primary-low);
border-color: var(--primary-low);
}
&:focus:required:invalid {
color: var(--danger);
border-color: var(--danger);
}
&:focus:required:invalid:focus {
border-color: var(--danger);
box-shadow: shadow("focus-danger");
}
&[type="checkbox"] {
margin-bottom: 0;
margin-right: 10px;
}
}
.spinner {
margin: 20px auto 20px auto;
position: relative;
-webkit-animation: rotate-forever 1s infinite linear;
animation: rotate-forever 1s infinite linear;
height: 30px;
width: 30px;
border: 4px solid var(--primary-low-mid);
border-right-color: transparent;
border-radius: 50%;
&.small {
width: 10px;
height: 10px;
margin: 0;
body.custom-wizard {
input {
display: inline-block;
padding: 4px 10px;
margin-bottom: 9px;
font-size: 1em;
line-height: 1;
color: var(--primary);
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
border-radius: 0;
box-sizing: border-box;
}
}
@keyframes rotate-forever {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
textarea {
height: auto;
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
.body-length {
text-align: right;
&:focus {
border-color: var(--tertiary);
box-shadow: shadow("focus");
outline: 0;
}
}
input,
select,
textarea {
color: var(--primary);
caret-color: currentColor;
width: 100%;
&[class*="span"] {
float: none;
margin-left: 0;
}
&[disabled],
&[readonly] {
cursor: not-allowed;
background-color: var(--primary-low);
border-color: var(--primary-low);
}
&:focus:required:invalid {
color: var(--danger);
border-color: var(--danger);
}
&:focus:required:invalid:focus {
border-color: var(--danger);
box-shadow: shadow("focus-danger");
}
&[type="checkbox"] {
margin-bottom: 0;
margin-right: 10px;
}
}
.body-length {
text-align: right;
}
}

Datei anzeigen

@ -1,88 +1,90 @@
.wizard-btn {
border-radius: 2px;
font-size: var(--font-0);
border: 0;
padding: 0.5em;
transition: background-color 0.3s;
margin-right: 0.5em;
text-decoration: none;
background-color: var(--secondary);
color: var(--primary-very-high);
box-shadow: 0 1px 4px rgba(var(--always-black-rgb), 0.4);
cursor: pointer;
body.custom-wizard {
.wizard-btn {
border-radius: 2px;
font-size: var(--font-0);
border: 0;
padding: 0.5em;
transition: background-color 0.3s;
margin-right: 0.5em;
text-decoration: none;
background-color: var(--secondary);
color: var(--primary-very-high);
box-shadow: 0 1px 4px rgba(var(--always-black-rgb), 0.4);
cursor: pointer;
&.small {
padding: 0.25em 0.5em;
font-size: var(--font-down-1);
&.small {
padding: 0.25em 0.5em;
font-size: var(--font-down-1);
}
&:hover,
&:focus {
background-color: var(--primary-low);
}
&:active {
background-color: var(--primary-low-mid);
}
&:disabled,
&.disabled {
background-color: var(--primary-medium);
}
.d-icon-chevron-right {
margin-left: 0.25em;
font-size: 0.8em;
}
.d-icon-chevron-left {
margin-right: 0.25em;
font-size: 0.8em;
}
}
&:hover,
&:focus {
background-color: var(--primary-low);
.wizard-btn.primary {
background-color: var(--tertiary);
color: var(--secondary);
box-shadow: 0 1px 4px rgba(var(--always-black-rgb), 0.6);
&:hover,
&:focus {
background-color: var(--tertiary-hover);
}
&:active {
background-color: var(--tertiary-high);
}
&:disabled {
background-color: var(--tertiary-low);
}
}
&:active {
background-color: var(--primary-low-mid);
.wizard-btn.danger {
background-color: var(--danger);
color: var(--secondary);
&:hover,
&:focus {
background-color: var(--danger-hover);
}
&:active {
background-color: var(--danger-medium);
}
&:disabled {
background-color: var(--danger-low);
}
}
&:disabled,
&.disabled {
background-color: var(--primary-medium);
}
.action-link {
margin-right: 1em;
text-decoration: none;
color: var(--tertiary);
.d-icon-chevron-right {
margin-left: 0.25em;
font-size: 0.8em;
}
.d-icon-chevron-left {
margin-right: 0.25em;
font-size: 0.8em;
}
}
.wizard-btn.primary {
background-color: var(--tertiary);
color: var(--secondary);
box-shadow: 0 1px 4px rgba(var(--always-black-rgb), 0.6);
&:hover,
&:focus {
background-color: var(--tertiary-hover);
}
&:active {
background-color: var(--tertiary-high);
}
&:disabled {
background-color: var(--tertiary-low);
}
}
.wizard-btn.danger {
background-color: var(--danger);
color: var(--secondary);
&:hover,
&:focus {
background-color: var(--danger-hover);
}
&:active {
background-color: var(--danger-medium);
}
&:disabled {
background-color: var(--danger-low);
}
}
.action-link {
margin-right: 1em;
text-decoration: none;
color: var(--tertiary);
&:hover {
color: var(--tertiary-hover);
&:hover {
color: var(--tertiary-hover);
}
}
}

Datei anzeigen

@ -1,280 +1,282 @@
.d-editor-container {
display: flex;
flex-grow: 1;
max-width: 100%;
}
.d-editor-overlay {
position: absolute;
background-color: black;
opacity: 0.8;
z-index: z("modal", "overlay");
}
.d-editor-modals {
position: absolute;
z-index: z("modal", "content");
}
.d-editor {
display: flex;
flex-grow: 1;
min-height: 0;
}
.d-editor .d-editor-modal {
min-width: 400px;
position: absolute;
background-color: var(--secondary);
border: 1px solid var(--primary);
padding: 1em;
top: 25px;
@media screen and (max-width: 424px) {
min-width: 300px;
body.custom-wizard {
.d-editor-container {
display: flex;
flex-grow: 1;
max-width: 100%;
}
input {
width: 95%;
}
h3 {
margin-bottom: 0.5em;
}
}
.wizard-field-composer .wmd-controls {
position: relative;
}
.wizard-field-composer.show-preview .d-editor-textarea-column {
display: none;
}
.d-editor-textarea-wrapper,
.d-editor-preview-wrapper {
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
flex: 1;
max-width: unset;
}
.d-editor-textarea-wrapper {
display: flex;
flex-direction: column;
position: relative;
textarea {
background: transparent;
}
}
.d-editor-preview-wrapper {
display: flex;
flex-direction: column;
margin-left: 0;
overflow: auto;
cursor: default;
margin-top: unset;
padding-top: unset;
}
.d-editor-button-bar {
display: flex;
align-items: center;
border-bottom: none;
min-height: 30px;
padding-left: 3px;
border-bottom: 1px solid var(--primary-low);
button {
background-color: transparent;
color: var(--primary);
.d-editor-overlay {
position: absolute;
background-color: black;
opacity: 0.8;
z-index: z("modal", "overlay");
}
.btn:not(.no-text) {
font-size: 1.1487em;
.d-editor-modals {
position: absolute;
z-index: z("modal", "content");
}
.btn.bold {
font-weight: bolder;
.d-editor {
display: flex;
flex-grow: 1;
min-height: 0;
}
.btn.italic {
font-style: italic;
.d-editor .d-editor-modal {
min-width: 400px;
position: absolute;
background-color: var(--secondary);
border: 1px solid var(--primary);
padding: 1em;
top: 25px;
@media screen and (max-width: 424px) {
min-width: 300px;
}
input {
width: 95%;
}
h3 {
margin-bottom: 0.5em;
}
}
}
.d-editor-spacer {
width: 1px;
height: 20px;
margin: 0 5px;
display: inline-block;
}
.d-editor-input,
.d-editor-preview {
box-sizing: border-box;
flex: 1 1 100%;
width: 100%;
margin: 0;
min-height: auto;
word-wrap: break-word;
-webkit-appearance: none;
border-radius: 0;
&:focus {
box-shadow: none;
border: 0;
outline: 0;
.wizard-field-composer .wmd-controls {
position: relative;
}
}
.d-editor-input {
border: 0;
padding: 10px;
height: unset; // overrides core css
overflow-x: hidden;
resize: none;
}
.wizard-field-composer.show-preview .d-editor-textarea-column {
display: none;
}
.d-editor-preview {
height: auto;
padding: 10px;
}
.d-editor-textarea-wrapper,
.d-editor-preview-wrapper {
background-color: var(--secondary);
border: 1px solid var(--primary-medium);
flex: 1;
max-width: unset;
}
.d-editor-plugin {
display: flex;
flex: 1 1;
overflow: auto;
}
.d-editor-textarea-wrapper {
display: flex;
flex-direction: column;
position: relative;
.composing-whisper .d-editor-preview {
font-style: italic;
color: var(--primary) !important;
}
textarea {
background: transparent;
}
}
.d-editor-preview > *:first-child {
margin-top: 0;
}
.d-editor-preview-wrapper {
display: flex;
flex-direction: column;
margin-left: 0;
overflow: auto;
cursor: default;
margin-top: unset;
padding-top: unset;
}
.hide-preview .d-editor-preview-wrapper {
display: none;
flex: 0;
}
.d-editor-button-bar {
display: flex;
align-items: center;
border-bottom: none;
min-height: 30px;
padding-left: 3px;
border-bottom: 1px solid var(--primary-low);
////
button {
background-color: transparent;
color: var(--primary);
}
.d-editor {
min-height: 200px;
.btn:not(.no-text) {
font-size: 1.1487em;
}
.btn.bold {
font-weight: bolder;
}
.btn.italic {
font-style: italic;
}
}
.d-editor-spacer {
width: 1px;
height: 20px;
margin: 0 5px;
display: inline-block;
}
.d-editor-input,
.d-editor-preview {
box-sizing: border-box;
flex: 1 1 100%;
width: 100%;
margin: 0;
min-height: auto;
word-wrap: break-word;
-webkit-appearance: none;
border-radius: 0;
&:focus {
box-shadow: none;
border: 0;
outline: 0;
}
}
.d-editor-input {
resize: vertical;
flex: initial;
border: 0;
padding: 10px;
height: unset; // overrides core css
overflow-x: hidden;
resize: none;
}
textarea {
min-height: calc(200px - 32px);
.d-editor-preview {
height: auto;
padding: 10px;
}
}
.d-editor-modal.hidden {
display: none;
}
.d-editor-plugin {
display: flex;
flex: 1 1;
overflow: auto;
}
.d-editor-button-bar .btn {
border: none;
font-size: 0.9em;
}
.composing-whisper .d-editor-preview {
font-style: italic;
color: var(--primary) !important;
}
.wizard-composer-upload {
display: none;
}
.wizard-composer-hyperlink {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--primary-rgb), 0.8);
}
.wizard-composer-hyperlink-contents {
background-color: var(--secondary);
padding: 20px;
h3 {
.d-editor-preview > *:first-child {
margin-top: 0;
}
.composer-link-url,
.composer-link-name {
display: block;
min-width: 450px;
}
}
.hide-hyperlink-box,
.add-link {
display: inline;
}
#file-uploading {
position: absolute;
bottom: 1px;
right: 1px;
padding: 10px;
background-color: var(--secondary);
}
.bottom-bar {
display: flex;
justify-content: space-between;
margin-top: 20px;
align-items: center;
}
// Markdown table styles for wizard composer preview
.cooked,
.d-editor-preview {
a.mention {
display: inline-block; // https://bugzilla.mozilla.org/show_bug.cgi?id=1656119
font-weight: bold;
font-size: 0.93em;
color: var(--primary-high-or-secondary-low);
padding: 0 4px 1px;
background: var(--primary-low);
border-radius: 8px;
.hide-preview .d-editor-preview-wrapper {
display: none;
flex: 0;
}
table {
border-collapse: collapse;
////
tr {
border-bottom: 1px solid var(--primary-low);
&.highlighted {
animation: background-fade-highlight 2.5s ease-out;
.d-editor {
min-height: 200px;
.d-editor-input {
resize: vertical;
flex: initial;
}
textarea {
min-height: calc(200px - 32px);
}
}
.d-editor-modal.hidden {
display: none;
}
.d-editor-button-bar .btn {
border: none;
font-size: 0.9em;
}
.wizard-composer-upload {
display: none;
}
.wizard-composer-hyperlink {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--primary-rgb), 0.8);
}
.wizard-composer-hyperlink-contents {
background-color: var(--secondary);
padding: 20px;
h3 {
margin-top: 0;
}
.composer-link-url,
.composer-link-name {
display: block;
min-width: 450px;
}
}
.hide-hyperlink-box,
.add-link {
display: inline;
}
#file-uploading {
position: absolute;
bottom: 1px;
right: 1px;
padding: 10px;
background-color: var(--secondary);
}
.bottom-bar {
display: flex;
justify-content: space-between;
margin-top: 20px;
align-items: center;
}
// Markdown table styles for wizard composer preview
.cooked,
.d-editor-preview {
a.mention {
display: inline-block; // https://bugzilla.mozilla.org/show_bug.cgi?id=1656119
font-weight: bold;
font-size: 0.93em;
color: var(--primary-high-or-secondary-low);
padding: 0 4px 1px;
background: var(--primary-low);
border-radius: 8px;
}
table {
border-collapse: collapse;
tr {
border-bottom: 1px solid var(--primary-low);
&.highlighted {
animation: background-fade-highlight 2.5s ease-out;
}
}
thead {
th {
text-align: left;
padding: 0.5em;
font-weight: bold;
color: var(--primary);
}
}
tbody {
border-top: 3px solid var(--primary-low);
}
td {
padding: 3px 3px 3px 0.5em;
}
}
thead {
th {
text-align: left;
padding: 0.5em;
font-weight: bold;
color: var(--primary);
}
}
tbody {
border-top: 3px solid var(--primary-low);
}
td {
padding: 3px 3px 3px 0.5em;
}
}
}

Datei anzeigen

@ -1,514 +1,514 @@
// event form
body.custom-wizard {
.event-form {
width: 585px;
max-width: 80vw;
.event-form {
width: 585px;
max-width: 80vw;
.control {
display: inline-flex;
align-items: flex-start;
min-height: 30px;
margin-right: 20px;
.control {
display: inline-flex;
align-items: flex-start;
min-height: 30px;
margin-right: 20px;
> input:first-child {
margin-top: 10px !important;
}
> input:first-child {
margin-top: 10px !important;
}
> span:first-child {
margin-top: 5px !important;
}
> span:first-child {
margin-top: 5px !important;
}
> input + span {
margin-top: 5px;
}
> input + span {
margin-top: 5px;
}
&:last-of-type {
margin-right: 0;
}
&:last-of-type {
margin-right: 0;
}
input[type="checkbox"] {
margin: 0 10px 0 0;
}
input[type="checkbox"] {
margin: 0 10px 0 0;
}
input[type="number"] {
width: 50px;
margin: 0;
min-height: 34px;
border: 1px solid #e9e9e9;
}
input[type="number"] {
width: 50px;
margin: 0;
min-height: 34px;
border: 1px solid #e9e9e9;
}
&.full-width {
flex: 1;
}
&.full-width {
flex: 1;
}
.select-kit,
.ac-wrap {
width: 100% !important;
max-width: 330px;
}
.select-kit,
.ac-wrap {
width: 100% !important;
max-width: 330px;
}
.select-kit-body {
width: 100% !important;
max-width: 330px;
}
}
.event-controls {
margin-bottom: 20px;
display: flex;
align-items: flex-start;
}
.datetime-controls {
display: flex;
margin-bottom: 5px;
.date-time-card {
width: 270px;
display: inline-block;
text-align: left;
}
.start-card {
border-left: 1px solid transparent;
padding-right: 20px;
}
.end-card {
border-left: 1px solid #eee;
padding-left: 20px;
&.disabled {
span,
label,
.pika-label,
.pika-table th,
.pika-button,
.pika-prev,
.pika-next,
input,
.pika-lendar,
.is-selected .pika-button {
color: var(--primary-low);
background-image: initial;
background: initial;
box-shadow: initial;
cursor: default;
pointer-events: none;
}
input,
.pika-lendar {
border: 1px solid var(--primary-low) !important;
}
.select-kit-body {
width: 100% !important;
max-width: 330px;
}
}
.set-all-day {
font-size: 1.2em;
padding-bottom: 13px;
}
.sub-title {
font-size: 1.2em;
font-weight: bold;
padding-bottom: 2px;
padding-right: 10px;
}
.date-time-set {
padding-top: 10px;
.event-controls {
margin-bottom: 20px;
display: flex;
flex-direction: row;
align-items: flex-start;
}
.date-area {
order: 1;
.datetime-controls {
display: flex;
margin-bottom: 5px;
.date-time-card {
width: 270px;
display: inline-block;
text-align: left;
}
.time-area {
order: 2;
margin-left: 10px;
.start-card {
border-left: 1px solid transparent;
padding-right: 20px;
}
.modal-time {
width: 127px;
.end-card {
border-left: 1px solid #eee;
padding-left: 20px;
&.disabled {
span,
label,
.pika-label,
.pika-table th,
.pika-button,
.pika-prev,
.pika-next,
input,
.pika-lendar,
.is-selected .pika-button {
color: var(--primary-low);
background-image: initial;
background: initial;
box-shadow: initial;
cursor: default;
pointer-events: none;
}
input,
.pika-lendar {
border: 1px solid var(--primary-low) !important;
}
}
}
input {
padding: 4px 10px;
font-size: 1em;
line-height: 1;
color: var(--primary);
border: 1px solid var(--primary-medium);
min-height: 30px;
width: 130px;
margin: 10px 0;
.set-all-day {
font-size: 1.2em;
padding-bottom: 13px;
}
.sub-title {
font-size: 1.2em;
font-weight: bold;
padding-bottom: 2px;
padding-right: 10px;
}
.date-time-set {
padding-top: 10px;
display: flex;
flex-direction: row;
.date-area {
order: 1;
}
.time-area {
order: 2;
margin-left: 10px;
.modal-time {
width: 127px;
}
}
input {
padding: 4px 10px;
font-size: 1em;
line-height: 1;
color: var(--primary);
border: 1px solid var(--primary-medium);
min-height: 30px;
width: 130px;
margin: 10px 0;
}
}
#date-container-start,
#date-container-end {
height: 250px;
}
.ui-timepicker-input {
width: 105px;
text-align: center;
}
.pika-single {
position: relative !important;
border: none;
z-index: 100;
.pika-lendar {
border: 1px solid var(--primary-medium);
padding: 14px;
margin: 0;
float: none;
width: auto;
}
}
}
#date-container-start,
#date-container-end {
height: 250px;
.rsvp-controls {
.rsvp-container {
display: flex;
flex-flow: wrap;
margin-top: 10px;
.control span {
margin-right: 10px;
}
.full-width {
align-items: flex-start;
}
}
}
}
// datepicker
/*!
* Pikaday
* Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
*/
// Variables
// Declare any of these variables before importing this SCSS file to easily override defaults
// Variables are namespaced with the pd (pikaday) prefix
// Colours
$pd-text-color: var(--primary) !default;
$pd-title-color: var(--primary) !default;
$pd-title-bg: var(--secondary) !default;
$pd-picker-bg: var(--secondary) !default;
$pd-picker-border: var(--primary-low) !default;
$pd-picker-border-bottom: var(--primary-low) !default;
$pd-picker-shadow: rgba(0, 0, 0, 0.5) !default;
$pd-th-color: var(--primary) !default;
$pd-day-color: var(--primary) !default;
$pd-day-bg: var(--secondary) !default;
$pd-day-hover-color: var(--primary) !default;
$pd-day-hover-bg: var(--tertiary-low) !default;
$pd-day-today-color: var(--tertiary) !default;
$pd-day-selected-color: var(--secondary) !default;
$pd-day-selected-bg: var(--tertiary) !default;
$pd-day-selected-shadow: var(--tertiary-low) !default;
$pd-day-disabled-color: var(--primary) !default;
$pd-week-color: var(--primary) !default;
// Font
$pd-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
.pika-single {
z-index: 9999;
display: block;
position: relative;
color: $pd-text-color;
background: $pd-picker-bg;
border: 1px solid $pd-picker-border;
border-bottom-color: $pd-picker-border-bottom;
font-family: $pd-font-family;
&.is-hidden {
display: none;
}
.ui-timepicker-input {
width: 105px;
&.is-bound {
position: absolute;
box-shadow: 0 5px 15px -5px $pd-picker-shadow;
}
}
// clear child float (pika-lendar), using the famous micro clearfix hack
// http://nicolasgallagher.com/micro-clearfix-hack/
.pika-single {
&:before,
&:after {
content: " ";
display: table;
}
&:after {
clear: both;
}
}
.pika-lendar {
float: left;
width: 240px;
margin: 8px;
}
.pika-title {
position: relative;
text-align: center;
select {
cursor: pointer;
position: absolute;
z-index: 9998;
margin: 0;
left: 0;
top: 5px;
filter: alpha(opacity=0);
opacity: 0;
}
}
.pika-label {
display: inline-block;
position: relative;
z-index: 9999;
overflow: hidden;
margin: 0;
padding: 5px 3px;
font-size: 14px;
line-height: 20px;
font-weight: bold;
color: $pd-title-color;
background-color: $pd-title-bg;
}
.pika-prev,
.pika-next {
display: block;
cursor: pointer;
position: relative;
outline: none;
border: 0;
padding: 0;
width: 20px;
height: 30px;
text-indent: 20px; // hide text using text-indent trick, using width value (it's enough)
white-space: nowrap;
overflow: hidden;
background-color: transparent;
background-position: center center;
background-repeat: no-repeat;
background-size: 75% 75%;
opacity: 0.5;
@if (lightness($secondary) < 50) {
// invert the black png if the background is dark
filter: invert(1);
}
&:hover {
opacity: 1;
}
&.is-disabled {
cursor: default;
opacity: 0.2;
}
}
.pika-prev,
.is-rtl .pika-next {
float: left;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==");
}
.pika-next,
.is-rtl .pika-prev {
float: right;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=");
}
.pika-select {
display: inline-block;
}
.pika-table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
border: 0;
th,
td {
width: 14.285714285714286%;
padding: 0;
}
th {
color: $pd-th-color;
font-size: 12px;
line-height: 25px;
font-weight: bold;
text-align: center;
}
.pika-single {
position: relative !important;
border: none;
z-index: 100;
.pika-lendar {
border: 1px solid var(--primary-medium);
padding: 14px;
margin: 0;
float: none;
width: auto;
}
abbr {
border-bottom: none;
cursor: help;
}
}
.rsvp-controls {
.rsvp-container {
display: flex;
flex-flow: wrap;
margin-top: 10px;
.control span {
margin-right: 10px;
}
.full-width {
align-items: flex-start;
}
}
}
}
// datepicker
/*!
* Pikaday
* Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
*/
// Variables
// Declare any of these variables before importing this SCSS file to easily override defaults
// Variables are namespaced with the pd (pikaday) prefix
// Colours
$pd-text-color: var(--primary) !default;
$pd-title-color: var(--primary) !default;
$pd-title-bg: var(--secondary) !default;
$pd-picker-bg: var(--secondary) !default;
$pd-picker-border: var(--primary-low) !default;
$pd-picker-border-bottom: var(--primary-low) !default;
$pd-picker-shadow: rgba(0, 0, 0, 0.5) !default;
$pd-th-color: var(--primary) !default;
$pd-day-color: var(--primary) !default;
$pd-day-bg: var(--secondary) !default;
$pd-day-hover-color: var(--primary) !default;
$pd-day-hover-bg: var(--tertiary-low) !default;
$pd-day-today-color: var(--tertiary) !default;
$pd-day-selected-color: var(--secondary) !default;
$pd-day-selected-bg: var(--tertiary) !default;
$pd-day-selected-shadow: var(--tertiary-low) !default;
$pd-day-disabled-color: var(--primary) !default;
$pd-week-color: var(--primary) !default;
// Font
$pd-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
.pika-single {
z-index: 9999;
display: block;
position: relative;
color: $pd-text-color;
background: $pd-picker-bg;
border: 1px solid $pd-picker-border;
border-bottom-color: $pd-picker-border-bottom;
font-family: $pd-font-family;
&.is-hidden {
display: none;
}
&.is-bound {
position: absolute;
box-shadow: 0 5px 15px -5px $pd-picker-shadow;
}
}
// clear child float (pika-lendar), using the famous micro clearfix hack
// http://nicolasgallagher.com/micro-clearfix-hack/
.pika-single {
&:before,
&:after {
content: " ";
display: table;
}
&:after {
clear: both;
}
}
.pika-lendar {
float: left;
width: 240px;
margin: 8px;
}
.pika-title {
position: relative;
text-align: center;
select {
.pika-button {
cursor: pointer;
position: absolute;
z-index: 9998;
display: block;
-moz-box-sizing: border-box;
box-sizing: border-box;
outline: none;
border: 0;
margin: 0;
left: 0;
top: 5px;
filter: alpha(opacity=0);
opacity: 0;
}
}
.pika-label {
display: inline-block;
position: relative;
z-index: 9999;
overflow: hidden;
margin: 0;
padding: 5px 3px;
font-size: 14px;
line-height: 20px;
font-weight: bold;
color: $pd-title-color;
background-color: $pd-title-bg;
}
.pika-prev,
.pika-next {
display: block;
cursor: pointer;
position: relative;
outline: none;
border: 0;
padding: 0;
width: 20px;
height: 30px;
text-indent: 20px; // hide text using text-indent trick, using width value (it's enough)
white-space: nowrap;
overflow: hidden;
background-color: transparent;
background-position: center center;
background-repeat: no-repeat;
background-size: 75% 75%;
opacity: 0.5;
@if (lightness($secondary) < 50) {
// invert the black png if the background is dark
filter: invert(1);
}
&:hover {
opacity: 1;
}
&.is-disabled {
cursor: default;
opacity: 0.2;
}
}
.pika-prev,
.is-rtl .pika-next {
float: left;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==");
}
.pika-next,
.is-rtl .pika-prev {
float: right;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=");
}
.pika-select {
display: inline-block;
}
.pika-table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
border: 0;
th,
td {
width: 14.285714285714286%;
padding: 0;
}
th {
color: $pd-th-color;
width: 100%;
padding: 5px;
color: $pd-day-color;
font-size: 12px;
line-height: 25px;
font-weight: bold;
text-align: center;
line-height: 15px;
text-align: right;
background: $pd-day-bg;
.is-today & {
color: $pd-day-today-color;
font-weight: bold;
}
.is-selected & {
color: $pd-day-selected-color;
font-weight: bold;
background: $pd-day-selected-bg;
box-shadow: inset 0 1px 3px $pd-day-selected-shadow;
border-radius: 3px;
}
.is-disabled &,
.is-outside-current-month & {
pointer-events: none;
cursor: default;
color: $pd-day-disabled-color;
opacity: 0.3;
}
&:hover {
color: $pd-day-hover-color;
background: $pd-day-hover-bg;
box-shadow: none;
border-radius: 3px;
}
}
abbr {
border-bottom: none;
cursor: help;
}
}
.pika-button {
cursor: pointer;
display: block;
-moz-box-sizing: border-box;
box-sizing: border-box;
outline: none;
border: 0;
margin: 0;
width: 100%;
padding: 5px;
color: $pd-day-color;
font-size: 12px;
line-height: 15px;
text-align: right;
background: $pd-day-bg;
.is-today & {
color: $pd-day-today-color;
font-weight: bold;
.pika-week {
font-size: 11px;
color: $pd-week-color;
}
.is-selected & {
color: $pd-day-selected-color;
font-weight: bold;
background: $pd-day-selected-bg;
box-shadow: inset 0 1px 3px $pd-day-selected-shadow;
border-radius: 3px;
.is-inrange .pika-button {
background: #d5e9f7;
}
.is-disabled &,
.is-outside-current-month & {
pointer-events: none;
cursor: default;
color: $pd-day-disabled-color;
opacity: 0.3;
}
&:hover {
color: $pd-day-hover-color;
background: $pd-day-hover-bg;
.is-startrange .pika-button {
color: var(--secondary);
background: #6cb31d;
box-shadow: none;
border-radius: 3px;
}
}
.pika-week {
font-size: 11px;
color: $pd-week-color;
}
.is-endrange .pika-button {
color: var(--secondary);
background: var(--tertiary);
box-shadow: none;
border-radius: 3px;
}
.is-inrange .pika-button {
background: #d5e9f7;
}
// timepicker
.is-startrange .pika-button {
color: var(--secondary);
background: #6cb31d;
box-shadow: none;
border-radius: 3px;
}
.ui-timepicker-wrapper {
overflow-y: auto;
max-height: 150px;
width: 6.5em;
background: #fff;
border: 1px solid #ddd;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
outline: none;
z-index: 10001;
margin: 0;
}
.is-endrange .pika-button {
color: var(--secondary);
background: var(--tertiary);
box-shadow: none;
border-radius: 3px;
}
.ui-timepicker-wrapper.ui-timepicker-with-duration {
width: 13em;
}
// timepicker
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-30,
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-60 {
width: 11em;
}
.ui-timepicker-wrapper {
overflow-y: auto;
max-height: 150px;
width: 6.5em;
background: #fff;
border: 1px solid #ddd;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
outline: none;
z-index: 10001;
margin: 0;
}
.ui-timepicker-list {
margin: 0;
padding: 0;
list-style: none;
}
.ui-timepicker-wrapper.ui-timepicker-with-duration {
width: 13em;
}
.ui-timepicker-duration {
margin-left: 5px;
color: #888;
}
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-30,
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-60 {
width: 11em;
}
.ui-timepicker-list:hover .ui-timepicker-duration {
color: #888;
}
.ui-timepicker-list {
margin: 0;
padding: 0;
list-style: none;
}
.ui-timepicker-list li {
padding: 3px 0 3px 5px;
cursor: pointer;
white-space: nowrap;
color: #000;
list-style: none;
margin: 0;
}
.ui-timepicker-duration {
margin-left: 5px;
color: #888;
}
.ui-timepicker-list:hover .ui-timepicker-selected {
background: #fff;
color: #000;
}
.ui-timepicker-list:hover .ui-timepicker-duration {
color: #888;
}
li.ui-timepicker-selected,
.ui-timepicker-list li:hover,
.ui-timepicker-list .ui-timepicker-selected:hover {
background: #1980ec;
color: #fff;
}
.ui-timepicker-list li {
padding: 3px 0 3px 5px;
cursor: pointer;
white-space: nowrap;
color: #000;
list-style: none;
margin: 0;
}
li.ui-timepicker-selected .ui-timepicker-duration,
.ui-timepicker-list li:hover .ui-timepicker-duration {
color: #ccc;
}
.ui-timepicker-list:hover .ui-timepicker-selected {
background: #fff;
color: #000;
}
.ui-timepicker-list li.ui-timepicker-disabled,
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
color: #888;
cursor: default;
}
li.ui-timepicker-selected,
.ui-timepicker-list li:hover,
.ui-timepicker-list .ui-timepicker-selected:hover {
background: #1980ec;
color: #fff;
}
li.ui-timepicker-selected .ui-timepicker-duration,
.ui-timepicker-list li:hover .ui-timepicker-duration {
color: #ccc;
}
.ui-timepicker-list li.ui-timepicker-disabled,
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
color: #888;
cursor: default;
}
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
background: #f2f2f2;
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
background: #f2f2f2;
}
}

Datei anzeigen

@ -0,0 +1,5 @@
body.custom-wizard {
.d-header .panel {
display: none;
}
}

Datei anzeigen

@ -1,191 +1,193 @@
.location-form-instructions {
color: #919191;
margin: 5px 0;
font-size: 80%;
line-height: 1.4em;
body.custom-wizard {
.location-form-instructions {
color: #919191;
margin: 5px 0;
font-size: 80%;
line-height: 1.4em;
a {
text-decoration: underline;
}
}
.location-form {
display: flex;
overflow: visible;
.title {
font-weight: 700;
a {
text-decoration: underline;
}
}
.address {
padding-right: 20px;
}
.location-form {
display: flex;
overflow: visible;
.coordinates {
.control-group {
display: block;
.title {
font-weight: 700;
}
.controls {
display: flex;
width: 100%;
.address {
padding-right: 20px;
}
input {
width: 100px;
.coordinates {
.control-group {
display: block;
.controls {
display: flex;
width: 100%;
input {
width: 100px;
}
}
.icon {
margin-left: 10px;
display: inline-block;
}
}
.icon {
margin-left: 10px;
display: inline-block;
.icon img {
max-width: 30px;
}
}
.icon img {
max-width: 30px;
.address + .coordinates {
border-left: 1px solid var(--primary-low);
padding-left: 20px;
}
.control-group {
display: inline-block;
vertical-align: top;
margin-right: 20px;
margin-top: 10px;
width: auto;
.instructions {
@extend .location-form-instructions;
}
}
.location-search {
display: block;
margin: 15px 0;
}
.geo-map {
height: 400px;
}
}
.address + .coordinates {
border-left: 1px solid var(--primary-low);
padding-left: 20px;
}
.control-group {
display: inline-block;
vertical-align: top;
margin-right: 20px;
margin-top: 10px;
width: auto;
.instructions {
@extend .location-form-instructions;
}
}
.location-search {
display: block;
margin: 15px 0;
}
.geo-map {
height: 400px;
}
}
input.input-location,
div.input-location {
max-height: 150px;
background-color: var(--secondary);
box-shadow: none;
box-sizing: border-box;
margin: 0;
}
.input-location .select2-choice {
padding: 2px 5px;
}
.input-location.input-small {
width: 100px;
}
.location-selector-container {
position: relative;
.ac-wrap {
input.input-location,
div.input-location {
max-height: 150px;
background-color: var(--secondary);
box-shadow: none;
box-sizing: border-box;
margin: 0;
}
.ac-loading {
position: absolute;
top: 7px;
right: 5px;
}
.input-location .select2-choice {
padding: 2px 5px;
}
.item {
line-height: 1.6;
}
.input-location.input-small {
width: 100px;
}
.autocomplete {
width: inherit;
left: 0 !important;
width: 100%;
top: 30px !important;
.location-selector-container {
position: relative;
.ac-wrap {
box-sizing: border-box;
li,
.no-results {
padding: 10px;
.ac-loading {
position: absolute;
top: 7px;
right: 5px;
}
ul > label {
@extend .location-form-instructions;
padding: 0 5px;
.item {
line-height: 1.6;
}
.autocomplete {
width: inherit;
left: 0 !important;
width: 100%;
top: 30px !important;
box-sizing: border-box;
li,
.no-results {
padding: 10px;
}
ul > label {
@extend .location-form-instructions;
padding: 0 5px;
}
}
}
}
}
.location-form-result {
cursor: pointer;
background-color: var(--secondary);
display: flex;
.location-form-result {
cursor: pointer;
background-color: var(--secondary);
display: flex;
&:hover,
&.selected {
background-color: var(--tertiary);
color: white;
&:hover,
&.selected {
background-color: var(--tertiary);
color: white;
label {
color: white;
}
}
label {
color: white;
flex: 1 1 auto;
margin-bottom: 0;
cursor: pointer;
}
i {
margin-right: 5px;
}
}
label {
flex: 1 1 auto;
margin-bottom: 0;
cursor: pointer;
}
.location-results {
max-width: 550px;
position: relative;
i {
margin-right: 5px;
}
}
.location-results {
max-width: 550px;
position: relative;
.spinner {
position: absolute;
right: 50%;
top: 50%;
}
ul {
background-color: var(--primary-very-low);
border: 1px solid #e9e9e9;
margin: 0;
padding: 0;
list-style: none;
height: 95px;
overflow: scroll;
}
li {
padding: 6px 12px;
}
.no-results {
padding: 15px;
}
.default {
margin: 0 auto;
top: 50%;
transform: translateY(-50%);
position: absolute;
width: 100%;
text-align: center;
color: #919191;
.spinner {
position: absolute;
right: 50%;
top: 50%;
}
ul {
background-color: var(--primary-very-low);
border: 1px solid #e9e9e9;
margin: 0;
padding: 0;
list-style: none;
height: 95px;
overflow: scroll;
}
li {
padding: 6px 12px;
}
.no-results {
padding: 15px;
}
.default {
margin: 0 auto;
top: 50%;
transform: translateY(-50%);
position: absolute;
width: 100%;
text-align: center;
color: #919191;
}
}
}

Datei anzeigen

@ -1,32 +1,34 @@
span.mentionable-item {
font-weight: bold;
}
body.custom-wizard {
span.mentionable-item {
font-weight: bold;
}
a.mentionable-item span {
background-color: $primary-low;
padding: 3px;
border-radius: 3px;
color: $primary;
}
a.mentionable-item span {
background-color: $primary-low;
padding: 3px;
border-radius: 3px;
color: $primary;
}
.ac-mentionable-item ul li a {
display: flex;
align-items: center;
}
.ac-mentionable-item ul li a {
display: flex;
align-items: center;
}
.ac-mentionable-item-name {
padding-left: 0.5em;
}
.ac-mentionable-item-name {
padding-left: 0.5em;
}
.ac-mentionable-item-image {
width: 25px;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
.ac-mentionable-item-image {
width: 25px;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
img {
height: 100%;
object-fit: contain;
img {
height: 100%;
object-fit: contain;
}
}
}

Datei anzeigen

@ -1,40 +1,42 @@
.similar-topics-validator {
position: relative;
display: flex;
body.custom-wizard {
.similar-topics-validator {
position: relative;
display: flex;
label {
min-height: 20px;
}
}
.wizard-similar-topics {
margin-left: 3px;
ul {
background-color: var(--tertiary-low);
padding: 5px;
margin: 0;
list-style: none;
position: absolute;
left: 0;
top: 25px;
box-shadow: shadow("dropdown");
width: 100%;
box-sizing: border-box;
z-index: 100;
.title {
color: var(--primary);
}
.blurb {
margin-left: 0.5em;
color: var(--primary-high);
font-size: $font-down-1;
label {
min-height: 20px;
}
}
.show-topics {
cursor: pointer;
.wizard-similar-topics {
margin-left: 3px;
ul {
background-color: var(--tertiary-low);
padding: 5px;
margin: 0;
list-style: none;
position: absolute;
left: 0;
top: 25px;
box-shadow: shadow("dropdown");
width: 100%;
box-sizing: border-box;
z-index: 100;
.title {
color: var(--primary);
}
.blurb {
margin-left: 0.5em;
color: var(--primary-high);
font-size: $font-down-1;
}
}
.show-topics {
cursor: pointer;
}
}
}

Datei anzeigen

@ -16,7 +16,7 @@ body.custom-wizard {
width: 100%;
border: 1px solid var(--primary-low-mid);
border-radius: 5px;
margin: 0 auto;
margin: 0 auto 2.5em auto;
.wizard-field .input-area {
margin: 0.5em 0;
@ -144,12 +144,12 @@ body.custom-wizard {
.wizard-column .action-link {
color: var(--tertiary);
}
}
.no-access-gutter {
margin-top: 10px;
display: flex;
justify-content: flex-end;
.no-access-gutter {
margin-top: 10px;
display: flex;
justify-content: flex-end;
}
}
/* IE11 hacks */

Datei anzeigen

@ -1,5 +1,6 @@
@import "custom/base";
@import "custom/wizard";
@import "custom/header";
@import "custom/step";
@import "custom/badges";
@import "custom/buttons";

Datei anzeigen

@ -1,10 +1,9 @@
# frozen_string_literal: true
CustomWizard::Engine.routes.draw do
get 'qunit' => 'wizard#qunit'
get ':wizard_id' => 'wizard#index'
get ':wizard_id' => 'wizard#show'
put ':wizard_id/skip' => 'wizard#skip'
get ':wizard_id/steps' => 'wizard#index'
get ':wizard_id/steps/:step_id' => 'wizard#index'
get ':wizard_id/steps' => 'wizard#show'
get ':wizard_id/steps/:step_id' => 'wizard#show'
put ':wizard_id/steps/:step_id' => 'steps#update'
end

Datei anzeigen

@ -120,18 +120,6 @@ class CustomWizard::Builder
params[:property] = field_template['property']
end
if field_template['type'] === 'category' || (
field_template['validations'] &&
field_template['validations']['similar_topics'] &&
field_template['validations']['similar_topics']['categories'].present?
)
@wizard.needs_categories = true
end
if field_template['type'] === 'group'
@wizard.needs_groups = true
end
if (content_inputs = field_template['content']).present?
content = CustomWizard::Mapper.new(
inputs: content_inputs,

Datei anzeigen

@ -23,8 +23,6 @@ class CustomWizard::Wizard
:restart_on_revisit,
:resume_on_revisit,
:permitted,
:needs_categories,
:needs_groups,
:steps,
:step_ids,
:field_ids,
@ -54,8 +52,6 @@ class CustomWizard::Wizard
@after_time_scheduled = attrs['after_time_scheduled']
@required = cast_bool(attrs['required'])
@permitted = attrs['permitted'] || nil
@needs_categories = false
@needs_groups = false
@theme_id = attrs['theme_id']
if attrs['theme'].present?
@ -243,14 +239,6 @@ class CustomWizard::Wizard
)
end
def categories
@categories ||= ::Site.new(Guardian.new(user)).categories
end
def groups
@groups ||= ::Site.new(Guardian.new(user)).groups
end
def update_step_ids
@step_ids = steps.map(&:id)
end