Jingga/cssOMS
1
0
Fork 0
mirror of https://github.com/Karaka-Management/cssOMS.git synced 2026-02-14 00:38:40 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Make inputs a little bit nicer

Browse Source
This commit is contained in:
Dennis Eichhorn 2017-04-16 11:19:26 +02:00
parent 55a755f26e
commit f561e9dc49
2 changed files with 32 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
input.scss
View File

@ -28,19 +28,23 @@ input[type="datetime-local"] {
background: #fff; background: #fff;
width: 100%; width: 100%;
min-width: 70px; min-width: 70px;
font-size: 1.0em; font-size: 1.0rem;
height: 2em; height: 2rem;
line-height: 2em; padding: 10px;
padding: 0 10px 0 10px;
border: solid 1px #dcdcdc; border: solid 1px #dcdcdc;
transition: background 0.3s, border 0.3s; transition: background 0.3s, border 0.3s;
box-shadow: inset 1px 1px 4px -2px #c5c5c5; box-shadow: inset 1px 1px 4px -2px #c5c5c5;
&:focus {
border-color:#0c69d6;
}
} }
input[type="file"] { input[type="file"] {
border: solid 1px #dcdcdc; border: solid 1px #dcdcdc;
width: 100%; width: 100%;
color: #454545; color: #454545;
padding: 10px;
} }
input[placeholder], textarea { input[placeholder], textarea {
@ -82,10 +86,6 @@ input[type="range"] {
cursor: pointer; cursor: pointer;
} }
input[type="password"]:focus,
input[type="text"]:focus {
}
.input { .input {
width: 100%; width: 100%;
min-width: 120px; min-width: 120px;
@ -97,15 +97,14 @@ input[type="text"]:focus {
@include box-sizing(border-box); @include box-sizing(border-box);
display: inline-block; display: inline-block;
background: #fff; background: #fff;
height: 2em; height: 2rem;
font-size: 1em; font-size: 1rem;
line-height: 2em;
padding: 0;
min-width: 40px; min-width: 40px;
border-left: solid 1px #dcdcdc; border-left: solid 1px #dcdcdc;
border-top: solid 1px #dcdcdc; border-top: solid 1px #dcdcdc;
border-bottom: solid 1px #dcdcdc; border-bottom: solid 1px #dcdcdc;
border-right: none; border-right: none;
padding: 0;
position: relative; position: relative;
vertical-align: middle; vertical-align: middle;

32
styles.css
View File

@ -260,8 +260,8 @@ article {
* Copyright (c) 2016 Daniel Eden * Copyright (c) 2016 Daniel Eden
*/ */
.animated { .animated {
-webkit-animation-duration: 0.2s; -webkit-animation-duration: 0.5s;
animation-duration: 0.2s; animation-duration: 0.5s;
-webkit-animation-fill-mode: both; -webkit-animation-fill-mode: both;
animation-fill-mode: both; } animation-fill-mode: both; }
@ -3725,18 +3725,29 @@ input[type="datetime-local"] {
background: #fff; background: #fff;
width: 100%; width: 100%;
min-width: 70px; min-width: 70px;
font-size: 1.0em; font-size: 1.0rem;
height: 2em; height: 2rem;
line-height: 2em; padding: 10px;
padding: 0 10px 0 10px;
border: solid 1px #dcdcdc; border: solid 1px #dcdcdc;
transition: background 0.3s, border 0.3s; transition: background 0.3s, border 0.3s;
box-shadow: inset 1px 1px 4px -2px #c5c5c5; } box-shadow: inset 1px 1px 4px -2px #c5c5c5; }
.textarea:focus,
textarea:focus,
select:focus,
input[type="password"]:focus,
input[type="text"]:focus,
input[type="datetime"]:focus,
input[type="email"]:focus,
input[type="date"]:focus,
input[type="number"]:focus,
input[type="datetime-local"]:focus {
border-color: #0c69d6; }
input[type="file"] { input[type="file"] {
border: solid 1px #dcdcdc; border: solid 1px #dcdcdc;
width: 100%; width: 100%;
color: #454545; } color: #454545;
padding: 10px; }
input[placeholder], textarea { input[placeholder], textarea {
font-family: 'FontAwesome', serif; } font-family: 'FontAwesome', serif; }
@ -3784,15 +3795,14 @@ input[type="range"] {
box-sizing: border-box; box-sizing: border-box;
display: inline-block; display: inline-block;
background: #fff; background: #fff;
height: 2em; height: 2rem;
font-size: 1em; font-size: 1rem;
line-height: 2em;
padding: 0;
min-width: 40px; min-width: 40px;
border-left: solid 1px #dcdcdc; border-left: solid 1px #dcdcdc;
border-top: solid 1px #dcdcdc; border-top: solid 1px #dcdcdc;
border-bottom: solid 1px #dcdcdc; border-bottom: solid 1px #dcdcdc;
border-right: none; border-right: none;
padding: 0;
position: relative; position: relative;
vertical-align: middle; vertical-align: middle;
flex-grow: 0; flex-grow: 0;