Redesign page + Webhook notifications #43
4 changed files with 80 additions and 48 deletions
Apply new design to the rest of the website
- Change students' association logo to the version with the university name - translate the login screen to german - fix a typo on the job offer creation screen - update CSS
commit
4a5a0a2d4b
|
|
@ -69,6 +69,10 @@ h3 {
|
|||
align-self: stretch;
|
||||
}
|
||||
|
||||
.menu a {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.header-banner {
|
||||
background: orange;
|
||||
}
|
||||
|
|
@ -129,7 +133,7 @@ body {
|
|||
}
|
||||
|
||||
body main {
|
||||
margin: 10px;
|
||||
margin: calc(2 * var(--default-padding));
|
||||
}
|
||||
|
||||
.header-main {
|
||||
|
|
@ -156,16 +160,17 @@ body main {
|
|||
|
||||
.login-form {
|
||||
display: grid;
|
||||
grid-gap: 5px;
|
||||
grid-template: [retry-msg] "m m"
|
||||
[username] "ul ui"
|
||||
[password] "pl pi"
|
||||
[submit] "sb empty";
|
||||
padding: 5px;
|
||||
grid-gap: var(--default-padding);
|
||||
grid-template: [retry-msg] "m m"[username] "ul ui"[password] "pl pi"[submit] "sb empty";
|
||||
padding: var(--default-padding);
|
||||
border-style: solid;
|
||||
border-color: gray;
|
||||
border-radius: 20px;
|
||||
border-width: 2px;
|
||||
border-color: var(--blue);
|
||||
border-width: var(--default-padding);
|
||||
border-radius: var(--default-padding);
|
||||
-webkit-border-radius: var(--default-padding);
|
||||
-moz-border-radius: var(--default-padding);
|
||||
-ms-border-radius: var(--default-padding);
|
||||
-o-border-radius: var(--default-padding);
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -209,7 +214,7 @@ body main {
|
|||
[advanced] "ao ao"
|
||||
[submit] "sb sb"
|
||||
[footnote] "fn fn";
|
||||
padding: 5px;
|
||||
padding: var(--default-padding);
|
||||
}
|
||||
|
||||
.advanced-options {
|
||||
|
|
@ -293,39 +298,52 @@ body main {
|
|||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
grid-gap: 5px;
|
||||
grid-gap: var(--default-padding);
|
||||
}
|
||||
|
||||
.joboffer-index-entry {
|
||||
width: 25em;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
width: 25rem;
|
||||
margin: var(--default-padding);
|
||||
padding: var(--default-padding);
|
||||
border-style: solid;
|
||||
border-color: gray;
|
||||
border-radius: 20px;
|
||||
border-width: 2px;
|
||||
border-color: var(--green);
|
||||
border-width: var(--default-padding);
|
||||
border-radius: var(--default-padding);
|
||||
-webkit-border-radius: var(--default-padding);
|
||||
-moz-border-radius: var(--default-padding);
|
||||
-ms-border-radius: var(--default-padding);
|
||||
-o-border-radius: var(--default-padding);
|
||||
}
|
||||
|
||||
.joboffer-index-entry.AwaitingReview, .joboffer-index-entry.UnPublished {
|
||||
background: pink;
|
||||
background: var(--light-yellow);
|
||||
border-style: dashed;
|
||||
border-color: var(--yellow);
|
||||
}
|
||||
|
||||
.joboffer-index-entry:target {
|
||||
background: LemonChiffon;
|
||||
background: var(--light-green);
|
||||
border-color: var(--dark-green);
|
||||
}
|
||||
|
||||
.column, .submission-preview {
|
||||
flex-direction: column
|
||||
flex-direction: column;
|
||||
gap: var(--default-padding);
|
||||
}
|
||||
|
||||
.link-button {
|
||||
margin: 5px;
|
||||
margin: var(--default-padding);
|
||||
border: solid;
|
||||
border-radius: 10px;
|
||||
border-color: black;
|
||||
color: black;
|
||||
padding: 5px;
|
||||
color: white;
|
||||
padding: var(--default-padding);
|
||||
text-decoration: none;
|
||||
background-color: var(--dark-blue);
|
||||
border-color: var(--blue);
|
||||
border-radius: var(--default-padding);
|
||||
-webkit-border-radius: var(--default-padding);
|
||||
-moz-border-radius: var(--default-padding);
|
||||
-ms-border-radius: var(--default-padding);
|
||||
-o-border-radius: var(--default-padding);
|
||||
}
|
||||
|
||||
.expired, .unconfirmed, .unreviewed {
|
||||
|
|
@ -347,7 +365,12 @@ body main {
|
|||
.modal-confirm-box {
|
||||
display: inline-block;
|
||||
border-style: solid;
|
||||
border-radius: 5px;
|
||||
border-color: var(--dark-blue);
|
||||
border-radius: var(--default-padding);
|
||||
-webkit-border-radius: var(--default-padding);
|
||||
-moz-border-radius: var(--default-padding);
|
||||
-ms-border-radius: var(--default-padding);
|
||||
-o-border-radius: var(--default-padding);
|
||||
}
|
||||
|
||||
input.modal-open-check:not(:checked)+.modal-confirm-box {
|
||||
|
|
@ -355,15 +378,23 @@ input.modal-open-check:not(:checked)+.modal-confirm-box {
|
|||
}
|
||||
|
||||
.modal-confirm-box>.modal-open-button.confirm {
|
||||
background-color: lightgreen;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
background-color: var(--green);
|
||||
padding: var(--default-padding);
|
||||
border-radius: var(--default-padding);
|
||||
-webkit-border-radius: var(--default-padding);
|
||||
-moz-border-radius: var(--default-padding);
|
||||
-ms-border-radius: var(--default-padding);
|
||||
-o-border-radius: var(--default-padding);
|
||||
}
|
||||
|
||||
.modal-confirm-box>.modal-open-button.retract {
|
||||
background-color: tomato;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
background-color: var(--yellow);
|
||||
padding: var(--default-padding);
|
||||
border-radius: var(--default-padding);
|
||||
-webkit-border-radius: var(--default-padding);
|
||||
-moz-border-radius: var(--default-padding);
|
||||
-ms-border-radius: var(--default-padding);
|
||||
-o-border-radius: var(--default-padding);
|
||||
}
|
||||
|
||||
input.modal-open-check:checked+.modal-confirm-box>.modal-open-button {
|
||||
|
|
@ -407,26 +438,27 @@ input.modal-open-check:not(:checked)+.modal-confirm-box>.modal-submit-button {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
position: sticky;
|
||||
background: var(--light-green);
|
||||
top: 120px;
|
||||
top: 8rem;
|
||||
box-sizing: border-box;
|
||||
left: 0;
|
||||
margin-bottom: 5px;
|
||||
padding: 5px;
|
||||
width: 100%;
|
||||
box-shadow: 0px 0px 10px 0px gray;
|
||||
background: white;
|
||||
margin-bottom: var(--default-padding);
|
||||
padding: var(--default-padding);
|
||||
border: var(--default-padding) solid var(--blue);
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.joboffer-filters>.filter-label[for="awaiting-review"] {
|
||||
margin-left: var(--default-padding);
|
||||
border: solid;
|
||||
padding: 5px;
|
||||
border-color: gray;
|
||||
padding: var(--default-padding);
|
||||
border-color: var(--yellow);
|
||||
border-radius: 20px;
|
||||
border-width: 2px;
|
||||
border-width: var(--default-padding);
|
||||
}
|
||||
|
||||
#awaiting-review:checked~.joboffer-filters>.filter-label[for="awaiting-review"] {
|
||||
background: cyan;
|
||||
background: var(--light-yellow);
|
||||
}
|
||||
|
||||
#awaiting-review:checked~.joboffer-index>.joboffer-index-entry:not(.AwaitingReview) {
|
||||
|
|
|
|||
|
|
@ -6,9 +6,9 @@
|
|||
<div class="message">Username or Password incorrect!</div>
|
||||
{{/if}}
|
||||
|
||||
<label class="username-label" for="login-username">Username</label> <input id="login-username" class="username-input" type="text" name="username" autocomplete="username" required>
|
||||
<label class="password-label" for="login-password">Password</label> <input id="login-password" class="password-input" type="password" name="password" autocomplete="current-password" required><br />
|
||||
<button class="submit-button" type="submit">Login</button>
|
||||
<label class="username-label" for="login-username">Benutzername</label> <input id="login-username" class="username-input" type="text" name="username" autocomplete="username" required>
|
||||
<label class="password-label" for="login-password">Passwort</label> <input id="login-password" class="password-input" type="password" name="password" autocomplete="current-password" required><br />
|
||||
<button class="submit-button" type="submit">Anmelden</button>
|
||||
</form>
|
||||
</div>
|
||||
{{/base}}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<nav class="header-inner">
|
||||
<div class="header-top">
|
||||
<a class="header-element" href="https://www.fs-infmath.uni-kiel.de/wiki/Hauptseite">
|
||||
<img src="https://www.fs-infmath.uni-kiel.de/w/images/b/b6/Logo_gro%C3%9F_bunt.svg">
|
||||
<img src="https://www.fs-infmath.uni-kiel.de/w/images/9/9f/Logo_gro%C3%9F_bunt_kiel.svg">
|
||||
</a>
|
||||
<a class="header-element" href="{{base.routes.index}}">
|
||||
<h1>Jobbörse</h1>
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
<label class="backdate-title" for="offer-backdate">Eingangsdatum (optionale Rückdatierung)</label>
|
||||
<input class="backdate-select" id="offer-backdate" type="datetime-local" name="backdate"><br />
|
||||
|
||||
<label class="review-title" for="approval"checked>Als bereits ge-reviwed markieren</label>
|
||||
<label class="review-title" for="approval"checked>Als bereits ge-reviewed markieren</label>
|
||||
<input id="approval" class="review-checkbox" type="checkbox" name="pre_approved" value="approved" checked><br />
|
||||
|
||||
<label class="review-title" for="confirmation">Bestätigungsmail für diese Anzeige überspringen</label>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue