Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: skin/desktop-options.css

Issue 29674584: Issue 5549 - Implement missing error handlings for custom filter lists (Closed)
Patch Set: removed filterError flag + added better way to check invalid filters Created Jan. 30, 2018, 1:11 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « messageResponder.js ('k') | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: skin/desktop-options.css
===================================================================
--- a/skin/desktop-options.css
+++ b/skin/desktop-options.css
@@ -114,7 +114,7 @@
/*
Normalization
- */
+*/
input,
button
@@ -129,7 +129,7 @@
/*
Buttons and links
- */
+*/
button,
.button
@@ -219,6 +219,7 @@
{
margin: 0.8rem 0rem;
display: flex;
+ align-self: center;
justify-content: flex-end;
}
@@ -238,7 +239,7 @@
/*
icons
- */
+*/
.icon
{
@@ -451,7 +452,7 @@
/*
Forms
- */
+*/
.floating-input
{
@@ -533,7 +534,7 @@
/*
Sidebar
- */
+*/
#sidebar,
#sidebar .fixed,
@@ -544,7 +545,7 @@
#sidebar
{
- flex-shrink: 0;
+ flex-shrink: 0;
}
#sidebar .fixed
@@ -660,11 +661,12 @@
bottom: 0px;
position: absolute;
}
+
}
/*
Main content
- */
+*/
body[data-tab|="general"] #content-general,
body[data-tab|="advanced"] #content-advanced,
@@ -694,7 +696,7 @@
/*
Sections
- */
+*/
[role="tabpanel"] > section,
[role="tabpanel"] > .section
@@ -746,7 +748,7 @@
/*
Acceptable ads
- */
+*/
#tracking-warning
{
@@ -835,7 +837,7 @@
/*
Tables
- */
+*/
ul.table,
ul.list
@@ -1094,7 +1096,7 @@
/*
Whitelist tab
- */
+*/
#content-whitelist form
{
@@ -1134,17 +1136,14 @@
#custom-filters[data-mode="empty"] #custom-filters-raw,
#custom-filters:not([data-mode="write"]) #custom-filters-raw-controls,
#custom-filters:not([data-mode="read"]) #custom-filters-edit,
+#custom-filters-error,
.state span,
#acceptable-ads:not(.show-dnt-notification) #dnt
{
display: none;
}
-#all-filter-lists-table button[role="checkbox"][aria-checked="true"] + .state #state-active
-{
- display: inline;
-}
-
+#all-filter-lists-table button[role="checkbox"][aria-checked="true"] + .state #state-active,
#all-filter-lists-table button[role="checkbox"][aria-checked="false"] + .state #state-disabled
{
display: inline;
@@ -1155,11 +1154,71 @@
margin-bottom: 0.8rem;
}
+#custom-filters-edit
+{
+ white-space: nowrap;
+}
+
+#custom-filters-edit-area
+{
+ display: flex;
+ width: 100%;
+}
+
+/*
+ avoid doubled margin glitchy behavior
+ as shown in visual specifications
+*/
+#custom-filters-edit-area .side-controls .side-controls
+{
+ margin: 0;
+}
+
+/*
+ visibility: hidden;
+ preserves the flex-box meaning,
+ keeping buttons on the right.
+*/
+#custom-filters-edit-error
+{
+ visibility: hidden;
+ display: flex;
+ align-self: center;
+ justify-content: flex-start;
+ font-weight: bold;
+}
+
+#custom-filters.warning #custom-filters-edit-error,
+#custom-filters-error
+{
+ color: #C11D26;
+ padding: 0.2rem 0.8rem;
+}
+
+#custom-filters.warning #custom-filters-edit-error
+{
+ visibility: visible;
+}
+
+#custom-filters-error
+{
+ display: block;
+ list-style: none;
+ white-space: pre;
+ overflow: auto;
+}
+
+#custom-filters-error.many
+{
+ border: 1px solid silver;
+ max-height: 6.2rem;
+}
+
#custom-filters-raw
{
width: 100%;
height: 23.6rem;
- padding: 0.8rem;
+ padding: 0.8rem;
}
#custom-filters-raw:focus
@@ -1168,6 +1227,12 @@
border: 2px solid #077CA6;
}
+#custom-filters.warning #custom-filters-raw
+{
+ outline: none;
+ border: 2px solid #C11D26;
+}
+
#empty-custom-filters
{
padding: 1.5rem;
@@ -1176,7 +1241,7 @@
/*
Context menu
- */
+*/
li [role="menubar"]
{
@@ -1346,6 +1411,7 @@
#social ul li
{
display: inline-block;
+ margin-right: 1rem;
-moz-margin-end: 1rem;
-webkit-margin-end: 1rem;
}
« no previous file with comments | « messageResponder.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld