2018-12-26 08:45:53 +01:00
<!DOCTYPE html>
2019-01-03 23:30:27 +01:00
< html lang = "en" >
2018-12-26 08:45:53 +01:00
< head >
< meta charset = "utf-8" >
2018-12-28 15:27:01 +01:00
< meta name = "theme-color" content = "#262831" >
2018-12-26 08:45:53 +01:00
< meta name = "viewport" content = "width=device-width, initial-scale=1, user-scalable=no" >
< title > New Tab< / title >
< link rel = "stylesheet" href = "css/reset.css" >
2018-12-26 18:43:38 +01:00
< link rel = "stylesheet" href = "css/base.css" >
2019-02-16 23:27:54 +01:00
< link rel = "stylesheet" href = "css/animation.css" >
2018-12-26 08:45:53 +01:00
< link rel = "stylesheet" href = "css/fonts.css" >
< link rel = "stylesheet" href = "css/icons.css" >
2019-01-03 23:30:27 +01:00
< link rel = "stylesheet" href = "css/state.css" >
2018-12-26 08:45:53 +01:00
< link rel = "stylesheet" href = "css/utilities.css" >
< link rel = "stylesheet" href = "css/typography.css" >
2019-01-03 23:30:27 +01:00
< link rel = "stylesheet" href = "css/container.css" >
2018-12-26 18:43:38 +01:00
< link rel = "stylesheet" href = "css/spacing.css" >
2018-12-26 08:45:53 +01:00
< link rel = "stylesheet" href = "css/button.css" >
< link rel = "stylesheet" href = "css/form.css" >
< link rel = "stylesheet" href = "css/shade.css" >
< link rel = "stylesheet" href = "css/modal.css" >
2019-01-06 08:06:33 +01:00
< link rel = "stylesheet" href = "css/tip.css" >
2019-01-03 23:30:27 +01:00
< link rel = "stylesheet" href = "css/menu.css" >
2019-01-05 21:57:21 +01:00
< link rel = "stylesheet" href = "css/header.css" >
< link rel = "stylesheet" href = "css/date.css" >
2018-12-26 08:45:53 +01:00
< link rel = "stylesheet" href = "css/clock.css" >
2019-03-26 00:31:51 +01:00
< link rel = "stylesheet" href = "css/greeting.css" >
2018-12-26 08:45:53 +01:00
< link rel = "stylesheet" href = "css/search.css" >
2019-01-24 21:28:11 +01:00
< link rel = "stylesheet" href = "css/background.css" >
2019-01-03 23:30:27 +01:00
< link rel = "stylesheet" href = "css/link.css" >
2018-12-26 08:45:53 +01:00
< / head >
< body >
2019-01-24 21:28:11 +01:00
< div class = "background" >
< div class = "background-image" > < / div >
< div class = "background-accent" > < / div >
< / div >
2018-12-26 08:45:53 +01:00
2019-01-03 23:30:27 +01:00
< header class = "header" >
2019-02-16 23:27:54 +01:00
< div class = "header-shade" > < / div >
< div class = "header-border" > < / div >
2019-01-03 23:30:27 +01:00
< div class = "container" >
< div class = "header-area" >
2019-03-26 00:31:51 +01:00
< div class = "header-item header-greeting" >
< p class = "greeting" > < / p >
< / div >
2019-01-03 23:30:27 +01:00
< div class = "header-item header-clock" >
2018-12-26 08:45:53 +01:00
< p class = "clock" > < / p >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "header-item header-date" >
< p class = "date" > < / p >
< / div >
2019-01-03 23:30:27 +01:00
< div class = "header-item header-search" >
< form class = "search" action = "" method = "get" >
2019-01-24 21:28:11 +01:00
< input class = "header-search-input search-input mb-0" type = "text" placeholder = "Find or Search" name = "q" autocomplete = "off" autocorrect = "off" autocapitalize = "off" spellcheck = "false" tabindex = "1" >
2018-12-26 08:45:53 +01:00
< input type = "submit" value = "Search" class = "is-hidden" >
< / form >
2019-01-24 21:28:11 +01:00
< button class = "button button-link mb-0 header-search-clear search-clear" tabindex = "1" disabled >
2018-12-26 08:45:53 +01:00
< span class = "icon-close" > < / span >
< / button >
< / div >
2019-01-03 23:30:27 +01:00
< div class = "header-item header-edit-add" >
2019-01-04 20:53:50 +01:00
< div class = "button-group nested-button mb-0" >
2019-01-03 23:30:27 +01:00
< div class = "checkbox-wrap" >
< input id = "control-edit" class = "control-edit" type = "checkbox" tabindex = "1" >
2019-01-06 08:06:33 +01:00
< label for = "control-edit" class = "button input-label-button" >
2019-01-03 23:30:27 +01:00
< div class = "button-text" > Edit< / div >
< / label >
< / div >
< button class = "button control-add" tabindex = "1" >
< span class = "button-text" > Add< / span >
< / button >
< / div >
2018-12-27 00:46:53 +01:00
< / div >
2019-01-03 23:30:27 +01:00
< div class = "header-item header-accent" >
< div class = "input-wrap" >
2019-04-01 17:11:39 +02:00
< input id = "control-theme-accent-current" class = "control-theme-accent-current" type = "color" value = "#00ff00" tabindex = "1" >
< label for = "control-theme-accent-current" class = "button input-label-button mb-0" >
2018-12-26 08:45:53 +01:00
< span class = "button-text" > Accent< / span >
< / label >
2019-01-03 23:30:27 +01:00
< / div >
< / div >
2019-01-13 23:54:48 +01:00
< div class = "header-item header-menu" >
2019-02-03 14:51:54 +01:00
< button id = "control-menu" class = "control-menu button mb-0" tabindex = "1" >
2019-01-03 23:30:27 +01:00
< span class = "button-text" > < span class = "icon-settings" > < / span > < / span >
< / button >
2018-12-26 08:45:53 +01:00
< / div >
< / div >
< / div >
2019-01-03 23:30:27 +01:00
< / header >
2018-12-26 08:45:53 +01:00
2019-01-03 23:30:27 +01:00
< section class = "link" >
< div class = "container" >
< div class = "link-area" > < / div >
< / div >
< / section >
2018-12-26 08:45:53 +01:00
2019-01-15 13:33:15 +01:00
< section class = "menu" tabindex = "1" >
2019-01-04 20:40:49 +01:00
< div class = "menu-area" >
2019-01-14 19:22:39 +01:00
< div class = "menu-nav" >
2019-02-03 14:51:54 +01:00
< div class = "menu-nav-area menu-nav-area-grow mb-0 list-unstyled" >
2019-02-17 15:31:29 +01:00
< button class = "menu-nav-button button button-large active" data-target = ".menu-content-area-header" tabindex = "1" > Header< / button >
< button class = "menu-nav-button button button-large" data-target = ".menu-content-area-bookmarks" tabindex = "1" > Bookmarks< / button >
2019-04-01 17:11:39 +02:00
< button class = "menu-nav-button button button-large" data-target = ".menu-content-area-theme" tabindex = "1" > Theme< / button >
2019-02-17 15:31:29 +01:00
< button class = "menu-nav-button button button-large" data-target = ".menu-content-area-layout" tabindex = "1" > Layout< / button >
< button class = "menu-nav-button button button-large" data-target = ".menu-content-area-background" tabindex = "1" > Background< / button >
2019-02-03 14:51:54 +01:00
< / div >
2019-01-14 19:22:39 +01:00
< div class = "menu-nav-area" >
< button class = "menu-close button button-block button-large mb-0" tabindex = "1" > < span class = "icon-close" > < / span > < / button >
< / div >
< / div >
2019-02-03 14:51:54 +01:00
2019-01-04 20:40:49 +01:00
< div class = "menu-content" >
2019-02-03 14:51:54 +01:00
2019-01-04 20:40:49 +01:00
< div class = "menu-content-area menu-content-area-header" >
2019-03-26 00:31:51 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Greeting< / h1 >
< div class = "checkbox-wrap" >
< input id = "control-header-greeting-show" class = "control-header-greeting-show" type = "checkbox" tabindex = "1" >
< label for = "control-header-greeting-show" > < span class = "label-icon" > < / span > Show< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-header-greeting-type-good" class = "control-header-greeting-type-good" type = "radio" name = "control-header-greeting-type" value = "good" tabindex = "1" >
< label for = "control-header-greeting-type-good" > < span class = "label-icon" > < / span > "Good morning..."< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-header-greeting-type-hello" class = "control-header-greeting-type-hello" type = "radio" name = "control-header-greeting-type" value = "hello" tabindex = "1" >
< label for = "control-header-greeting-type-hello" > < span class = "label-icon" > < / span > "Hello..."< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-header-greeting-type-hi" class = "control-header-greeting-type-hi" type = "radio" name = "control-header-greeting-type" value = "hi" tabindex = "1" >
< label for = "control-header-greeting-type-hi" > < span class = "label-icon" > < / span > "Hi..."< / label >
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-header-greeting-name" > Name< / label >
< input id = "control-header-greeting-name" class = "control-header-greeting-name" type = "text" autocomplete = "off" autocorrect = "off" autocapitalize = "off" spellcheck = "false" placeholder = "Nickname, alias or superhero name" tabindex = "1" >
< / div >
< / div >
2019-01-04 17:24:05 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Clock< / h1 >
< div class = "checkbox-wrap" >
2019-01-05 21:57:21 +01:00
< input id = "control-header-clock-show-hours" class = "control-header-clock-show-hours" type = "checkbox" tabindex = "1" >
< label for = "control-header-clock-show-hours" > < span class = "label-icon" > < / span > Hours< / label >
< / div >
< div class = "checkbox-wrap" >
< input id = "control-header-clock-show-minutes" class = "control-header-clock-show-minutes" type = "checkbox" tabindex = "1" >
< label for = "control-header-clock-show-minutes" > < span class = "label-icon" > < / span > Minutes< / label >
2019-01-04 17:24:05 +01:00
< / div >
2019-01-05 21:57:21 +01:00
< div class = "checkbox-wrap" >
2019-01-04 17:24:05 +01:00
< input id = "control-header-clock-show-seconds" class = "control-header-clock-show-seconds" type = "checkbox" tabindex = "1" >
< label for = "control-header-clock-show-seconds" > < span class = "label-icon" > < / span > Seconds< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "checkbox-wrap" >
2019-01-05 23:35:50 +01:00
< input id = "control-header-clock-show-separator" class = "control-header-clock-show-separator" type = "checkbox" tabindex = "1" >
< label for = "control-header-clock-show-separator" > < span class = "label-icon" > < / span > Separators< / label >
2019-01-04 17:24:05 +01:00
< / div >
2019-01-05 21:57:21 +01:00
< div class = "checkbox-wrap" >
2019-01-04 17:24:05 +01:00
< input id = "control-header-clock-24" class = "control-header-clock-24" type = "checkbox" tabindex = "1" >
< label for = "control-header-clock-24" > < span class = "label-icon" > < / span > 24 Hours< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "checkbox-wrap" >
2019-01-04 17:24:05 +01:00
< input id = "control-header-clock-show-meridiem" class = "control-header-clock-show-meridiem" type = "checkbox" tabindex = "1" >
< label for = "control-header-clock-show-meridiem" > < span class = "label-icon" > < / span > AM/PM< / label >
< / div >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Date< / h1 >
< div class = "checkbox-wrap" >
< input id = "control-header-date-show-day" class = "control-header-date-show-day" type = "checkbox" tabindex = "1" >
< label for = "control-header-date-show-day" > < span class = "label-icon" > < / span > Day< / label >
< / div >
2019-01-24 21:28:11 +01:00
< div class = "checkbox-wrap" >
< input id = "control-header-date-show-date" class = "control-header-date-show-date" type = "checkbox" tabindex = "1" >
< label for = "control-header-date-show-date" > < span class = "label-icon" > < / span > Date< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "checkbox-wrap" >
< input id = "control-header-date-show-month" class = "control-header-date-show-month" type = "checkbox" tabindex = "1" >
< label for = "control-header-date-show-month" > < span class = "label-icon" > < / span > Month< / label >
< / div >
< div class = "checkbox-wrap" >
< input id = "control-header-date-show-year" class = "control-header-date-show-year" type = "checkbox" tabindex = "1" >
< label for = "control-header-date-show-year" > < span class = "label-icon" > < / span > Year< / label >
< / div >
< div class = "checkbox-wrap" >
2019-01-05 23:35:50 +01:00
< input id = "control-header-date-show-separator" class = "control-header-date-show-separator" type = "checkbox" tabindex = "1" >
< label for = "control-header-date-show-separator" > < span class = "label-icon" > < / span > Separators< / label >
2019-01-05 21:57:21 +01:00
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-date-character-length-short" class = "control-header-date-character-length-short" type = "radio" name = "control-header-date-character-length" value = "short" tabindex = "1" >
2019-01-05 21:57:21 +01:00
< label for = "control-header-date-character-length-short" > < span class = "label-icon" > < / span > Short text< / label >
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-date-character-length-long" class = "control-header-date-character-length-long" type = "radio" name = "control-header-date-character-length" value = "long" tabindex = "1" >
2019-01-05 21:57:21 +01:00
< label for = "control-header-date-character-length-long" > < span class = "label-icon" > < / span > Long text< / label >
< / div >
< / div >
2019-01-04 17:24:05 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Search< / h1 >
< div class = "checkbox-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-search-show" class = "control-header-search-show" type = "checkbox" tabindex = "1" >
< label for = "control-header-search-show" > < span class = "label-icon" > < / span > Show< / label >
2019-01-04 17:24:05 +01:00
< / div >
2019-01-05 21:57:21 +01:00
< div class = "checkbox-wrap form-indent-1" >
2019-01-04 17:24:05 +01:00
< input id = "control-header-search-grow" class = "control-header-search-grow" type = "checkbox" tabindex = "1" >
2019-01-25 00:21:00 +01:00
< label for = "control-header-search-grow" > < span class = "label-icon" > < / span > Grow to fill available space< / label >
< / div >
< div class = "checkbox-wrap form-indent-1" >
< input id = "control-header-search-focus" class = "control-header-search-focus" type = "checkbox" tabindex = "1" >
< label for = "control-header-search-focus" > < span class = "label-icon" > < / span > Focus on load/refresh< / label >
< p class = "input-helper small muted" > May not work in Chrome.< / p >
2019-01-04 17:24:05 +01:00
< / div >
2019-02-03 14:51:54 +01:00
< label class = "control-header-search-engine-label form-indent-1" > Engine< / label >
2019-01-05 21:57:21 +01:00
< div class = "radio-wrap form-indent-1" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-search-engine-google" class = "control-header-search-engine-google" type = "radio" name = "control-header-search-engine" value = "google" tabindex = "1" >
2019-01-04 17:24:05 +01:00
< label for = "control-header-search-engine-google" > < span class = "label-icon" > < / span > Google< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "radio-wrap form-indent-1" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-search-engine-duckduckgo" class = "control-header-search-engine-duckduckgo" type = "radio" name = "control-header-search-engine" value = "duckduckgo" tabindex = "1" >
2019-01-04 17:24:05 +01:00
< label for = "control-header-search-engine-duckduckgo" > < span class = "label-icon" > < / span > Duck Duck Go< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "radio-wrap form-indent-1" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-search-engine-giphy" class = "control-header-search-engine-giphy" type = "radio" name = "control-header-search-engine" value = "giphy" tabindex = "1" >
2019-01-04 17:24:05 +01:00
< label for = "control-header-search-engine-giphy" > < span class = "label-icon" > < / span > Giphy< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "radio-wrap form-indent-1" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-search-engine-custom" class = "control-header-search-engine-custom" type = "radio" name = "control-header-search-engine" value = "custom" tabindex = "1" >
2019-01-04 17:24:05 +01:00
< label for = "control-header-search-engine-custom" > < span class = "label-icon" > < / span > Custom< / label >
< / div >
2019-01-05 21:57:21 +01:00
< div class = "input-wrap form-indent-2" >
2019-01-04 17:24:05 +01:00
< label for = "control-header-search-engine-custom-url" > URL< / label >
2019-03-26 00:31:51 +01:00
< input id = "control-header-search-engine-custom-url" class = "control-header-search-engine-custom-url" type = "text" autocomplete = "off" autocorrect = "off" autocapitalize = "off" spellcheck = "false" placeholder = "https://" tabindex = "1" >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
< div class = "menu-item" >
2019-01-04 20:40:49 +01:00
< h1 class = "menu-header" > Buttons< / h1 >
2019-01-04 17:24:05 +01:00
< div class = "checkbox-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-edit-add-show" class = "control-header-edit-add-show" type = "checkbox" tabindex = "1" >
< label for = "control-header-edit-add-show" > < span class = "label-icon" > < / span > Show Edit/Add< / label >
2019-01-04 17:24:05 +01:00
< / div >
< div class = "checkbox-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-header-accent-show" class = "control-header-accent-show" type = "checkbox" tabindex = "1" >
< label for = "control-header-accent-show" > < span class = "label-icon" > < / span > Show Accent< / label >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
< div class = "menu-item" >
2019-01-24 21:28:11 +01:00
< h1 class = "menu-header" > Horizontal Alignment< / h1 >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-layout-alignment-horizontal-left" class = "control-layout-alignment-horizontal-left" type = "radio" name = "control-layout-alignment-horizontal" value = "left" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< label for = "control-layout-alignment-horizontal-left" > < span class = "label-icon" > < / span > Left< / label >
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-layout-alignment-horizontal-center" class = "control-layout-alignment-horizontal-center" type = "radio" name = "control-layout-alignment-horizontal" value = "center" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< label for = "control-layout-alignment-horizontal-center" > < span class = "label-icon" > < / span > Center< / label >
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-layout-alignment-horizontal-right" class = "control-layout-alignment-horizontal-right" type = "radio" name = "control-layout-alignment-horizontal" value = "right" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< label for = "control-layout-alignment-horizontal-right" > < span class = "label-icon" > < / span > Right< / label >
< / div >
2019-04-03 13:47:41 +02:00
< p class = "input-helper small muted" > Effects may not be visible if the Search box is set to grow to fill available space.< / p >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "menu-item" >
< h1 class = "menu-header" > Vertical Alignment< / h1 >
2019-01-04 17:24:05 +01:00
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-layout-alignment-vertical-top" class = "control-layout-alignment-vertical-top" type = "radio" name = "control-layout-alignment-vertical" value = "top" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< label for = "control-layout-alignment-vertical-top" > < span class = "label-icon" > < / span > Top< / label >
2019-01-04 17:24:05 +01:00
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-layout-alignment-vertical-center" class = "control-layout-alignment-vertical-center" type = "radio" name = "control-layout-alignment-vertical" value = "center" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< label for = "control-layout-alignment-vertical-center" > < span class = "label-icon" > < / span > Center< / label >
2019-01-04 17:24:05 +01:00
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-layout-alignment-vertical-bottom" class = "control-layout-alignment-vertical-bottom" type = "radio" name = "control-layout-alignment-vertical" value = "bottom" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< label for = "control-layout-alignment-vertical-bottom" > < span class = "label-icon" > < / span > Bottom< / label >
2019-01-25 00:21:00 +01:00
< p class = "input-helper small muted" > Available when Bookmarks are not shown.< / p >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
2019-02-16 23:27:54 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Background Shade< / h1 >
< div class = "checkbox-wrap" >
< input id = "control-header-shade-show" class = "control-header-shade-show" type = "checkbox" tabindex = "1" >
< label for = "control-header-shade-show" > < span class = "label-icon" > < / span > Show< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-header-shade-style-always" class = "control-header-shade-style-always" type = "radio" name = "control-header-shade-style" value = "always" tabindex = "1" >
< label for = "control-header-shade-style-always" > < span class = "label-icon" > < / span > Always visible< / label >
< p class = "input-helper small muted" > Useful for when a Background Image is shown.< / p >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-header-shade-style-scroll" class = "control-header-shade-style-scroll" type = "radio" name = "control-header-shade-style" value = "scroll" tabindex = "1" >
< label for = "control-header-shade-style-scroll" > < span class = "label-icon" > < / span > Visible on scroll< / label >
< p class = "input-helper small muted" > The page will not scroll if Bookmarks are not shown.< / p >
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-header-shade-opacity" > Opacity< / label >
< input id = "control-header-shade-opacity" class = "control-header-shade-opacity" type = "range" min = "0" max = "100" value = "0" tabindex = "1" >
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-header-shade-padding" > Top & bottom padding< / label >
2019-04-03 13:47:41 +02:00
< input id = "control-header-shade-padding" class = "control-header-shade-padding" type = "range" min = "1" max = "25" value = "0" tabindex = "1" >
2019-02-16 23:27:54 +01:00
< / div >
< div class = "checkbox-wrap form-indent-1" >
< input id = "control-header-shade-border-top" class = "control-header-shade-border-top" type = "checkbox" value = "always" tabindex = "1" >
< label for = "control-header-shade-border-top" > < span class = "label-icon" > < / span > Top border< / label >
< / div >
< div class = "checkbox-wrap form-indent-1" >
< input id = "control-header-shade-border-bottom" class = "control-header-shade-border-bottom" type = "checkbox" value = "always" tabindex = "1" >
< label for = "control-header-shade-border-bottom" > < span class = "label-icon" > < / span > Bottom border< / label >
< / div >
< / div >
2019-01-04 17:24:05 +01:00
< / div >
2019-01-04 20:40:49 +01:00
< div class = "menu-content-area menu-content-area-bookmarks is-hidden" >
2019-01-24 21:28:11 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Bookmarks< / h1 >
< div class = "checkbox-wrap" >
2019-04-01 17:11:39 +02:00
< input id = "control-bookmarks-link-show" class = "control-bookmarks-link-show" type = "checkbox" tabindex = "1" >
< label for = "control-bookmarks-link-show" > < span class = "label-icon" > < / span > Show< / label >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "checkbox-wrap form-indent-1" >
2019-04-01 17:11:39 +02:00
< input id = "control-bookmarks-name-show" class = "control-bookmarks-name-show" type = "checkbox" tabindex = "1" >
< label for = "control-bookmarks-name-show" > < span class = "label-icon" > < / span > Names< / label >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "checkbox-wrap form-indent-1" >
2019-04-01 17:11:39 +02:00
< input id = "control-bookmarks-url-show" class = "control-bookmarks-url-show" type = "checkbox" tabindex = "1" >
< label for = "control-bookmarks-url-show" > < span class = "label-icon" > < / span > URL on hover< / label >
< / div >
< div class = "radio-wrap form-indent-2" >
< input id = "control-bookmarks-url-style-dark" class = "control-bookmarks-url-style-dark" type = "radio" name = "control-bookmarks-url-style" value = "dark" tabindex = "1" >
< label for = "control-bookmarks-url-style-dark" > < span class = "label-icon" > < / span > Dark text< / label >
< / div >
< div class = "radio-wrap form-indent-2" >
< input id = "control-bookmarks-url-style-light" class = "control-bookmarks-url-style-light" type = "radio" name = "control-bookmarks-url-style" value = "light" tabindex = "1" >
< label for = "control-bookmarks-url-style-light" > < span class = "label-icon" > < / span > Light text< / label >
2019-01-24 21:28:11 +01:00
< / div >
< / div >
2019-01-04 17:24:05 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Open< / h1 >
< div class = "checkbox-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-bookmarks-new-tab" class = "control-bookmarks-new-tab" type = "checkbox" tabindex = "1" >
< label for = "control-bookmarks-new-tab" > < span class = "label-icon" > < / span > In a new tab< / label >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
< div class = "menu-item" >
< h1 class = "menu-header" > Style< / h1 >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-bookmarks-style-block" class = "control-bookmarks-style-block" type = "radio" name = "control-bookmarks-style" value = "block" tabindex = "1" >
< label for = "control-bookmarks-style-block" > < span class = "label-icon" > < / span > Block< / label >
2019-01-04 17:24:05 +01:00
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-bookmarks-style-list" class = "control-bookmarks-style-list" type = "radio" name = "control-bookmarks-style" value = "list" tabindex = "1" >
< label for = "control-bookmarks-style-list" > < span class = "label-icon" > < / span > List< / label >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
< div class = "menu-item" >
< h1 class = "menu-header" > Sort< / h1 >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-bookmarks-sort-none" class = "control-bookmarks-sort-none" type = "radio" name = "control-bookmarks-sort" value = "none" tabindex = "1" >
< label for = "control-bookmarks-sort-none" > < span class = "label-icon" > < / span > None (as added)< / label >
2019-01-04 17:24:05 +01:00
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-bookmarks-sort-name" class = "control-bookmarks-sort-name" type = "radio" name = "control-bookmarks-sort" value = "name" tabindex = "1" >
< label for = "control-bookmarks-sort-name" > < span class = "label-icon" > < / span > Name< / label >
2019-01-04 17:24:05 +01:00
< / div >
< div class = "radio-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-bookmarks-sort-letter" class = "control-bookmarks-sort-letter" type = "radio" name = "control-bookmarks-sort" value = "letter" tabindex = "1" >
< label for = "control-bookmarks-sort-letter" > < span class = "label-icon" > < / span > Letter< / label >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
< / div >
2019-02-03 14:51:54 +01:00
2019-04-01 17:11:39 +02:00
< div class = "menu-content-area menu-content-area-theme is-hidden" >
< div class = "menu-item" >
< h1 class = "menu-header" > Style< / h1 >
< div class = "radio-wrap" >
< input id = "control-theme-style-dark" class = "control-theme-style-dark" type = "radio" name = "control-theme-style" value = "dark" tabindex = "1" >
< label for = "control-theme-style-dark" > < span class = "label-icon" > < / span > Dark< / label >
< / div >
< div class = "radio-wrap" >
< input id = "control-theme-style-light" class = "control-theme-style-light" type = "radio" name = "control-theme-style" value = "light" tabindex = "1" >
< label for = "control-theme-style-light" > < span class = "label-icon" > < / span > Light< / label >
< p class = "input-helper small muted" > Accent colour may need to be changed to best fit the Theme Style.< / p >
< / div >
< / div >
< div class = "menu-item" >
< h1 class = "menu-header" > Accent< / h1 >
< div class = "checkbox-wrap" >
< input id = "control-theme-accent-random-active" class = "control-theme-accent-random-active" type = "checkbox" tabindex = "1" >
< label for = "control-theme-accent-random-active" > < span class = "label-icon" > < / span > Random Accent colour on load/refresh< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-theme-accent-random-style-any" class = "control-theme-accent-random-style-any" type = "radio" name = "control-theme-accent-random-style" value = "any" tabindex = "1" >
< label for = "control-theme-accent-random-style-any" > < span class = "label-icon" > < / span > Any colour< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-theme-accent-random-style-light" class = "control-theme-accent-random-style-light" type = "radio" name = "control-theme-accent-random-style" value = "light" tabindex = "1" >
< label for = "control-theme-accent-random-style-light" > < span class = "label-icon" > < / span > Light colours< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-theme-accent-random-style-dark" class = "control-theme-accent-random-style-dark" type = "radio" name = "control-theme-accent-random-style" value = "dark" tabindex = "1" >
< label for = "control-theme-accent-random-style-dark" > < span class = "label-icon" > < / span > Dark colours< / label >
< / div >
< div class = "radio-wrap form-indent-1" >
< input id = "control-theme-accent-random-style-pastel" class = "control-theme-accent-random-style-pastel" type = "radio" name = "control-theme-accent-random-style" value = "pastel" tabindex = "1" >
< label for = "control-theme-accent-random-style-pastel" > < span class = "label-icon" > < / span > Pastel colours< / label >
< / div >
< div class = "radio-wrap form-indent-1 mb-3" >
< input id = "control-theme-accent-random-style-saturated" class = "control-theme-accent-random-style-saturated" type = "radio" name = "control-theme-accent-random-style" value = "saturated" tabindex = "1" >
< label for = "control-theme-accent-random-style-saturated" > < span class = "label-icon" > < / span > Saturated colours< / label >
< / div >
< div class = "button-wrap form-indent-1" >
< button class = "control-theme-accent-randomise" type = "button" > Randomise now< / button >
< / div >
< / div >
< / div >
2019-01-04 20:40:49 +01:00
< div class = "menu-content-area menu-content-area-layout is-hidden" >
2019-01-04 17:24:05 +01:00
< div class = "menu-item" >
2019-04-03 13:47:41 +02:00
< h1 class = "menu-header" > Content container< / h1 >
< div class = "input-wrap" >
< label for = "control-layout-width" > Width< / label >
< input id = "control-layout-width" class = "control-layout-width" type = "range" min = "30" max = "100" value = "0" tabindex = "1" >
2019-01-04 17:24:05 +01:00
< / div >
< / div >
2019-01-04 19:23:24 +01:00
< div class = "menu-item" >
< h1 class = "menu-header" > Page< / h1 >
< div class = "checkbox-wrap" >
< input id = "control-layout-scroll-past-end" class = "control-layout-scroll-past-end" type = "checkbox" tabindex = "1" >
< label for = "control-layout-scroll-past-end" > < span class = "label-icon" > < / span > Scroll past end< / label >
< / div >
2019-02-03 16:18:45 +01:00
< div class = "input-wrap" >
< label for = "control-layout-title" > Title< / label >
< input id = "control-layout-title" class = "control-layout-title" type = "text" autocomplete = "off" autocorrect = "off" autocapitalize = "off" spellcheck = "false" placeholder = "New Tab" tabindex = "1" >
< / div >
2019-01-04 19:23:24 +01:00
< / div >
2019-01-04 17:24:05 +01:00
< / div >
2019-02-03 14:51:54 +01:00
2019-01-24 21:28:11 +01:00
< div class = "menu-content-area menu-content-area-background is-hidden" >
< div class = "menu-item" >
< h1 class = "menu-header" > Image< / h1 >
< div class = "checkbox-wrap" >
2019-02-03 14:51:54 +01:00
< input id = "control-background-image-show" class = "control-background-image-show" type = "checkbox" tabindex = "1" >
< label for = "control-background-image-show" > < span class = "label-icon" > < / span > Show< / label >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-background-image-url" > URL or path< / label >
2019-02-03 14:51:54 +01:00
< input id = "control-background-image-url" class = "control-background-image-url" type = "text" autocomplete = "off" autocorrect = "off" autocapitalize = "off" spellcheck = "false" placeholder = "http:// or ../path/to/file" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< p class = "input-helper small muted" > Enter a URL to an image file or a path to a local file.< / p >
< p class = "input-helper small muted" > To use local files enter a relative file path, eg:< / p >
< p class = "input-helper small muted" > ../background/abstract.jpg< / p >
< p class = "input-helper small muted" > ../background/gray-steps.jpg< / p >
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-background-image-opacity" > Opacity< / label >
2019-02-16 23:27:54 +01:00
< input id = "control-background-image-opacity" class = "control-background-image-opacity" type = "range" min = "0" max = "100" value = "0" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-background-image-grayscale" > Grayscale< / label >
2019-02-16 23:27:54 +01:00
< input id = "control-background-image-grayscale" class = "control-background-image-grayscale" type = "range" min = "0" max = "100" value = "0" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "input-wrap form-indent-1" >
< label for = "control-background-image-blur" > Blur< / label >
2019-02-16 23:27:54 +01:00
< input id = "control-background-image-blur" class = "control-background-image-blur" type = "range" min = "0" max = "100" value = "0" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< / div >
< div class = "input-wrap form-indent-1" >
2019-02-03 14:51:54 +01:00
< label for = "control-background-image-accent" > Accent overlay< / label >
2019-02-16 23:27:54 +01:00
< input id = "control-background-image-accent" class = "control-background-image-accent" type = "range" min = "0" max = "50" value = "0" tabindex = "1" >
2019-01-24 21:28:11 +01:00
< / div >
< / div >
< / div >
2019-02-03 14:51:54 +01:00
2019-01-03 23:30:27 +01:00
< / div >
2019-01-04 20:40:49 +01:00
2019-01-03 23:30:27 +01:00
< / div >
< / section >
2018-12-26 08:45:53 +01:00
< / body >
< script src = "js/helper.js" > < / script >
2019-01-03 23:30:27 +01:00
< script src = "js/data.js" > < / script >
2019-01-06 16:47:08 +01:00
< script src = "js/update.js" > < / script >
2019-01-03 23:30:27 +01:00
< script src = "js/state.js" > < / script >
2018-12-26 08:45:53 +01:00
< script src = "js/bookmarks.js" > < / script >
2019-01-03 23:30:27 +01:00
< script src = "js/control.js" > < / script >
< script src = "js/menu.js" > < / script >
< script src = "js/header.js" > < / script >
2018-12-26 08:45:53 +01:00
< script src = "js/modal.js" > < / script >
2019-01-06 08:06:33 +01:00
< script src = "js/tip.js" > < / script >
2018-12-26 08:45:53 +01:00
< script src = "js/shade.js" > < / script >
2019-04-01 17:11:39 +02:00
< script src = "js/accent.js" > < / script >
2018-12-26 08:45:53 +01:00
< script src = "js/theme.js" > < / script >
2019-01-05 21:57:21 +01:00
< script src = "js/date.js" > < / script >
2019-03-26 00:31:51 +01:00
< script src = "js/greeting.js" > < / script >
2018-12-26 08:45:53 +01:00
< script src = "js/clock.js" > < / script >
< script src = "js/search.js" > < / script >
2019-01-03 23:30:27 +01:00
< script src = "js/link.js" > < / script >
2018-12-27 19:41:17 +01:00
< script src = "js/version.js" > < / script >
2019-01-03 23:30:27 +01:00
< script src = "js/keyboard.js" > < / script >
2019-01-24 21:28:11 +01:00
< script src = "js/background.js" > < / script >
2019-02-03 16:18:45 +01:00
< script src = "js/title.js" > < / script >
2019-04-03 13:47:41 +02:00
< script src = "js/layout.js" > < / script >
2018-12-26 08:45:53 +01:00
< script src = "js/init.js" > < / script >
< / html >
