From 63996b4c7549a807cbb358a6d1a72596ace95a15 Mon Sep 17 00:00:00 2001 From: Adrien Bourmault Date: Sat, 30 Apr 2022 18:58:29 +0200 Subject: [PATCH] CSS pour les formulaires --- form.css | 114 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 114 insertions(+) create mode 100644 form.css diff --git a/form.css b/form.css new file mode 100644 index 0000000..d75cb4e --- /dev/null +++ b/form.css @@ -0,0 +1,114 @@ +/* +======================================================================== + Description : CSS stylesheet + Author : neox + Website : https://a-lec.org + License : AGPL +======================================================================== +*/ + +form { + margin-top: 20px; + display: table; + margin-left: auto; + margin-right: auto; +} + +form *{ + padding: 5px; + margin: 10px; + line-height: 20px; + text-justify: none; +} + +form p { + display: table-row; +} + +form label { + display: table-cell; + text-align: left; +} + +input[type=radio] { + all: revert; + margin-top: 20px; +} + +.input-symbol-euro { + position: relative; + } + .input-symbol-euro { + margin-left: -5px; + padding-top: 0px; + } + + .input-symbol-euro::after { + position: absolute; + top: 0; + content:"€"; + font-size: 120%; +} + +form .mode { + display: table-cell; +} + +form .renseignements { + display: table-cell; + border-bottom: 2px solid var(--a-lec_blue); + border-radius: 3px; + background-color: lightcyan; + padding: 5px; + color: black; + width: 100%; +} + +form .renseignements:focus { + border-bottom: 2px solid var(--a-lec_red); + border-radius: 3px; + background-color: lightsalmon; +} + +form select { + border-bottom: 2px solid var(--a-lec_blue); + border-radius: 3px; + background-color: lightcyan; + padding: 5px; +} + +form .validation { + background-color: var(--a-lec_blue); + box-shadow: 3px 3px 5px grey; + color: white; + font-weight: bold; + border: none; + cursor: pointer; + float: right; + margin-bottom: -10px; + margin-top: 15px; +} + +form .validation:focus { + display: table-cell; + background-color: var(--a-lec_red); + color: white; + font-weight: bold; + cursor: pointer; + box-shadow: none; +} + +/* +======================================================================== + LITTLE SCREENS +======================================================================== +*/ +@media screen and (max-width: 1100px) { + .mode_radio { + display: block; + } + + .mode_radio span { + display: block; + } +} \ No newline at end of file