From 2ab097b2e5d0470f39021e2c27252d1ee8f20d94 Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Tue, 4 Dec 2018 22:24:31 +0300 Subject: initial work for flat modern theme --- lib/flat-ttrss/dijit/form/RadioButton.css | 157 ++++++++++++++++++++++++++++++ 1 file changed, 157 insertions(+) create mode 100644 lib/flat-ttrss/dijit/form/RadioButton.css (limited to 'lib/flat-ttrss/dijit/form/RadioButton.css') diff --git a/lib/flat-ttrss/dijit/form/RadioButton.css b/lib/flat-ttrss/dijit/form/RadioButton.css new file mode 100644 index 000000000..736876fac --- /dev/null +++ b/lib/flat-ttrss/dijit/form/RadioButton.css @@ -0,0 +1,157 @@ +/* RadioButton + * + * Styling RadioButton mainly includes: + * + * 1. Containers + * .dijitRadio|.dijitRadioIcon + * + * 2. RadioButton within ToggleButton + * .dijitToggleButton|.dijitToggleButtonChecked + * + * 3. Checked state + * .dijitRadioChecked + * .dijitToggleButtonChecked + * + * 4. Hover state + * .dijitRadioHover|.dijitRadioCheckedHover + * + * 5. Disabled state + * .dijitRadioDisabled|.dijitRadioCheckedDisabled + */ +.flat .dijitRadio, +.flat .dijitRadioIcon { +/* inside a toggle button */ + width: 16px; + height: 16px; + background: #fff; + border: 1px solid #257aa7; + border-radius: 50%; + position: relative; + overflow: visible; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.flat .dijitRadio:after, +.flat .dijitRadioIcon:after { + content: " "; + display: block; + width: 0; + height: 0; + background-color: #257aa7; + border-radius: 50%; + opacity: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: alpha(opacity=0); + margin: 8px; + position: absolute; + top: 0; + left: 0; + -webkit-transition: all 0.15s ease-in-out; + -moz-transition: all 0.15s ease-in-out; + -o-transition: all 0.15s ease-in-out; + -ms-transition: all 0.15s ease-in-out; + transition: all 0.15s ease-in-out; +} +.flat .dijitRadioHover { + border-color: #43a3d5; +} +.flat .dijitRadioChecked:after, +.flat .dijitChecked .dijitRadioIcon:after { + width: 8px; + height: 8px; + margin: 3px; + opacity: 1; + -ms-filter: none; + filter: none; +} +.flat .alt-primary .dijitRadioIcon { + border-color: #fff; +} +.flat .alt-primary .dijitRadioIcon:after { + background-color: #fff; +} +.flat .alt-success .dijitRadioIcon { + border-color: #fff; +} +.flat .alt-success .dijitRadioIcon:after { + background-color: #fff; +} +.flat .alt-info .dijitRadioIcon { + border-color: #fff; +} +.flat .alt-info .dijitRadioIcon:after { + background-color: #fff; +} +.flat .alt-warning .dijitRadioIcon { + border-color: #fff; +} +.flat .alt-warning .dijitRadioIcon:after { + background-color: #fff; +} +.flat .alt-danger .dijitRadioIcon { + border-color: #fff; +} +.flat .alt-danger .dijitRadioIcon:after { + background-color: #fff; +} +.flat .alt-inverse .dijitRadioIcon { + border-color: #fff; +} +.flat .alt-inverse .dijitRadioIcon:after { + background-color: #fff; +} +.flat .dijitRadioDisabled { + background-color: #f5f5f5; + border-color: #e3e3e3; +} +.flat .dijitRadioCheckedDisabled { + background-color: #f5f5f5; + border-color: #5cafdb; +} +.flat .dijitRadioCheckedDisabled:after { + background-color: #5cafdb; +} +.flat .dijitRadioMenuItem .dijitCheckedMenuItemIcon { + width: 16px; + height: 16px; + background: #fff; + border: 1px solid #ccc; + border-radius: 50%; + position: relative; + overflow: visible; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.flat .dijitRadioMenuItem .dijitCheckedMenuItemIcon:after { + content: " "; + display: block; + width: 0; + height: 0; + background-color: #257aa7; + border-radius: 50%; + opacity: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: alpha(opacity=0); + margin: 8px; + position: absolute; + top: 0; + left: 0; + -webkit-transition: all 0.15s ease-in-out; + -moz-transition: all 0.15s ease-in-out; + -o-transition: all 0.15s ease-in-out; + -ms-transition: all 0.15s ease-in-out; + transition: all 0.15s ease-in-out; +} +.flat .dijitRadioMenuItemChecked .dijitCheckedMenuItemIcon { + border-color: #ccc; +} +.flat .dijitRadioMenuItemChecked .dijitCheckedMenuItemIcon:after { + width: 8px; + height: 8px; + margin: 3px; + opacity: 1; + -ms-filter: none; + filter: none; +} -- cgit v1.2.3