mirror_css/css-water.css
1
0
Fork 0
mirror of https://github.com/kognise/water.css.git synced 2025-08-20 11:51:58 +02:00
Code Issues Releases Wiki Activity

Added approach for new select

Browse Source 
select tag is styled in a new way
added preview for select tag
This commit is contained in:
Alexander Bluhm
2019-04-20 18:53:41 +02:00
committed by Jonas Kuske
parent 03269b4896
commit 8a1150d3c2
2 changed files with 13 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
index.html
View File

@@ -73,6 +73,13 @@
<label for='about'>About me</label>
<textarea name='about' id='about' placeholder='I am a textarea...'></textarea>
<label for='drink'>Select your favorite drink</label>
<select name='drink' id='drink'>
<option value='mojito'>Mojito</option>
<option value='water'>Water</option>
<option value='lemon'>Lemon juice</option>
</select>
<label>Choose a Doe:</label>
<div>
<input type='radio' id='john' name='drone' value='john' checked>

6
src/parts/_forms.css
View File

@@ -43,6 +43,12 @@ textarea {
resize: vertical;
}
select {
background: url("data:image/svg+xml;utf8,<svg fill='#{$form-text}' viewBox='0 0 140 140' width='24' height='24' xmlns='http://www.w3.org/2000/svg'><g><path d='m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z'/></g></svg>")
calc(100% - 12px) 50% / 12px no-repeat var(--background);
padding-right: 35px;
}
button,
input[type='submit'],
input[type='button'] {