design_element_state.md

@@ -9,7 +9,7 @@ Different states:
 - active: some buttons acts as as a toggle, which can be activated or de-activated
 - disabled: the button can't be accessed
 
-= Grid item
+# Grid item
 
 | state  | light | dark |
 | ------ |------ | ------ |
@@ -21,7 +21,7 @@ Different states:
 | selected + hover/focus | ![Screenshot_20210421_165323](uploads/99662f78549dc859792a1fafe181e687/Screenshot_20210421_165323.png) | ![Screenshot_20210421_165531](uploads/e093dbdc0eaf8bbf0f5e164c0c486104/Screenshot_20210421_165531.png) |
 
 
-= List item
+# List item
 
 
 | state  | light  | dark |
@@ -35,7 +35,7 @@ Different states:
 
 
 
-= Tab bar button
+# Tab bar button
 
 | state  | light  | dark |
 | ------ |------ | ------ |
@@ -47,7 +47,7 @@ Different states:
 
 
 
-= Playlist
+# Playlist
 
 | state  | dark  | light |
 | ------ |------ | ------ |
@@ -59,7 +59,7 @@ Different states:
 | selected + hover/focus |![Screenshot_20210421_171727](uploads/7d6def03a6f34846ff765265480c7471/Screenshot_20210421_171727.png) |![Screenshot_20210421_172054](uploads/745ce157e5777768223bbca199d541df/Screenshot_20210421_172054.png)
 
 
-= playlist buttons
+# playlist buttons
 
 | state  | light  | dark |
 | ------ |------ | ------ |
@@ -70,7 +70,26 @@ Different states:
 | disabled | ![Screenshot_20210421_180455](uploads/f7e8ebdd3aeb9d2bee9a94a96ae9530c/Screenshot_20210421_180455.png) | ![Screenshot_20210421_180657](uploads/8723a3f8957a265f9aa1e0685507746a/Screenshot_20210421_180657.png)
 
 
-= drop-down
+# player controler buttons
+
+| state  | light  | dark |
+| ------ |------ | ------ |
+| normal (loop) | ![Screenshot_20210421_181848](uploads/e78a004be5dbd3e6a4920d47016cde34/Screenshot_20210421_181848.png) | ![Screenshot_20210421_182238](uploads/af84649e0105ca1651d59417d4249a44/Screenshot_20210421_182238.png)
+| hover  (loop) | ![Screenshot_20210421_181907](uploads/4618b325a977da7e21522dcdfb50be15/Screenshot_20210421_181907.png) | ![Screenshot_20210421_182306](uploads/15d995154c3cc569a3a4e55157ccbc0f/Screenshot_20210421_182306.png)
+| active (loop) | ![Screenshot_20210421_181920](uploads/c5c190849f11b398e9b7155bd65981e7/Screenshot_20210421_181920.png) | ![Screenshot_20210421_182328](uploads/b78780265abdc50480b5f9ffa7574ca0/Screenshot_20210421_182328.png)
+| active + hover (loop) | ![Screenshot_20210421_182013](uploads/90459357d244d7a4e0e7b3a64072123d/Screenshot_20210421_182013.png) | ![Screenshot_20210421_182341](uploads/3b6b7d12d55e32589b6d7137124517fa/Screenshot_20210421_182341.png)
+| disabled (prev) | ![Screenshot_20210421_182139](uploads/fe14212b3284564069c9323fd6ededef/Screenshot_20210421_182139.png) | ![Screenshot_20210421_182328](uploads/b78780265abdc50480b5f9ffa7574ca0/Screenshot_20210421_182328.png)
+
+# Play button
+
+| state  | light  | dark |
+| ------ |------ | ------ |
+| normal | ![Screenshot_20210421_182716](uploads/30733617623faff87d63ba294fdf9756/Screenshot_20210421_182716.png) | ![Screenshot_20210421_182856](uploads/fffe5628f207dad2eb8954dc0a5cdad8/Screenshot_20210421_182856.png)
+| hover/focused  | ![Screenshot_20210421_182729](uploads/bea53f33d78224dbc37bda126cd74f8c/Screenshot_20210421_182729.png) | ![Screenshot_20210421_182913](uploads/73c800ba50b27d82e50c6056097d5e81/Screenshot_20210421_182913.png)
+
+
+
+# drop-down
 
 fewer state possible only active, and hovered/focused: 
 
@@ -79,6 +98,19 @@ light
 dark
 ![Screenshot_20210421_181103](uploads/896afd04d863386c0cab12c9f3d309ce/Screenshot_20210421_181103.png)
 
+# text entry / search box
+
+| state  | light  | dark |
+| ------ |------ | ------ |
+| normal | ![Screenshot_20210421_183201](uploads/5567ff0ee138ad57bad926de965b45a3/Screenshot_20210421_183201.png) | ![Screenshot_20210421_183317](uploads/52f93fe8bc135b9cdf50fcbe10ad736a/Screenshot_20210421_183317.png)
+| hover  | ![Screenshot_20210421_183241](uploads/af5552cc85381b3dd3f4e9dca28e290e/Screenshot_20210421_183241.png) | ![Screenshot_20210421_183328](uploads/2ba325874813d2f3bc40ab1b13a3ebfa/Screenshot_20210421_183328.png)
+| focused | ![Screenshot_20210421_183251](uploads/bc20dde2fdf0165b649481271815c4ab/Screenshot_20210421_183251.png) | ![Screenshot_20210421_183338](uploads/9d28c16f37c212271c61a5ae23f82259/Screenshot_20210421_183338.png)
+
+
+
+# track selection menu
+
+
 
 
 | state  | light  | dark |