diff options
Diffstat (limited to 'examples/webkit/webkit-guide/css')
41 files changed, 4271 insertions, 0 deletions
diff --git a/examples/webkit/webkit-guide/css/anim_accord.css b/examples/webkit/webkit-guide/css/anim_accord.css new file mode 100755 index 0000000000..c9c013affa --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_accord.css @@ -0,0 +1,246 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ +body { + background : #aaaaaa; + font-family : sans-serif; + width : 100; +} + +body > section { + border-radius : 1em; + background : #ffffff; + border-radius : 1em; + padding : 1em; + background : #ffffff; + min-height : 70%; +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + +.nav > a { + display : inline-block; + width : 48px; + height : 48px; +} + +h1, h2, h3, h4 { + margin-top : 0.0em; + font-size : smaller; + padding-top : 1em; +} + +body > section.main { + position : absolute; + left : 1em; + right : 1em; + top : 1em; + min-height : 50%; + border-radius : 0.5em; + background : #aaaaaa; + padding : 0; +} + +section.main > article { + background : #ffffff; + padding : 1em; + margin-bottom : 10em; + border-radius : 0.5em; +} + +#accordion, +#accordion > dt, +#accordion > dd, +{ + display : block; +} + +#accordion > dt { + border-top : thin solid #777777; +} + +#accordion > dd { + border-bottom : thin solid #777777; +} + +#accordion > dd { + background-image : -webkit-gradient(linear,center top,center bottom,from(#aaaaaa),to(#ffffff)); +} + +#accordion.collapsed { + background-size : auto; + background-image : url(../img/icon_expand-nav.png); + background-repeat : no-repeat; + background-position : 0.25em 0.25em; +} + +#accordion { + position : absolute;; + right : 2em; + top : 0em; + overflow : hidden; + background : #ffffff; + cursor : pointer; + z-index : 100; + font-weight : bold; +} + +#accordion.expanded { + border : thin solid #206ead; + width : 80%; + height : 90%; + -webkit-transition: + width 0.5s ease-in-out 0.0s, + height 0.5s ease-in-out 0.5s + ; +} + +#accordion.collapsed { + width : 15%; + height : 9%; + -webkit-transition: + height 0.5s ease-in-out 0.0s, + width 0.5s ease-in-out 0.5s + ; +} + +#accordion.collapsed > dt, +#accordion.collapsed > dd { + -webkit-transform : translate(100%); + -webkit-transition : -webkit-transform 0.5s ease-in-out 0.5s; +} + +#accordion.expanded > dt, +#accordion.expanded > dd { + -webkit-transform : translate(0%); + -webkit-transition : -webkit-transform 0.5s ease-in-out 0.0s; +} + +#accordion > dt > a { + margin-left : 0.5em; +} + +#accordion > dt , +#accordion > dd { + padding : 0.5em; +} + +#accordion > dt ~ dd { + margin : 0; +} + +#accordion > dd > ul, +#accordion > dd > ul > li +{ + padding : 0; + margin : 0; +} + +#accordion a, +#accordion a:active, +#accordion a:hover, +#accordion a:visited +{ + text-decoration : none; + color : #000000; +} + +#accordion > dt.expanded:before { + content : url(../img/icon_head-expanded_x13.png); +} + +#accordion > dt.collapsed:before { + content : url(../img/icon_head-collapsed_x13.png); +} + +#accordion > dt.expanded { + background-image : -webkit-gradient(linear, center top, center bottom, from(#aaaaaa), to(#ffffff)); +} + +#accordion > dt.collapsed { + background-image : -webkit-gradient(linear, center top, center bottom, from(#aaaaaa), to(#ffffff)); +} + +#accordion > dt + dd { + background : #ffffff; + display : block; +} + +#accordion dd { + overflow : none; +} + +#accordion > dt.collapsed + dd { + max-height : 0%; + opacity : 0; + -webkit-transform : scaleY(0); + -webkit-transition : all 0.5s ease-in-out; +} + +#accordion > dt.expanded + dd { + max-height : 50%; + opacity : 1; + -webkit-transform : scaleY(1); + -webkit-transition : all 0.5s ease-in-out; +} + +#accordion > dd { + margin : 0; + padding : 0; +} + +#accordion > dd > ul > li { + padding-top : 0.25em; + padding-bottom : 0.5em; + padding-left : 1.0em; + padding-right : 1.0em; +} + +#accordion> dt.collapsed:last-of-type { + border-bottom : thin solid #aaaaaa; +} + diff --git a/examples/webkit/webkit-guide/css/anim_demo-rotate.css b/examples/webkit/webkit-guide/css/anim_demo-rotate.css new file mode 100755 index 0000000000..fa3bd0dee8 --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_demo-rotate.css @@ -0,0 +1,95 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ +body { + background : #aaaaaa; + font-weight : bold; +} + +section { + color : #ffffff; + background : #777777; + font-size : x-large; + -webkit-transform : translate(-150%) scale(1); + position : absolute; + text-align : center; + padding : 1em; + top : 3em; + left : 3em; + bottom : 3em; + right : 3em; +} + +@-webkit-keyframes demoRotate { + 0% { -webkit-transform : translate(-150%); } + 10% { -webkit-transform : rotate(0deg) translate(0); } + 50% { -webkit-transform : rotate(180deg) translate(0); } + 90% { -webkit-transform : rotate(360deg) translate(0); } + 100% { -webkit-transform : translate(150%); } +} + +@-webkit-keyframes demoRotateOrigin { + 0% { -webkit-transform : rotate(0deg) translate(-150%); } + 10% { -webkit-transform : rotate(0deg) translate(0); } + 50% { -webkit-transform : rotate(-180deg) translate(0); } + 90% { -webkit-transform : rotate(-360deg) translate(0); } + 100% { -webkit-transform : rotate(-360deg) translate(150%) } +} + +@-webkit-keyframes end { + 0% { -webkit-transform : translate(150%); } + 30% { -webkit-transform : translate(0); } + 70% { -webkit-transform : translate(0); } + 100% { -webkit-transform : translate(150%); } +} + +.rotate { + -webkit-animation : demoRotate 9s 2s; + -webkit-transform-origin : center; + -webkit-animation-timing-function : linear; +} +.rotateOrigin { + -webkit-animation : demoRotateOrigin 9s 12s; + -webkit-transform-origin : top left; + -webkit-animation-timing-function : linear; +} +.end { + -webkit-animation : end 3s 22s; +} + diff --git a/examples/webkit/webkit-guide/css/anim_demo-scale.css b/examples/webkit/webkit-guide/css/anim_demo-scale.css new file mode 100755 index 0000000000..4af469a61e --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_demo-scale.css @@ -0,0 +1,112 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-weight : bold; +} + +section { + color : #ffffff; + background : #777777; + font-size : x-large; + -webkit-transform : translate(-150%) scale(1); + position : absolute; + text-align : center; + padding : 1em; + top : 3em; + left : 3em; + bottom : 3em; + right : 3em; +} + +@-webkit-keyframes demoScale { + 0% { -webkit-transform : translate(-150%) scale(1); } + 10% { -webkit-transform : scale(1.0) translate(0); } + 30% { -webkit-transform : scale(0.5) translate(0); } + 50% { -webkit-transform : scale(1.0) translate(0); } + 70% { -webkit-transform : scale(1.5) translate(0); } + 90% { -webkit-transform : scale(1.0) translate(0); } + 100% { -webkit-transform : translate(150%) scale(1); } +} + +@-webkit-keyframes demoScaleX { + 0% { -webkit-transform : translate(-150%) scale(1); } + 10% { -webkit-transform : scaleX(1.0) translate(0); } + 30% { -webkit-transform : scaleX(0.5) translate(0); } + 50% { -webkit-transform : scaleX(1.0) translate(0); } + 70% { -webkit-transform : scaleX(1.5) translate(0); } + 90% { -webkit-transform : scaleX(1.0) translate(0); } + 100% { -webkit-transform : translate(150%) scale(1); } +} + +@-webkit-keyframes demoScaleY { + 0% { -webkit-transform : translate(-150%) scale(1); } + 10% { -webkit-transform : scaleY(1.0) translate(0); } + 30% { -webkit-transform : scaleY(0.5) translate(0); } + 50% { -webkit-transform : scaleY(1.0) translate(0); } + 70% { -webkit-transform : scaleY(1.5) translate(0); } + 90% { -webkit-transform : scaleY(1.0) translate(0); } + 100% { -webkit-transform : translate(150%) scale(1); } +} + +@-webkit-keyframes end { + 0% { -webkit-transform : translate(150%); } + 30% { -webkit-transform : translate(0); } + 70% { -webkit-transform : translate(0); } + 100% { -webkit-transform : translate(150%); } +} + +.scale { + -webkit-animation : demoScale 9s 2s; + -webkit-transform-origin : bottom; +} +.scaleX { + -webkit-animation : demoScaleX 9s 12s; + -webkit-transform-origin : left; +} +.scaleY { + -webkit-animation : demoScaleY 9s 22s; + -webkit-transform-origin : center; +} +.end { + -webkit-animation : end 3s 32s; +} + diff --git a/examples/webkit/webkit-guide/css/anim_demo-skew.css b/examples/webkit/webkit-guide/css/anim_demo-skew.css new file mode 100755 index 0000000000..2d90bf9574 --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_demo-skew.css @@ -0,0 +1,98 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-weight : bold; +} + +section { + color : #ffffff; + background : #777777; + font-size : x-large; + -webkit-transform : translate(-150%) scale(1); + position : absolute; + text-align : center; + padding : 1em; + top : 3em; + left : 3em; + bottom : 3em; + right : 3em; +} + +@-webkit-keyframes demoSkew { + 0% { -webkit-transform : translate(-150%); } + 10% { -webkit-transform : skew(0deg) translate(0); } + 30% { -webkit-transform : skew(30deg) translate(0); } + 50% { -webkit-transform : skew(0deg) translate(0); } + 70% { -webkit-transform : skew(-30deg) translate(0); } + 90% { -webkit-transform : skew(0deg) translate(0); } + 100% { -webkit-transform : translate(150%); } +} + +@-webkit-keyframes demoSkewY { + 0% { -webkit-transform : translate(-150%); } + 10% { -webkit-transform : skewY(0deg) translate(0); } + 30% { -webkit-transform : skewY(30deg) translate(0); } + 50% { -webkit-transform : skewY(0deg) translate(0); } + 70% { -webkit-transform : skewY(-30deg) translate(0); } + 90% { -webkit-transform : skewY(0deg) translate(0); } + 100% { -webkit-transform : translate(150%); } +} + +@-webkit-keyframes end { + 0% { -webkit-transform : translate(150%); } + 30% { -webkit-transform : translate(0); } + 70% { -webkit-transform : translate(0); } + 100% { -webkit-transform : translate(150%); } +} + +.skew { + -webkit-animation : demoSkew 9s 2s; + -webkit-transform-origin : bottom; +} +.skewY { + -webkit-animation : demoSkewY 9s 12s; + -webkit-transform-origin : left; +} +.end { + -webkit-animation : end 3s 22s; +} + diff --git a/examples/webkit/webkit-guide/css/anim_gallery.css b/examples/webkit/webkit-guide/css/anim_gallery.css new file mode 100755 index 0000000000..fe14aa263c --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_gallery.css @@ -0,0 +1,110 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; + background : #444444; +} +.gallery > div > div { + border-radius : 1.0em; + padding : 1em; + background : #dddddd; + min-height : 75%; +} +.gallery > div { + -webkit-transition : all 0.5s ease-in-out; + z-index : 0; + position : absolute; + top : 2.0em; + bottom : 2.0em; + left : 2.0em; + right : 2.0em; +} +.gallery > div.selected { + -webkit-transform : translate(0) scale(1); + opacity : 1.0; + z-index : 1; +} +.gallery > div.queueR { + -webkit-transform : translate(70%) scale(0.5); + opacity : 0.75; +} +.gallery > div.queueL { + -webkit-transform : translate(-70%) scale(0.5); + opacity : 0.75; +} +.gallery > div.hideR { + -webkit-transform : translate(200%) scale(0.5); + opacity : 0.0; +} +.gallery > div.hideL { + -webkit-transform : translate(-200%) scale(0.5); + opacity : 0.0; +} +.gallery img { + max-width : 100%; + max-height : 100%; + border-radius : 1.0em; +} + +.gallery > #reveal > div, .gallery > div > img { + -webkit-transform : scaleX(1) scaleY(1); + -webkit-transition : -webkit-transform 0.25s ease-out 0.25s; +} +.gallery > div > div, .gallery > #reveal > img { + -webkit-transform : scaleX(0) scaleY(1); + -webkit-transition : -webkit-transform 0.25s ease-out; +} + +section > div { + text-align : center; +} + +section > div > img { + display : inline-block; +} + +section > div > div { + position : absolute; + top : 0; + left : 1.5em; + right : 1.5em; +} + diff --git a/examples/webkit/webkit-guide/css/anim_panel.css b/examples/webkit/webkit-guide/css/anim_panel.css new file mode 100755 index 0000000000..87037c9a9e --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_panel.css @@ -0,0 +1,116 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +section { + background : #aaaaaa; + position : absolute; + left : 1em; + right : 1em; + top : 1em; + bottom : 1em; +} + +.force { + padding-right : 5in; +} + +#panel { + text-align : justify; + padding : 0.5em; + border-radius : 0.5em; + background : #ffffff; + max-height : 2.0em; + float : right; + overflow : hidden; +} + +nav.expanded { + max-width : 95%; + -webkit-transition : max-width 0.5s ease-in-out; +} + +nav.collapsed { + max-width : 12%; + -webkit-transition : max-width 0.5s ease-in-out; + +} + +nav.expanded > .button { + display : none; +} + +nav.collapsed > .button { + display : inline-block; +} + +nav.expanded > .option { + opacity : 1; + -webkit-transform : scale(1); + -webkit-transition : all 0.5s linear; +} +nav.collapsed > .option { + opacity : 0; + -webkit-transform : scale(0); + -webkit-transition : all 0.5s linear; +} + +#dbg { + padding : 1em; + border-radius : 1em; + position : absolute; + top : 75%; + bottom : 1em; + left : 1em; + right : 1em; + background : #ffffff; +} + +.measure { + position : absolute; + top : 0; + left : 0; + width : 320px; + background : green; +} diff --git a/examples/webkit/webkit-guide/css/anim_pulse.css b/examples/webkit/webkit-guide/css/anim_pulse.css new file mode 100755 index 0000000000..4b850b9bc8 --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_pulse.css @@ -0,0 +1,100 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + +.force { + padding-left : 100% +} + +nav { + text-align : justify; +} + +nav > a { + background-size : contain; + background-repeat : no-repeat; +} + +nav > a { + display : inline-block; + width : 2em; + height : 2em; +} + +nav > a:nth-of-type(1) { background-image : url(../img/ic_fe_032.png); } +nav > a:nth-of-type(2) { background-image : url(../img/ic_ni_032.png); } +nav > a:nth-of-type(3) { background-image : url(../img/ic_he_032.png); } +nav > a:nth-of-type(4) { background-image : url(../img/ic_na_032.png); } +nav > a:nth-of-type(5) { background-image : url(../img/ic_zn_032.png); } +nav > a:nth-of-type(6) { background-image : url(../img/ic_o_032.png); } + +h1,h2,h3 { margin-top : 0; } + +nav > a:target { -webkit-animation : pulse 1s infinite; } + +@-webkit-keyframes pulse { + 0% { opacity : 1.0 } + 50% { opacity : 0.7 } +} + diff --git a/examples/webkit/webkit-guide/css/anim_skew.css b/examples/webkit/webkit-guide/css/anim_skew.css new file mode 100755 index 0000000000..e44a633e96 --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_skew.css @@ -0,0 +1,186 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + padding : 1em; + font-family : "Helvetica"; + font-weight : bold; +} + +span { + background : #ffffff; + font-weight : bold; + cursor : pointer; +} + +.items > div { + cursor : pointer; + background : #ffffff; + height : 2em; + padding : 0.5em 0.5em 0.0em 0.5em; + border-radius : 0.25em; + position : absolute; + left : 1em; + right : 1em; + -webkit-transition-property : -webkit-transform, top; + -webkit-transition-duration : 0.5s, 0.5s; + -webkit-transition-delay : 0s, 0.5s; + -webkit-transition-timing-function : ease-in-out; +} + +.hide { + -webkit-transform-origin : bottom left; + -webkit-transform : skew(40deg) translate(140%,0em); +} + +.items > div:after { + content : url(../img/icon_dismiss_x22.png); + float : right; +} + +.row1 { + top : 3.5em; +} +.row2 { + top : 6.5em; +} +.row3 { + top : 9.5em; +} +.row4 { + top : 12.5em; +} +.row5 { + top : 15.5em; +} +.row6 { + top : 18.5em; +} +.row7 { + top : 21.5em; +} +.row8 { + top : 24.5em; +} +.row9 { + top : 27.5em; +} +.row10 { + top : 30.5em; +} +.row11 { + top : 33.5em; +} +.row12 { + top : 36.5em; +} +.row13 { + top : 39.5em; +} +.row14 { + top : 42.5em; +} +.row15 { + top : 45.5em; +} + +.items > div { + padding-left : 3.0em; + color : #444444; + background-size : contain; + background-repeat : no-repeat; +} + +.items > div[title='cat1'] { + background-image : url(../img/ic_fe_036.png); +} + +.items > div[title='cat2'] { + background-image : url(../img/ic_na_036.png); +} + +.items > div[title='cat3'] { + background-image : url(../img/ic_ni_036.png); +} + +.items > div[title='cat4'] { + background-image : url(../img/ic_mg_036.png); +} + +nav { + position : absolute; + background : #aaaaaa; + top : 0; + left : 0; + right : 0; + z-index : 10; + height : 2em; + text-align : center; + padding : 0.5em; +} + +nav > div { + background-size : contain; + background-repeat : no-repeat; + display : inline-block; + width : 36px; + height : 36px; + margin-left : 0.25em; + margin-right : 0.25em; + background-image : -webkit-gradient(linear,center top,center bottom,from(#ffffff),to(#eeeeee)); +} + +nav > div { + background-image : url(../img/icon_list-all.png); +} +nav > .cat1 { + background-image : url(../img/ic_fe_036.png); +} +nav > .cat2 { + background-image : url(../img/ic_na_036.png); +} +nav > .cat3 { + background-image : url(../img/ic_ni_036.png); +} +nav > .cat4 { + background-image : url(../img/ic_mg_036.png); +} + diff --git a/examples/webkit/webkit-guide/css/anim_slide.css b/examples/webkit/webkit-guide/css/anim_slide.css new file mode 100755 index 0000000000..7997cc2c2b --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_slide.css @@ -0,0 +1,148 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/* main layout */ +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +h1 { + min-height : 1.5em; + background : #ffffff; + margin-left : 1em; + margin-right : 1em; + text-align : center; + font-size : 18px; + padding-top : 0.25em; + padding-bottom : 0.25em; + border-radius : 0.5em; +} + +.panel { + position : absolute; + top : 0em; + bottom : 0em; + left : 0em; + right : 0em; +} + +article { + background : #ffffff; + padding : 1em; + border-radius : 1em; + margin : 1em; +} + +.panel > ul { + padding : 0em; + list-style-type : none; +} +.panel > ul > li { + background : #fff; + margin : 0.5em 1.0em 0.5em 1.0em; + padding : 0.5em; + display : block; + border-radius : 0.5em; +} +.panel > ul > li > a { + width : 100%; + display : block; + text-decoration : none; + text-align : justify; + color : #000000; +} +.panel > a { + background : #fff; + margin : 0 1.0em 1.0em 0em; + padding : 0.5em; +} +/* navigational hints */ + +a.go_out { + background : transparent; + position : absolute; + top : 0.5em; + left : 1.2em; + content : url(../img/icon_drill-up_x32.png); + padding : 0.25em; + border-radius : 1em; + display : block; +} + +.panel > ul > li > a:after { + text-align : right; + float : right; + font-size : 1em; + font-weight : bold; +} +.panel > ul > li > a:after { + -webkit-transform : translate(0, -0.5em); + content : url(../img/icon_drill-down_x32.png); +} + +/* animations */ +#in:target { + -webkit-animation : slide_in 0.25s; +} +#out:target + .panel { + -webkit-animation : slide_out 0.25s; +} +@-webkit-keyframes slide_in { + from { + left : 80%; + right : -80%; + } + to { + left : 0em; + right : 0em; + } +} +@-webkit-keyframes slide_out { + from { + left : -80%; + right : 80%; + } + to { + left : 0em; + right : 0em; + } +} diff --git a/examples/webkit/webkit-guide/css/anim_tabbedSkew.css b/examples/webkit/webkit-guide/css/anim_tabbedSkew.css new file mode 100755 index 0000000000..1c03e48966 --- /dev/null +++ b/examples/webkit/webkit-guide/css/anim_tabbedSkew.css @@ -0,0 +1,113 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +section { + background : #ffffff; + position : absolute; + left : 1em; + right : 1em; + top : 1em; + min-height : 60%; + padding : 1.0em; + border-radius : 0.5em; +} + +nav { + text-align : right; + width : 3.5em; + height : 4em; + float : right; +} + +nav > a { + border-radius : 0.25em; + width : 1em; + height : 1em; + text-align : center; + font-weight : bold; + font-size : 2em; + text-decoration : none; + color : black; + position : relative; + background-size : contain; + display : block; +} + +nav > a:nth-of-type(1) { + margin-bottom : 0.1em; + background-image : url(../img/ic_he_032.png); + -webkit-transform : skew(-30deg); +} + +nav > a:nth-of-type(2) { + background-image : url(../img/ic_o_032.png); + -webkit-transform : skew(30deg); +} + +nav > a:nth-of-type(3) { + background-image : url(../img/ic_na_032.png); + -webkit-transform : rotate(-60deg) skew(-30deg) translate(1.7em, -1px); +} + +article { + display : none; + margin-bottom : 4em; +} + +article:target { + display : block; +} + +h3 + div { + display : inline-block; + float : right; + width : 12px; + height : 3em; +} + +h1,h2,h3,h4 { + margin-top : 0.5em; +} + diff --git a/examples/webkit/webkit-guide/css/css3_backgrounds.css b/examples/webkit/webkit-guide/css/css3_backgrounds.css new file mode 100755 index 0000000000..c2a3a300e0 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_backgrounds.css @@ -0,0 +1,105 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; + background : #aaaaaa; +} + +h1,h2,h3,h4 { + background : #ffffff; + text-align : center; + margin : 0.5em; + padding : 0.5em; + border-radius : 0.5em; +} + +.accordion { + margin : 0.5em 0.5em 6em 0.5em; + border-radius : 0.5em; + border : thin solid #aaa; + background : #ffffff; + overflow : hidden; + padding : 1.0em 0.5em 1.0em 0.5em; + +} + +.accordion > dt { + cursor : pointer; + border-top : thin solid #aaa; + border-radius : 0.5em; + padding : 0.5em 0.5em 0.5em 2.5em; + font-weight : bold; + background-size : auto; + background-image : url(../img/icon_head-collapsed_x13.png); + background-repeat : no-repeat; + background-position : 12px 12px; +} + +.accordion > dt:first-of-type { + border-top : none; +} + +.accordion > dt.selected { + background-image : url(../img/icon_head-expanded_x13.png) , url(../img/gradient.jpg); + background-repeat : no-repeat , repeat-x; + background-position : 12px 12px , 0 0; + margin-bottom : 0em; +} + +dt + dd { + max-height : 0%; + margin : 0; + opacity : 0; + padding : 0.5em; + overflow-y : hidden; + max-height : 0; + -webkit-transform : scaleY(0); + -webkit-transition : all 0.5s linear; +} + +dt.selected + dd { + -webkit-transform : scaleY(1); + -webkit-transform-origin : center; + max-height : 1000px; + -webkit-transition : all 0.5s linear; + opacity : 1; +} + diff --git a/examples/webkit/webkit-guide/css/css3_border-img.css b/examples/webkit/webkit-guide/css/css3_border-img.css new file mode 100755 index 0000000000..1293e2e27c --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_border-img.css @@ -0,0 +1,70 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + +.fruit { + padding : 2.5em; + -webkit-border-image : url(../img/border-frame.png) 2 stretch stretch; +} + diff --git a/examples/webkit/webkit-guide/css/css3_grad-radial.css b/examples/webkit/webkit-guide/css/css3_grad-radial.css new file mode 100755 index 0000000000..7799153dbd --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_grad-radial.css @@ -0,0 +1,66 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 70%; +} + diff --git a/examples/webkit/webkit-guide/css/css3_gradientBack.css b/examples/webkit/webkit-guide/css/css3_gradientBack.css new file mode 100755 index 0000000000..48f9d68633 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_gradientBack.css @@ -0,0 +1,77 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; +} + +section { + position : absolute; + top : 0.0em; + left : 0.0em; + right : 0.0em; + background : #aaaaaa; + background : -webkit-gradient(linear, center top, center bottom, from(#dddddd), to(#777777) ); + padding : 1em; +} + +article { + background : #ffffff; + padding : 1em; + border-radius : 0.5em; + border : thin #aaaaaa solid; + margin-bottom : 12em; +} + +h1, h2, h3, h4 { + text-align : center; + margin-top : 0.5em; +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + diff --git a/examples/webkit/webkit-guide/css/css3_gradientBackStop.css b/examples/webkit/webkit-guide/css/css3_gradientBackStop.css new file mode 100755 index 0000000000..0fbaf526ef --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_gradientBackStop.css @@ -0,0 +1,77 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; +} + +section { + position : absolute; + top : 0.0em; + left : 0.0em; + right : 0.0em; + background : #aaaaaa; + background : -webkit-gradient(linear, center top, center bottom, from(#777777), color-stop(50%,#dddddd), to(#777777) ); + padding : 1em; +} + +article { + background : #ffffff; + padding : 1em; + border-radius : 0.5em; + border : thin #aaaaaa solid; + margin-bottom : 12em; +} + +h1, h2, h3, h4 { + text-align : center; + margin-top : 0.5em; +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + diff --git a/examples/webkit/webkit-guide/css/css3_gradientButton.css b/examples/webkit/webkit-guide/css/css3_gradientButton.css new file mode 100755 index 0000000000..6d0c9f77c8 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_gradientButton.css @@ -0,0 +1,88 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #ffffff; +} + +article { + background : #ffffff; + position : absolute; + margin : 0; + left : 0; + right : 0; + top : 0; + bottom : 0; +} + +ul { + font-weight : bold; + padding : 0; + list-style : none; + margin : 0.5em 0.5em 6em 0.5em; +} + +ul > li { + margin-bottom : 0.5em; +} + +ul > li > a { + padding : 0.5em; + display : block; + text-decoration : none; + color : #000000; + border : thin #aaaaaa solid; + border-radius : 0.5em; + background : #dddddd; + background : -webkit-gradient(linear, center top, center bottom, + from(#cccccc), to(#ffffff) ); +} + +ul > li > a:active { + color : #ffffff; + background : #ffffff; + background : -webkit-gradient(linear, center top, center bottom, + from(#dddddd), to(#444444) ); +} + +h1,h2,h3,h4 { + text-align : center; +} + diff --git a/examples/webkit/webkit-guide/css/css3_mask-grad.css b/examples/webkit/webkit-guide/css/css3_mask-grad.css new file mode 100755 index 0000000000..24f0b227a7 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_mask-grad.css @@ -0,0 +1,60 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; + background : #ffffff; +} + +h1,h2,h3,h4 { + text-align : center; +} + +img { + -webkit-mask-box-image : -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); + border-radius : 0.25em; + margin : 0.1em; +} + +img.select { + -webkit-mask-box-image : none; + -webkit-box-shadow : 0.2em 0.2em 0.4em #aaaaaa; +} + diff --git a/examples/webkit/webkit-guide/css/css3_mask-img.css b/examples/webkit/webkit-guide/css/css3_mask-img.css new file mode 100755 index 0000000000..0203d814fc --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_mask-img.css @@ -0,0 +1,58 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; + background : #333333; +} + +h1,h2,h3,h4 { + text-align : center; +} + +img { + position : absolute; + left : 5%; + top : 5%; + height : 90%; + width : 90%; + -webkit-mask-box-image : url(../img/mask.png) 5% stretch; +} + diff --git a/examples/webkit/webkit-guide/css/css3_multicol.css b/examples/webkit/webkit-guide/css/css3_multicol.css new file mode 100755 index 0000000000..3c07f8b604 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_multicol.css @@ -0,0 +1,110 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + font-family : sans-serif; + background : #aaaaaa; +} + +section { + bottom : 0; + left : 0; + top : 12%; + right : 0; + position : absolute; + padding-bottom : 6em; +} + +article { + border-radius : 1em; + margin : 1em; + padding : 1em; + background : #ffffff; +} + +h1,h2,h3,h4 { + text-align : center; + margin-top : 0.0em; +} + +nav.ad { + width : 500%; + border : thin #aaaaaa solid; + background : #dddddd; + position : absolute; + top : 0%; + height : 10%; + column-count : 5; + column-width : 100%; + -webkit-animation : banner_scroll 30s infinite; +} + +nav.ad > a { + width : 20%; + height : 100%; + display : inline-block; + text-align : center; + padding-top : 0.5em; + text-decoration : none; + font-weight : bold; + color : #000000; + font-size : larger; +} + +nav.ad > a:nth-of-type(5n-0) { background : lightgreen; } +nav.ad > a:nth-of-type(5n-1) { background : pink; } +nav.ad > a:nth-of-type(5n-2) { background : plum; } +nav.ad > a:nth-of-type(5n-3) { background : lightblue; } +nav.ad > a:nth-of-type(5n-4) { background : lightcoral; } + +@-webkit-keyframes banner_scroll { + 0% { left : 0%; } + 18% { left : 0%; } + 20% { left : -100%; } + 38% { left : -100%; } + 40% { left : -200%; } + 58% { left : -200%; } + 60% { left : -300%; } + 78% { left : -300%; } + 80% { left : -400%; } + 95% { left : -400%; } + 100% { left : 0%; } +} + diff --git a/examples/webkit/webkit-guide/css/css3_reflect.css b/examples/webkit/webkit-guide/css/css3_reflect.css new file mode 100755 index 0000000000..1f2e4542e8 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_reflect.css @@ -0,0 +1,127 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +body > section { + border-radius : 1em; + padding : 1em; + background : #ffffff; + margin-bottom : 10em; + min-height : 70%; +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + +.nav > a { + display : inline-block; + width : 48px; + height : 48px; +} + +body > section.main { + position : absolute; + left : 0em; + right : 0em; + top : 0em; + min-height : 50%; + border-radius : 0.5em; + background : #aaaaaa; + padding : 0; +} + +section.main > article { + background : #ffffff; + padding : 1em; + margin : 1em 1em 10em 1em; + border-radius : 0.5em; +} + +h1, h2, h3 { + color : #206ead; + margin-top : 0em; + text-align : center; + margin-bottom : 1em; + -webkit-box-reflect : below -0.25em -webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(0.25, transparent), to(black)); +} + +.nav1 { background-image : url(../img/ic_he_032.png) } +.nav2 { background-image : url(../img/ic_o_032.png) } +.nav3 { background-image : url(../img/ic_ni_032.png) } +.nav4 { background-image : url(../img/ic_fe_032.png) } +.nav5 { background-image : url(../img/ic_na_032.png) } +.nav6 { background-image : url(../img/ic_zn_032.png) } + +h1 { font-size : 1.5em; } +h2 { font-size : 1.2em; } +h3 { font-size : 1.0em; } + +figure { + display : block; + text-align : center; +} + +figure > img { + width : 70%; + margin-bottom : 3em; + -webkit-box-reflect : below 0.25em -webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(0.50, transparent), to(black)); +} + +p:first-line { + font-weight : bold; +} + +p:first-letter { + font-size : 200%; + float : left; + padding-right : 0.1em; +} + diff --git a/examples/webkit/webkit-guide/css/css3_scroll.css b/examples/webkit/webkit-guide/css/css3_scroll.css new file mode 100755 index 0000000000..ae37c34d1e --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_scroll.css @@ -0,0 +1,93 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background-color : #aaaaaa; + font-family : sans-serif; +} + +h1,h2,h3,h4 { + margin-top : 0.5em; + font-size : 18px; + text-align : center; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1.0em 0.5em 6.0em 0.5em; + min-height : 50%; +} + +pre { + font-weight : bold; + font-family : monospace; + padding : 1.0em 3em 1.0em 1.0em; + border : thin solid #aaaaaa; + border-radius : 1.5em; + overflow-x : auto; + background-image : -webkit-gradient(linear,left center,right center,from(#ffffff),to(#777777)); +} + +pre::-webkit-scrollbar { + height : 3em; +} + +pre::-webkit-scrollbar-button:increment { + background-image : url(../img/icon_scroll-right.png); +x background-size : contain; + background-repeat : no-repeat; + width : 3em; + height : 3em; +} + +pre::-webkit-scrollbar-button:decrement { + background-image : url(../img/icon_scroll-left.png); + background-size : contain; + background-repeat : no-repeat; + width : 3em; + height : 3em; +} + +pre::-webkit-scrollbar-track { + display : none; +} + diff --git a/examples/webkit/webkit-guide/css/css3_sel-nth.css b/examples/webkit/webkit-guide/css/css3_sel-nth.css new file mode 100755 index 0000000000..aa1e04b52a --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_sel-nth.css @@ -0,0 +1,63 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +img { + position : absolute; + width : 48px; + height : 48px; + padding : 0.25em; + border : #ffffff medium solid; + border-radius : 0.5em; +} + +/* columns */ +img:nth-of-type(4n-3) { left : 2% } +img:nth-of-type(4n-2) { left : 27% } +img:nth-of-type(4n-1) { left : 52% } +img:nth-of-type(4n-0) { left : 77% } + +/* rows */ +img:nth-of-type(n) { top : 5% } +img:nth-of-type(n+5) { top : 20% } +img:nth-of-type(n+9) { top : 35% } +img:nth-of-type(n+13) { top : 50% } +img:nth-of-type(n+17) { top : 65% } +img:nth-of-type(n+21) { top : 80% } + diff --git a/examples/webkit/webkit-guide/css/css3_shadow.css b/examples/webkit/webkit-guide/css/css3_shadow.css new file mode 100755 index 0000000000..d2f3040a4a --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_shadow.css @@ -0,0 +1,145 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +body > section { + border-radius : 1em; + padding : 1em; + background : #ffffff; + margin-bottom : 10em; + min-height : 70%; +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + +.nav > a { + display : inline-block; + width : 48px; + height : 48px; +} + +nav > a:active { + -webkit-transform : scale(0.8); +} + +h1, h2 { + margin-top : 0em; + font-size : 18px; + text-align : center; +} + +h2 { + border-top : solid thin #aaaaaa; +} + +body > section.main { + position : absolute; + left : 0em; + right : 0em; + top : 5em; + min-height : 50%; + border-radius : 0.5em; + background : #aaaaaa; + padding : 0; +} + +section.main > article { + background : #ffffff; + padding : 1em; + margin : 1em 1em 10em 1em; + border-radius : 0.5em; +} + +section.nav { + z-index : 10; + border-radius : 0; + background : #aaaaaa; + background : transparent; + position : absolute;; + padding : 1em; + top : 0; + right : 0.0em; + left : 0.0em; +} + +nav { + padding : 0.5em; + border-radius : 0.5em; + background : #ffffff; + top : 10px; + text-align : justify; + height : 36px; + overflow : hidden; +} + +nav > a { + display : inline-block; + background-repeat : no-repeat; + height : 36px; + width : 36px; +} + +#force_justify { + padding-left : 100%; +} + +.nav1 { background-image : url(../img/ic_he_032.png) } +.nav2 { background-image : url(../img/ic_o_032.png) } +.nav3 { background-image : url(../img/ic_ni_032.png) } +.nav4 { background-image : url(../img/ic_fe_032.png) } +.nav5 { background-image : url(../img/ic_na_032.png) } +.nav6 { background-image : url(../img/ic_zn_032.png) } + +nav { + -webkit-box-shadow : 0.5em 0.5em #777777; +} + diff --git a/examples/webkit/webkit-guide/css/css3_shadowBlur.css b/examples/webkit/webkit-guide/css/css3_shadowBlur.css new file mode 100755 index 0000000000..f44892735d --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_shadowBlur.css @@ -0,0 +1,145 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +body > section { + border-radius : 1em; + padding : 1em; + background : #ffffff; + margin-bottom : 10em; + min-height : 70%; +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + +.nav > a { + display : inline-block; + width : 48px; + height : 48px; +} + +h1, h2 { + margin-top : 0em; + font-size : 18px; + text-align : center; +} + +h2 { + border-top : solid thin #aaaaaa; +} + +body > section.main { + position : absolute; + left : 0em; + right : 0em; + top : 5em; + min-height : 50%; + border-radius : 0.5em; + background : #aaaaaa; + padding : 0; +} + +section.main > article { + background : #ffffff; + padding : 1em; + margin : 1em 1em 10em 1em; + border-radius : 0.5em; +} + +section.nav { + z-index : 10; + border-radius : 0; + background : #aaaaaa; + background : transparent; + position : absolute;; + padding : 1em; + top : 0; + right : 0.0em; + left : 0.0em; +} + +nav { + padding : 0.5em; + border-radius : 0.5em; + background : #ffffff; + top : 10px; + text-align : justify; + height : 36px; + overflow : hidden; +} + +nav > a { + display : inline-block; + background-repeat : no-repeat; + height : 36px; + width : 36px; +} + +nav > a:active { + -webkit-transform : scale(0.8); +} + +#force_justify { + padding-left : 100%; +} + +.nav1 { background-image : url(../img/ic_he_032.png) } +.nav2 { background-image : url(../img/ic_o_032.png) } +.nav3 { background-image : url(../img/ic_ni_032.png) } +.nav4 { background-image : url(../img/ic_fe_032.png) } +.nav5 { background-image : url(../img/ic_na_032.png) } +.nav6 { background-image : url(../img/ic_zn_032.png) } + +nav { + -webkit-box-shadow : 0.5em 0.5em 0.5em #444444; +} + diff --git a/examples/webkit/webkit-guide/css/css3_text-overflow.css b/examples/webkit/webkit-guide/css/css3_text-overflow.css new file mode 100755 index 0000000000..ba491c41ae --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_text-overflow.css @@ -0,0 +1,119 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + +.accordion { + border : #777777 solid thin; + padding : 0.0em; + border-radius : 0.5em; + list-style : none; +} + +.accordion > li { + padding : 0.5em; + border-bottom : #777777 solid thin; + white-space : nowrap; + max-height : 1.5em; + overflow : hidden; + text-overflow : clip; + text-overflow : ellipsis; + text-overflow : ellipsis-word; + -webkit-transition : max-height 1s ease-in-out; +} + +.accordion > li:last-of-type { + border-bottom : none; +} + +.accordion > li.selected { + -webkit-transition : max-height 1s ease-in-out; + max-height : 100em; + white-space : normal; + font-weight : normal; +} + +.accordion > li.selected:first-line { + font-weight : bold; +} + +.accordion > li.selected:first-letter { + font-size : 200%; + float : left; + padding-right : 0.1em; +} + +.dismiss { + content : url(../img/icon_dismiss.png); +} + +.accordion > li > .dismiss { + display : none; +} + +.accordion > li.selected > .dismiss { + display : block; + float : right; +} + diff --git a/examples/webkit/webkit-guide/css/css3_text-shadow.css b/examples/webkit/webkit-guide/css/css3_text-shadow.css new file mode 100755 index 0000000000..9f06662c95 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_text-shadow.css @@ -0,0 +1,67 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +h1,h2,h3,h4 { + text-align : center; + text-shadow : 0.20em 0.20em 0.20em #999; + color : #206ead; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + diff --git a/examples/webkit/webkit-guide/css/css3_text-stroke.css b/examples/webkit/webkit-guide/css/css3_text-stroke.css new file mode 100755 index 0000000000..4116de8223 --- /dev/null +++ b/examples/webkit/webkit-guide/css/css3_text-stroke.css @@ -0,0 +1,75 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +h1,h2,h3,h4 { + margin-top : 0.5em; + text-align : center; +} + +h1 { + -webkit-text-stroke : 2px #000000; + font-size : 40px; +} + +h1, h2, h3 { + color : #206ead; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + diff --git a/examples/webkit/webkit-guide/css/form_tapper.css b/examples/webkit/webkit-guide/css/form_tapper.css new file mode 100755 index 0000000000..75142b5b19 --- /dev/null +++ b/examples/webkit/webkit-guide/css/form_tapper.css @@ -0,0 +1,108 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/* MOBILE UI */ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +body > section { + border-radius : 1em; + padding : 1em; + background : #ffffff; + margin : 1em 1em 10em 1em; + min-height : 70% +} + +h1, h2 { + margin-top : 1em; + font-size : smaller; + text-align : center; + padding-top : 1em; +} + +h2 { + border-top : solid thin #dddddd; +} + +/* FORM */ + +form { + font-weight : bold; + font-size : small; +} + +input[type=radio], +input[type=checkbox] { + -webkit-appearance : button; + float : right; + margin-bottom : -2em; + opacity : 0; +} + +label, +input[type=radio], +input[type=checkbox] { + width : 90%; + display : block; + padding : 0.5em; + height : 2em; +} + +label { + padding-top : 0.5em; + border : medium solid #aaaaaa; + border-radius : 1.0em; +} + +input[type=radio]:checked + label, +input[type=checkbox]:checked + label { + border : medium solid green; +} + +input[type=radio]:checked + label:after, +input[type=checkbox]:checked + label:after { + float : right; + padding-right : 0.5em; + content : url(../img/icon_check_x24green.png); +} + diff --git a/examples/webkit/webkit-guide/css/form_toggler.css b/examples/webkit/webkit-guide/css/form_toggler.css new file mode 100755 index 0000000000..224053f834 --- /dev/null +++ b/examples/webkit/webkit-guide/css/form_toggler.css @@ -0,0 +1,200 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/* MOBILE UI */ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +body > section { + border-radius : 1em; + padding : 1em; + background : #ffffff; + margin : 1em 1em 10em 1em; + min-height : 70% +} + +h1, h2 { + margin-top : 1em; + font-size : smaller; + text-align : center; + padding-top : 1em; +} + +h2 { + border-top : solid thin #dddddd; +} + + /* FORM */ + +form +{ + line-height : 250%; + font-weight : bold; + font-size : small; +} + + /* DEFAULT INPUT */ + +input[type=radio], +input[type=checkbox] +{ + text-align : right; + padding-top : 0.1em; + text-transform : uppercase; + float : right; + -webkit-appearance : button; + border : 0.25em #aaaaaa solid; + background : #aaaaaa; + background : -webkit-gradient(linear,center top,center bottom,from(#999999),to(#ffffff)); + border-radius : 0.5em; + min-width : 6em; + height : 2em; + display : inline-block; +} + + /* CHECKED INPUT */ + +input[type=radio]:checked, +input[type=checkbox]:checked +{ + text-align : left; +} + + /* FLIPPED INPUT */ + +input.invert +{ + text-align : left; +} + +input.invert:checked +{ + text-align : right; +} + + /* DEFAULT TEXT */ + +input[type=radio]:before, +input[type=checkbox]:before +{ + color : #888888; + height : 1.4em; + display : inline-block; + background : pink; + background : -webkit-gradient(linear,center top,center bottom,from(pink),to(#ffffff)); + min-width : 50%; + content : "off"; + text-align : center; + font-weight : bold; + padding-left : 0.5em; + padding-right : 0.5em; + border-radius : 0.25em; +} + + /* CHECKED TEXT */ + +input[type=radio]:checked:before, +input[type=checkbox]:checked:before +{ + color : #ffffff; + content : "on"; + background : #00aa00; + background : -webkit-gradient(linear,center top,center bottom,from(green),to(cyan)); +} + + /* ALTERNATE DISPLAY */ + +input.yn:before +{ + content : "no"; +} + +input.yn:checked:before +{ + content : "yes"; +} + +input.tf:before +{ + content : "false"; +} + +input.tf:checked:before +{ + content : "true"; +} + + /* BINARY */ + +input.binary { + display : inline-block; +} + +input.binary:checked { + display : none; +} + +input.binary:before { + background : #00aa00; + background : -webkit-gradient(linear,center top,center bottom,from(green),to(cyan)); + color : #ffffff; +} + +input.binary:nth-of-type(odd) { + text-align : left; +} + +input.binary:nth-of-type(even) { + text-align : right; +} + + /* CUSTOM */ + +input.ampm:nth-of-type(odd):before { content : "am"; } +input.ampm:nth-of-type(even):before { content : "pm"; } + +input.sex:nth-of-type(odd):before { content : "male"; } +input.sex:nth-of-type(even):before { content : "female"; } + +input.sex { width : 8em } + diff --git a/examples/webkit/webkit-guide/css/layout_link-fmt.css b/examples/webkit/webkit-guide/css/layout_link-fmt.css new file mode 100755 index 0000000000..5a31aa0736 --- /dev/null +++ b/examples/webkit/webkit-guide/css/layout_link-fmt.css @@ -0,0 +1,137 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +p { + font-weight : normal; +} + +a { + text-wrap : suppress; + -webkit-text-wrap : suppress; +} + +article { + background : #ffffff; + position : absolute; + top : 1em; + left : 1em; + right : 1em; + padding : 1em; + border-radius : 1em; + margin-bottom : 2em; +} + +ol { + padding-left : 1em; +} + +ol.links { + margin-bottom : 1em; + border : #aaaaaa thin solid; + list-style : none; + padding-top : 0.5em; + padding-bottom : 0.5em; + padding-left : 0em; + border-radius : 1.0em; +} + +ol.links > li { + min-height : 2em; + border-bottom : #aaaaaa thin solid; + padding-left : 0.5em; + padding-right : 0.5em; + padding-top : 0.5em; +} + +ol.links > li:last-of-type { + border : none; +} + +p a[href]:after { + -webkit-transform : scale(0.6); + -webkit-transform-origin : bottom; + padding-left : 0.25em; + padding-right : 0.0em; + display : inline-block; +} + +a[href] { + text-decoration : none; +} + +ol.links > li > a { + display : block; +} + +ol.links a:after { + -webkit-transform : scale(0.8); + -webkit-transform-origin : top; +} + +a[href^="http://"]:after, a[href^="https://"]:after { + content : url(../img/icon_link-external.png); +} + +a[href^="mailto:"]:after { content : url(../img/icon_link-email.png); } + +a[href^="sms:"]:after { content : url(../img/icon_link-sms.png); } + +a[href^="tel:"]:after { content : url(../img/icon_link-tel.png); } + +a[href$=".doc"]:after { content : url(../img/icon_link-doc.png); } + +a[href$=".ppt"]:after { content : url(../img/icon_link-ppt.png); } + +a[href$=".rss"]:after, +a[href$=".xml"]:after { content : url(../img/icon_link-rss.png); } + +a[href$=".pdf"]:after { content : url(../img/icon_link-pdf.png); } + +a[href$=".xls"]:after { content : url(../img/icon_link-xls.png); } + +ol.links a:after { + float : right; +} diff --git a/examples/webkit/webkit-guide/css/layout_tbl-keyhole.css b/examples/webkit/webkit-guide/css/layout_tbl-keyhole.css new file mode 100755 index 0000000000..1205822e6d --- /dev/null +++ b/examples/webkit/webkit-guide/css/layout_tbl-keyhole.css @@ -0,0 +1,147 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; +} + +.mobile { + display : block; +} + +.mobile > thead > th, +.mobile > thead > tr { + display : none; +} + +.mobile > tbody > tr { + display : none; + background : #ffffff; + padding : 0.5em; + padding-top : 0.5em; + border-radius : 0.25em; +} + +.mobile > tbody > tr:target { + display : block; + border : medium solid #aaaaaa; +} + +.mobile > tbody > tr:nth-of-type(1) { + padding-top : 0.5em; +} + +.mobile td { + display : block; +} + +.mobile td:before { + font-style : italic; + font-weight : bold; +} + +.mobile td:nth-of-type(5n+1) { + font-weight : bold; + color : #206ead; +} + +.mobile td:nth-of-type(5n+2):before { + content : 'Price: '; +} +.mobile td:nth-of-type(5n+3):before { + content : 'Location: '; +} +.mobile td:nth-of-type(5n+4):before { + content : 'Posted: '; +} + +table th.nav { + display : none; +} + +.mobile tbody th.nav { + display : block; + width : 36px; + float : right; +} + +th.nav a { + display : inline-block; + width : 36px; + height : 36px; + background : #ffffff; + content : url(../img/icon_nav-up.png); + margin-bottom : 0.5em; +} + +th.nav a:nth-of-type(even) { + -webkit-transform : rotate(180deg); +} + +tr:first-of-type th.nav a:nth-of-type(odd), +tr:last-of-type th.nav a:nth-of-type(even) +{ + content : url(../img/icon_dismiss.png); +} + +tr th.nav a { + display : none; +} + +tr:first-of-type th.nav a, +tr:last-of-type th.nav a, +tr:target th.nav a { + display : block; +} + +article { + background : #ffffff; + border-radius : 0.5em; + margin : 0.5em; + padding : 0.5em; +} + +h1 { + margin-top : 0.5em; + text-align : center; + font-size : 18px; +} + diff --git a/examples/webkit/webkit-guide/css/mob_condjs.css b/examples/webkit/webkit-guide/css/mob_condjs.css new file mode 100755 index 0000000000..6e312926ec --- /dev/null +++ b/examples/webkit/webkit-guide/css/mob_condjs.css @@ -0,0 +1,55 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#js { + background : pink; + padding : 0.5em; + border-radius : 0.5em; +} +#js, #design { + padding : 0.5em; + border-radius : 0.5em; +} +#js { + background : pink; +} +#design { + background : lightgreen; +} diff --git a/examples/webkit/webkit-guide/css/mob_mediaquery.css b/examples/webkit/webkit-guide/css/mob_mediaquery.css new file mode 100755 index 0000000000..bbd0fbcc88 --- /dev/null +++ b/examples/webkit/webkit-guide/css/mob_mediaquery.css @@ -0,0 +1,49 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#design { + padding : 0.5em; + border-radius : 0.5em; + background : lightgreen; +} + +#design { + background : lightgreen; +} diff --git a/examples/webkit/webkit-guide/css/mobile.css b/examples/webkit/webkit-guide/css/mobile.css new file mode 100755 index 0000000000..5b9332c3ce --- /dev/null +++ b/examples/webkit/webkit-guide/css/mobile.css @@ -0,0 +1,82 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + width : 100; +} + +body > section { + border-radius : 1em; + background : #ffffff; + border-radius : 1em; + padding : 1em; + background : #ffffff; + min-height : 70% +} + +.hidden { + display : none; +} + +.active { + color : blue; + cursor : pointer; + text-decoration : none; +} + +.nav > a { + display : inline-block; + width : 48px; + height : 48px; +} + +h1, h2 { + margin-top : 1em; + font-size : smaller; + text-align : center; + padding-top : 1em; +} + +h2 { + border-top : solid thin #dddddd; +} + diff --git a/examples/webkit/webkit-guide/css/mq_desktop.css b/examples/webkit/webkit-guide/css/mq_desktop.css new file mode 100755 index 0000000000..32d49bfa63 --- /dev/null +++ b/examples/webkit/webkit-guide/css/mq_desktop.css @@ -0,0 +1,70 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + +#design:before { + content : "CSS thinks you are viewing this page with a full desktop browser." +} + diff --git a/examples/webkit/webkit-guide/css/mq_mobile.css b/examples/webkit/webkit-guide/css/mq_mobile.css new file mode 100755 index 0000000000..f1e87f67ce --- /dev/null +++ b/examples/webkit/webkit-guide/css/mq_mobile.css @@ -0,0 +1,69 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + +#design:before { + content : "CSS thinks you are viewing this page with a non-touch mobile browser." +} diff --git a/examples/webkit/webkit-guide/css/mq_touch.css b/examples/webkit/webkit-guide/css/mq_touch.css new file mode 100755 index 0000000000..3d2a5b6cd5 --- /dev/null +++ b/examples/webkit/webkit-guide/css/mq_touch.css @@ -0,0 +1,69 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background : #aaaaaa; + font-family : sans-serif; + font-weight : bold; +} + +h1,h2,h3,h4 { + text-align : center; +} + +section { + position : absolute; + top : 0; + left : 0; + right : 0; + bottom : 0; +} + +article { + background : #ffffff; + border-radius : 1.0em; + padding : 1.0em; + margin : 1em; + min-height : 50%; +} + +#design:before { + content : "CSS thinks you are viewing this page with a touch-based mobile browser." +} diff --git a/examples/webkit/webkit-guide/css/mqlayout_desktop.css b/examples/webkit/webkit-guide/css/mqlayout_desktop.css new file mode 100755 index 0000000000..0875732145 --- /dev/null +++ b/examples/webkit/webkit-guide/css/mqlayout_desktop.css @@ -0,0 +1,92 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/* Desktop UI */ + +body { + font-family : sans-serif; + font-weight : bold; + min-width : 60em; +} + +nav, body > section, header, footer { + border-radius : 0.5em; + padding : 0.5em; +} + +nav, section { + min-height : 30em; +} + +header { + background-color : pink; + height : 3em; + margin-bottom : 1em; +} + +section#main { + background-color : lightgreen; + float : left; + margin-bottom : 1em; + margin-left : 2%; + min-width : 60%; +} + +nav { + background-color : lightblue; + float : left; + margin-bottom : 1em; + width : 15%; +} + +section#sidebar { + background-color : plum; + float : left; + margin-bottom : 1em; + margin-left : 2%; + width : 15%; +} + +footer { + background-color : gold; + clear : both; + height : 3em; +} + diff --git a/examples/webkit/webkit-guide/css/mqlayout_mobile.css b/examples/webkit/webkit-guide/css/mqlayout_mobile.css new file mode 100755 index 0000000000..dcd4943749 --- /dev/null +++ b/examples/webkit/webkit-guide/css/mqlayout_mobile.css @@ -0,0 +1,82 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/* Mobile UI */ + +body { + font-family : sans-serif; + font-weight : bold; +} + +nav, body > section, header, footer { + padding : 0.5em; +} + +header { + display : none; +} + +section#main { + background-color : lightgreen; + margin-bottom : 1em; +} + +nav:after { + float : right; + content : '[ICON]'; +} + +nav:before { + content : 'SIMPLE '; +} + +nav { + background-color : lightblue; + margin-bottom : 1em; +} + +section#sidebar { + display : none; +} + +footer { + background-color : gold; +} + diff --git a/examples/webkit/webkit-guide/css/mqlayout_touch.css b/examples/webkit/webkit-guide/css/mqlayout_touch.css new file mode 100755 index 0000000000..78ed1741c3 --- /dev/null +++ b/examples/webkit/webkit-guide/css/mqlayout_touch.css @@ -0,0 +1,86 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +/* Touch UI */ + +body { + font-family : sans-serif; + font-weight : bold; +} + +nav, body > section, header, footer { + border-radius : 0.5em; + padding : 0.5em; +} + +header { + background-color : pink; + margin-bottom : 1em; + float : left; + width : 30%; + height : 3em; +} + +section#main { + background-color : lightgreen; + margin-bottom : 1em; + min-height : 20em; +} + +nav:before { + content : 'TOUCH '; +} + +nav { + background-color : lightblue; + margin-bottom : 1em; + margin-left : 40%; + max-width : 60%; + height : 3em; +} + +section#sidebar { + display : none; +} + +footer { + background-color : gold; +} + diff --git a/examples/webkit/webkit-guide/css/storage.css b/examples/webkit/webkit-guide/css/storage.css new file mode 100755 index 0000000000..a1f1a13921 --- /dev/null +++ b/examples/webkit/webkit-guide/css/storage.css @@ -0,0 +1,156 @@ +/**************************************************************************** +** +** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies). +** All rights reserved. +** Contact: Nokia Corporation (qt-info@nokia.com) +** +** This file is part of the Qt WebKit module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:BSD$ +** You may use this file under the terms of the BSD license as follows: +** +** "Redistribution and use in source and binary forms, with or without +** modification, are permitted provided that the following conditions are +** met: +** * Redistributions of source code must retain the above copyright +** notice, this list of conditions and the following disclaimer. +** * Redistributions in binary form must reproduce the above copyright +** notice, this list of conditions and the following disclaimer in +** the documentation and/or other materials provided with the +** distribution. +** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor +** the names of its contributors may be used to endorse or promote +** products derived from this software without specific prior written +** permission. +** +** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS +** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT +** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR +** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT +** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, +** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT +** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, +** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY +** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE +** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." +** $QT_END_LICENSE$ +** +****************************************************************************/ + +body { + background-color : #aaaaaa; + font-family : sans-serif; + padding: 1em; +} + +body.off > h1 { + background-color : pink; + background-image : url(../img/offline.png), -webkit-gradient(linear,center top,center bottom,from(#ffffff),to(#ffffff)) +; +} + +body.on > h1 { + background-color : lightgreen; + background-image : url(../img/online.png), -webkit-gradient(linear,center top,center bottom,from(#ffffff),to(#ffffff)) +; +} + +body.unknown > h1 { + background-image : url(../img/offline_idle.png), -webkit-gradient(linear,center top,center bottom,from(#ffffff),to(#ffffff)); +} + + +h1 { + background-color : #ffffff; + background-repeat : no-repeat; + background-position : 0.5em center, 0 0; + height : 1.25em; + border-radius : 0.5em; + margin : 0.0em; + padding : 0.5em; + text-align : center; + font-size : 18px; +} + +form.show { + display : block; + z-index : 99; +} + +form.hide { + display : none; +} + +#cred { + background : #ffffff; + padding : 1em; + border-radius : 1.0em; + position : absolute; + left : 1.0em;; + right : 1.0em;; + top : 1.0em;; + bottom : 1.0em;; +} + +#cred > input, #email > input { + height : 2.0em; + width : 95%; + border-radius : 0.5em; + padding-left : 0.5em; +} + +#cred > img { + float : right; +} + +#cred > div:first-of-type { + margin-top : 2em; +} + +#cred > div, #email > div { + font-weight : bold; + margin : 0.5em; +} + +#cred > input[type='submit'] { + background : lightgreen; + font-weight : bold; +} + +#cred > input[type='submit']:active { + background : #777777; + color : #ffffff; +} + +#cred > input.validate:invalid { + background : pink; +} + +#cred > input.validate:invalid:after { + content : "need!"; +} + +#cred > input { + background : #ffffff; + -webkit-transition : all 1s linear; +} + +#openform { + float : right; +} + +#email { + background : #ffffff; + min-height : 6em; + margin-top : 1em; + border-radius : 0.5em; + padding : 0.5em; +} + +textarea { + min-height : 10em; + width : 95%; + border-radius : 0.5em; +} + |