diff --git a/resources/assets/js/scriptJoinPage.js b/resources/assets/js/scriptJoinPage.js index 80aed71c643d3dd055beb3803fcc3db268766a57..5c1030c0ae18eeb7ceed8e09ce6e018450c11e72 100644 --- a/resources/assets/js/scriptJoinPage.js +++ b/resources/assets/js/scriptJoinPage.js @@ -1,7 +1,7 @@ function checkFormBeforePrinting () { var requiredElements = document.querySelectorAll("[required]"); var passed = true; - for (i = 0; i < requiredElements.length; i++) { + for (var i = 0; i < requiredElements.length; i++) { if(requiredElements[i].value == "") { passed = false; requiredElements[i].style.backgroundColor = "#ff9999"; diff --git a/resources/assets/less/metager/beitritt.less b/resources/assets/less/metager/beitritt.less index 02892cdbfc96135bee9d36bde81519c0d6543911..f658d4e1b425150d0f5d9436a1425675a068955c 100644 --- a/resources/assets/less/metager/beitritt.less +++ b/resources/assets/less/metager/beitritt.less @@ -1,120 +1,123 @@ /* Style für die Druckversion des Beitrittsformulars */ -#donation-form { - .beitritt-inputs { - display: flex; - flex-wrap: wrap; - >div { - width: 50%; - padding: 10px; - } - @media print { - padding: 0px; - flex-direction: column; - flex-wrap: nowrap; - } - } - label { - font-weight: normal; - } - .signature { - border-top: 1px dashed black; - width: 50%; - margin-top: 50px; +.beitritt-inputs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + > div { + width: 50%; + padding: 10px; + @media screen and (max-width: 600px) { + width: 100%; } + } +} + +label { + font-weight: normal; +} + +.signature { + border-top: 1px dashed black; + width: 50%; + margin-top: 16px; } @media print { - .card-heavy { - border: none !important; - box-shadow: none !important; + .card-heavy { + border: none !important; + margin: 0px 0px 8px 0px !important; + padding: 0; + -webkit-box-shadow: none !important; + box-shadow: none !important; + webkit-box-shadow: none !important; + } + .beitritt-inputs { + margin: 0px !important; + padding: 0px !important; + margin-bottom: 0px !important; + } + h1 { + margin-top: 0 !important; + padding-top: 0 !important; + } + * { + font-size: 12px !important; + } + header { + display: none !important; + } + footer { + display: none !important; + } + hr { + display: none !important; + } + .help-block { + text-decoration: none; + } + input[type="text"], + input[type="email"] { + font-weight: bold; + margin: 0px !important; + padding: 0px !important; + height: initial !important; + border: 0; + } + /* Passt die Größe der Radio-Buttons an + * Skalierung für Firefox, absolut für die anderen Browser + */ + input[type="radio"] { + -webkit-transform: scale(0.5); + transform: scale(0.5); + width: 20px !important; + height: 20px !important; + margin-top: 0px !important; + padding-top: 0px !important; + } + /* Blendet die Placeholder aus */ + input::-webkit-input-placeholder { + /* WebKit browsers */ + color: transparent !important; + } + input:-moz-placeholder { + /* Mozilla Firefox 4 to 18 */ + color: transparent !important; + } + input::-moz-placeholder { + /* Mozilla Firefox 19+ */ + color: transparent !important; + } + input:-ms-input-placeholder { + /* Internet Explorer 10+ */ + color: transparent !important; + } + .container { + width: auto !important; + margin: 0px; + padding: 0px; + } + .wrapper { + padding: 0 !important; + margin: 0 !important; + } + .sign { + margin-top: 10px; + } + .donation-amount-input { + padding-top: 5px; + } + .pagebreak { + page-break-before: always; + } + #spendenaufruf { + display: none !important; + } + .beitritt-formular-info { + * { + font-size: 7pt !important; } - #donation-form { - * { - font-size: 14px !important; - } - header { - display: none !important; - } - footer { - display: none !important; - } - h1 { - margin-top: 0 !important; - padding-top: 0 !important; - font-size: 18px !important; - } - hr { - display: none !important; - } - label { - text-decoration: underline; - } - .help-block { - text-decoration: none; - } - input[type=text], - input[type=email] { - margin: 0px !important; - padding: 0px !important; - height: initial !important; - border: 0; - } - /* Passt die Größe der Radio-Buttons an - * Skalierung für Firefox, absolut für die anderen Browser - */ - input[type=radio] { - transform: scale(0.5); - width: 20px !important; - height: 20px !important; - margin-top: 0px !important; - padding-top: 0px !important; - } - /* Blendet die Placeholder aus */ - input::-webkit-input-placeholder { - /* WebKit browsers */ - color: transparent !important; - } - input:-moz-placeholder { - /* Mozilla Firefox 4 to 18 */ - color: transparent !important; - } - input::-moz-placeholder { - /* Mozilla Firefox 19+ */ - color: transparent !important; - } - input:-ms-input-placeholder { - /* Internet Explorer 10+ */ - color: transparent !important; - } - .container { - width: auto !important; - margin: 0px; - padding: 0px; - } - .wrapper { - padding-top: 0 !important; - } - * { - font-size: 12px!important; - } - .sign { - margin-top: 10px; - } - .donation-amount-input { - padding-top: 5px; - } - .pagebreak { - page-break-before: always; - } - #spendenaufruf { - display: none !important; - } - .beitritt-formular-info { - margin-top: 50px; - * { - font-size: 7pt !important; - } - } - } -} \ No newline at end of file + } +} diff --git a/resources/assets/less/metager/sidebar.less b/resources/assets/less/metager/sidebar.less index 95eac30aae3027460dcfc508466ed0a9d69e43d9..db1714c8ac9f18ae788ab988d177f95d9a106b61 100644 --- a/resources/assets/less/metager/sidebar.less +++ b/resources/assets/less/metager/sidebar.less @@ -158,7 +158,6 @@ label#openSidebar { &:hover { color: @metager-orange; } - .noprint; } @media (max-width: @screen-xs-max) { diff --git a/resources/views/parts/sidebar.blade.php b/resources/views/parts/sidebar.blade.php index 4ce31dff1e4bc63cb10ab0195dc7cc81e54c306d..bb95177cd79f168d945c2c23ce8ead1c53f91d9d 100644 --- a/resources/views/parts/sidebar.blade.php +++ b/resources/views/parts/sidebar.blade.php @@ -1,5 +1,5 @@ <input id="sideBarToggle" style="display: none;" type="checkbox"> -<label id="openSidebar" role="button" for="sideBarToggle"></label> +<label id="openSidebar" class="noprint" role="button" for="sideBarToggle"></label> <div class="sideBar"> <label id="closeSidebar" role="button" for="sideBarToggle"></label> <a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}"> diff --git a/resources/views/spende/beitritt.blade.php b/resources/views/spende/beitritt.blade.php index 7e560370db4d794643c1fc317d6fd13a8bee1c0a..b52f39cca2dd38931bd8d1d45b0eab760719a799 100644 --- a/resources/views/spende/beitritt.blade.php +++ b/resources/views/spende/beitritt.blade.php @@ -5,91 +5,92 @@ @section('navbarFocus.donate', 'class="dropdown active"') @section('content') - <link type="text/css" rel="stylesheet" href="{{ mix('/css/beitritt.css') }}" /> + <link type="text/css" rel="stylesheet" href="{{ mix('/css/beitritt.css') }}" /> + <script src="{{ mix('js/scriptJoinPage.js') }}"></script> +<form id="donation-form"> <div class="card-heavy"> <h1>{{ trans('beitritt.heading.1') }}</h1> - <form id="donation-form"> - <div class="beitritt-inputs"> - <div> - <label for="name">{{ trans('beitritt.beitritt.1') }}</label> - <input type="text" class="form-control beitritt-input" name="name" placeholder="{{trans('beitritt.placeholder.1')}}" required> - </div> - <div> - <label for="firma">{{ trans('beitritt.beitritt.2') }}</label> - <input type="text" class="form-control beitritt-input" name="firma" placeholder="{{trans('beitritt.placeholder.2')}}"> - </div> - <div> - <label for="funktion">{{ trans('beitritt.beitritt.3') }}</label> - <input type="text" class="form-control beitritt-input" name="funktion" placeholder="{{trans('beitritt.placeholder.3')}}"> - </div> - <div> - <label for="adresse">{{ trans('beitritt.beitritt.4') }}</label> - <input type="text" class="form-control beitritt-input" name="adresse" placeholder="{{trans('beitritt.placeholder.4')}}" required> - </div> - <div> - <label for="email">{{ trans('beitritt.beitritt.5') }}</label> - <input type="email" class="form-control beitritt-input" name="email" placeholder=""> - </div> - <div> - <label for="homepage">{{ trans('beitritt.beitritt.6') }}</label> - <input type="text" class="form-control beitritt-input" name="homepage" placeholder="http://"> - </div> - <div> - <label for="telefon">{{ trans('beitritt.beitritt.7') }}</label> - <input type="text" class="form-control beitritt-input" name="telefon" placeholder="{{trans('beitritt.placeholder.7')}}"> - </div> + <div class="beitritt-inputs"> + <div> + <label for="name">{{ trans('beitritt.beitritt.1') }}</label> + <input type="text" class="form-control beitritt-input" name="name" placeholder="{{trans('beitritt.placeholder.1')}}" required> + </div> + <div> + <label for="firma">{{ trans('beitritt.beitritt.2') }}</label> + <input type="text" class="form-control beitritt-input" name="firma" placeholder="{{trans('beitritt.placeholder.2')}}"> + </div> + <div> + <label for="funktion">{{ trans('beitritt.beitritt.3') }}</label> + <input type="text" class="form-control beitritt-input" name="funktion" placeholder="{{trans('beitritt.placeholder.3')}}"> </div> <div> - <p>{{ trans('beitritt.beitritt.8') }}</p> - <input type="text" class="form-control" name="betrag" required> - <p> {{ trans('beitritt.beitritt.9') }}</p> + <label for="adresse">{{ trans('beitritt.beitritt.4') }}</label> + <input type="text" class="form-control beitritt-input" name="adresse" placeholder="{{trans('beitritt.placeholder.4')}}" required> </div> <div> - <p>{{ trans('beitritt.beitritt.10') }}</p> - <p>{{ trans('beitritt.beitritt.11') }}</p> + <label for="email">{{ trans('beitritt.beitritt.5') }}</label> + <input type="email" class="form-control beitritt-input" name="email" placeholder=""> </div> <div> - <input type="radio" name="veröffentlichung" checked> {{ trans('beitritt.beitritt.12') }} - <input type="radio" name="veröffentlichung"> {{ trans('beitritt.beitritt.13') }} + <label for="homepage">{{ trans('beitritt.beitritt.6') }}</label> + <input type="text" class="form-control beitritt-input" name="homepage" placeholder="http://"> </div> <div> - <div> - <label for="ort">{{ trans('beitritt.beitritt.14') }}</label> - <input type="text" class="form-control beitritt-input" id="ort" placeholder=""> - </div> - <p class="signature">{{ trans('beitritt.unterschrift') }}</p> + <label for="telefon">{{ trans('beitritt.beitritt.7') }}</label> + <input type="text" class="form-control beitritt-input" name="telefon" placeholder="{{trans('beitritt.placeholder.7')}}"> + </div> + </div> + <div> + <p>{{ trans('beitritt.beitritt.8') }}</p> + <input type="text" class="form-control beitritt-input" name="betrag" required> + <p> {{ trans('beitritt.beitritt.9') }}</p> + </div> + <div> + <p>{{ trans('beitritt.beitritt.10') }}</p> + <p>{{ trans('beitritt.beitritt.11') }}</p> + </div> + <div> + <input type="radio" name="veröffentlichung" checked> {{ trans('beitritt.beitritt.12') }} + <input type="radio" name="veröffentlichung"> {{ trans('beitritt.beitritt.13') }} + </div> + <div> + <div> + <label for="ort">{{ trans('beitritt.beitritt.14') }}</label> + <input type="text" class="form-control beitritt-input" id="ort" placeholder=""> </div> + <br> + <p class="signature">{{ trans('beitritt.unterschrift') }}</p> </div> - <div class="card-heavy"> - <div class="newpage"></div> - <h1>{{ trans('beitritt.abbuchung.2') }}</h1> - <p>{{ trans('beitritt.abbuchung.3') }}</p> - <div class="beitritt-inputs"> - <div> - <label for="kontoname">{{ trans('beitritt.abbuchung.4') }}</label> - <input type="text" class="form-control" name="kontoname" placeholder=""> - </div> - <div> - <label for="bankverbindung">{{ trans('beitritt.abbuchung.5') }}</label> - <input type="text" class="form-control" name="bankverbindung" placeholder=""> - </div> - <div> - <label for="iban">{{ trans('beitritt.abbuchung.6') }}</label> - <input type="text" class="form-control" name="iban" maxlength="22" placeholder=""> - </div> - <div> - <label for="bic">{{ trans('beitritt.abbuchung.7') }}</label> - <input type="text" class="form-control" name="bic" placeholder=""> - </div> + </div> + <div class="card-heavy"> + <div class="newpage noprint"></div> + <h1>{{ trans('beitritt.abbuchung.2') }}</h1> + <p>{{ trans('beitritt.abbuchung.3') }}</p> + <div class="beitritt-inputs"> + <div> + <label for="kontoname">{{ trans('beitritt.abbuchung.4') }}</label> + <input type="text" class="form-control beitritt-input" name="kontoname" placeholder=""> + </div> + <div> + <label for="bankverbindung">{{ trans('beitritt.abbuchung.5') }}</label> + <input type="text" class="form-control beitritt-input" name="bankverbindung" placeholder=""> + </div> + <div> + <label for="iban">{{ trans('beitritt.abbuchung.6') }}</label> + <input type="text" class="form-control beitritt-input" name="iban" maxlength="22" placeholder=""> </div> <div> - <div> - <label for="ort2">{{ trans('beitritt.abbuchung.8') }}</label> - <input type="text" class="form-control beitritt-input" id="ort2" placeholder=""> - </div> - <p class="signature">{{ trans('beitritt.unterschrift') }}</p> + <label for="bic">{{ trans('beitritt.abbuchung.7') }}</label> + <input type="text" class="form-control beitritt-input" name="bic" placeholder=""> </div> - </form> + </div> + <div> + <label for="ort2">{{ trans('beitritt.abbuchung.8') }}</label> + <input type="text" class="form-control beitritt-input" id="ort2" placeholder=""> + <br> + <p class="signature">{{ trans('beitritt.unterschrift') }}</p> + </div> + <hr> <div class="beitritt-formular-info"> <p>{{ trans('beitritt.anweisung.1') }}</p> <ul class="dotlist"> @@ -101,6 +102,6 @@ <p>{{ trans('beitritt.anweisung.6') }}</p> </div> </div> +</form> <button type="button" class="noprint js-only btn btn-lg btn-primary" onclick="window.print();">{{ trans('beitritt.anweisung.7') }}</button> - <!-- <script src="{{ mix('js/scriptJoinPage.js') }}"></script> --> @endsection diff --git a/webpack.mix.js b/webpack.mix.js index c7b1272ea7b5c6cb1602b6eb89379e659fd37456..f8fd523975b1abf39d72da6c30d657e924d11004 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -26,5 +26,6 @@ mix .babel('resources/assets/js/focus-creator.js', 'public/js/focus-creator.js') // utility .babel(['resources/assets/js/utility.js', 'resources/assets/js/translations.js'], 'public/js/utility.js') + .babel('resources/assets/js/scriptJoinPage.js', 'public/js/scriptJoinPage.js') .sourceMaps(false, 'inline-source-map') .version(); \ No newline at end of file