alpcentaur
/
wmdeit_kaform
0
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 3 Wiki Activity
Browse Source

Responsive table

master
Tobias Herre 3 years ago
parent
3d868cc774
commit
a16ef8a316
5 changed files with 23 additions and 25 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +0
    -1
      form.php
  2. +1
    -0
      index.php
  3. +7
    -6
      kaform.js
  4. +8
    -9
      master.css
  5. +7
    -9
      master.scss

+ 0
- 1
form.php View File

@ -92,7 +92,6 @@
<div class="is-row"> <div class="is-row">
<div class="is-col"> <div class="is-col">
<input type="input" size="32" id="n_iban" name="n_iban" placeholder="<?=_("Kontonummer*")?>" /> <input type="input" size="32" id="n_iban" name="n_iban" placeholder="<?=_("Kontonummer*")?>" />
</div> </div>
<div class="is-col"> <div class="is-col">
<input type="input" size="32" id="n_bic" name="n_bic" placeholder="<?=_("BIC/SWIFT*")?>" /> <input type="input" size="32" id="n_bic" name="n_bic" placeholder="<?=_("BIC/SWIFT*")?>" />

+ 1
- 0
index.php View File

@ -36,6 +36,7 @@
</head> </head>
<body> <body>
<div class="page is-container"> <div class="page is-container">
<div class="main-sidebar text-centered"> <div class="main-sidebar text-centered">
<img class="wmdelogo" alt="wikimedia logo" src="Wikimedia_Deutschland-Logo.svg"/> <img class="wmdelogo" alt="wikimedia logo" src="Wikimedia_Deutschland-Logo.svg"/>

+ 7
- 6
kaform.js View File

@ -148,7 +148,7 @@ function getUploadField(rid)
data-url="upload.php?row=${rid}" data-url-remove="delete.php" data-url="upload.php?row=${rid}" data-url-remove="delete.php"
data-progress="true" data-progress="true"
data-size="40" data-size="40"
data-placeholder="drag!">
data-placeholder="Datei">
</div> </div>
<div id="upload-target${rid}" class="upload-target small"></div> <div id="upload-target${rid}" class="upload-target small"></div>
</div> </div>
@ -165,13 +165,13 @@ function getRow(rid,num) {
+ `${num}` + `${num}`
+"</td>" +"</td>"
+ "<td data-label=\"Datum\">" + "<td data-label=\"Datum\">"
+ `<input name="date[${rid}]" value="" type="date" placeholder="Datum*"/>`
+ `<input class="tab_input" name="date[${rid}]" value="" type="date" placeholder="Datum*"/>`
+ "</td>" + "</td>"
+ "<td data-label=\"Beschr.\">" + "<td data-label=\"Beschr.\">"
+ `<input name="desc[${rid}]" type="text" placeholder="Beschreibung"/>`
+ `<input class="tab_input" name="desc[${rid}]" type="text" placeholder="Beschreibung"/>`
+ "</td>" + "</td>"
+ "<td>"
+ `<input name="amount[${rid}] type="text" placeholder="0.00"/>`
+ "<td data-label=\"Betrag\">"
+ `<input class="tab_input" name="amount[${rid}] type="text" placeholder="0.00"/>`
+ "</td>" + "</td>"
+ "<td style=\"vertical-align: middle\">" + "<td style=\"vertical-align: middle\">"
+ cur + cur
@ -192,7 +192,8 @@ function getRow(rid,num) {
`<td><span `<td><span
onclick="deleteTableRow(${rid})" onclick="deleteTableRow(${rid})"
class="close is-large"> class="close is-large">
</span></td>`;
</span>
</td>`;
} }

+ 8
- 9
master.css View File

@ -1,9 +1,9 @@
body { body {
margin: auto; margin: auto;
padding: 1em; padding: 1em;
border: 1px solid red;
border: 0px solid red;
max-width: 90em; max-width: 90em;
min-width: 75em;
min-width: 78em;
} }
@media only screen and (max-width: 767px) { @media only screen and (max-width: 767px) {
body { body {
@ -19,14 +19,13 @@ body {
} }
} }
input {
width: 50%;
.tab_input {
display: inline;
} }
table {
text-align: right;
border: 1px solid red;
background-color: red;
@media only screen and (max-width: 767px) {
.tab_input {
width: 50%;
}
} }
@media only screen and (max-width: 767px) { @media only screen and (max-width: 767px) {

+ 7
- 9
master.scss View File

@ -7,9 +7,9 @@
body { body {
margin: auto; margin: auto;
padding:1em; padding:1em;
border:1px solid red;
border:0px solid red;
max-width:90em; max-width:90em;
min-width:75em;
min-width:78em;
@include for-mobile { @include for-mobile {
min-width: 2em; min-width: 2em;
padding:0.5em; padding:0.5em;
@ -23,13 +23,11 @@ fieldset {
} }
} }
input {
width:50%;
}
table {
text-align:right;
border:1px solid red;
background-color:red;
.tab_input {
display:inline;
@include for-mobile {
width:50%;
}
} }
h1 { h1 {

Write Preview
Loading…
Cancel
Save